Skip to content

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Some frontend code style improvements
Browse files Browse the repository at this point in the history
bclswl0827 committed Mar 7, 2024
1 parent 73eb6f7 commit bca8286
Showing 46 changed files with 190 additions and 118 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -2,6 +2,10 @@

Starting from v2.2.5, all notable changes to this project will be documented in this file.

## v2.11.1

- Some frontend code style improvements

## v2.11.0

- Using NoSQL database as SeedLink ring buffer backend
2 changes: 1 addition & 1 deletion VERSION
Original file line number Diff line number Diff line change
@@ -1 +1 @@
v2.11.0
v2.11.1
14 changes: 7 additions & 7 deletions frontend/dist/asset-manifest.json
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
{
"files": {
"main.css": "./static/css/main.7a040865.css",
"main.js": "./static/js/main.0106568b.js",
"main.js": "./static/js/main.3a6635dd.js",
"static/css/594.d6bfd15f.chunk.css": "./static/css/594.d6bfd15f.chunk.css",
"static/js/594.68c41e5c.chunk.js": "./static/js/594.68c41e5c.chunk.js",
"static/js/846.0d861cd5.chunk.js": "./static/js/846.0d861cd5.chunk.js",
"static/js/154.7cd0759f.chunk.js": "./static/js/154.7cd0759f.chunk.js",
"static/js/600.a3645b48.chunk.js": "./static/js/600.a3645b48.chunk.js",
"static/js/708.29f6a2d2.chunk.js": "./static/js/708.29f6a2d2.chunk.js",
"static/js/594.ef2a52fb.chunk.js": "./static/js/594.ef2a52fb.chunk.js",
"static/js/846.a985bbed.chunk.js": "./static/js/846.a985bbed.chunk.js",
"static/js/154.9e0d2f09.chunk.js": "./static/js/154.9e0d2f09.chunk.js",
"static/js/600.a5f3996c.chunk.js": "./static/js/600.a5f3996c.chunk.js",
"static/js/708.4971cdf7.chunk.js": "./static/js/708.4971cdf7.chunk.js",
"static/js/699.e75d4402.chunk.js": "./static/js/699.e75d4402.chunk.js",
"static/js/654.18cf5201.chunk.js": "./static/js/654.18cf5201.chunk.js",
"static/js/548.b98bfbf6.chunk.js": "./static/js/548.b98bfbf6.chunk.js",
@@ -49,6 +49,6 @@
},
"entrypoints": [
"static/css/main.7a040865.css",
"static/js/main.0106568b.js"
"static/js/main.3a6635dd.js"
]
}
2 changes: 1 addition & 1 deletion frontend/dist/index.html
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!doctype html><html><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/><link rel="apple-touch-icon" href="./logo192.png"/><link rel="manifest" href="./manifest.json"/><style>.public-loading{width:100%;height:100%;display:flex;position:fixed;align-items:center;flex-direction:column;justify-content:center}.public-loading span{color:#1f2937;margin-top:20px;font-weight:600;font-size:1.25rem}.public-loading svg{animation:rotate 1s linear infinite}@keyframes rotate{100%{transform:rotate(360deg)}}</style><script defer="defer" src="./static/js/main.0106568b.js"></script><link href="./static/css/main.7a040865.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div class="public-loading"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="#6b21a8" width="70px"><path d="M304 48a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zm0 416a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zM48 304a48 48 0 1 0 0-96 48 48 0 1 0 0 96zm464-48a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zM142.9 437A48 48 0 1 0 75 369.1 48 48 0 1 0 142.9 437zm0-294.2A48 48 0 1 0 75 75a48 48 0 1 0 67.9 67.9zM369.1 437A48 48 0 1 0 437 369.1 48 48 0 1 0 369.1 437z"/></svg> <span>Loading...</span></div><div id="root"></div></body></html>
<!doctype html><html><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/><link rel="apple-touch-icon" href="./logo192.png"/><link rel="manifest" href="./manifest.json"/><style>.public-loading{width:100%;height:100%;display:flex;position:fixed;align-items:center;flex-direction:column;justify-content:center}.public-loading span{color:#1f2937;margin-top:20px;font-weight:600;font-size:1.25rem}.public-loading svg{animation:rotate 1s linear infinite}@keyframes rotate{100%{transform:rotate(360deg)}}</style><script defer="defer" src="./static/js/main.3a6635dd.js"></script><link href="./static/css/main.7a040865.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div class="public-loading"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="#6b21a8" width="70px"><path d="M304 48a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zm0 416a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zM48 304a48 48 0 1 0 0-96 48 48 0 1 0 0 96zm464-48a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zM142.9 437A48 48 0 1 0 75 369.1 48 48 0 1 0 142.9 437zm0-294.2A48 48 0 1 0 75 75a48 48 0 1 0 67.9 67.9zM369.1 437A48 48 0 1 0 437 369.1 48 48 0 1 0 369.1 437z"/></svg> <span>Loading...</span></div><div id="root"></div></body></html>
1 change: 0 additions & 1 deletion frontend/dist/static/js/154.7cd0759f.chunk.js

This file was deleted.

1 change: 1 addition & 0 deletions frontend/dist/static/js/154.9e0d2f09.chunk.js

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion frontend/dist/static/js/594.68c41e5c.chunk.js

This file was deleted.

1 change: 1 addition & 0 deletions frontend/dist/static/js/594.ef2a52fb.chunk.js
1 change: 0 additions & 1 deletion frontend/dist/static/js/600.a3645b48.chunk.js

This file was deleted.

1 change: 1 addition & 0 deletions frontend/dist/static/js/600.a5f3996c.chunk.js
1 change: 0 additions & 1 deletion frontend/dist/static/js/708.29f6a2d2.chunk.js

This file was deleted.

1 change: 1 addition & 0 deletions frontend/dist/static/js/708.4971cdf7.chunk.js
1 change: 0 additions & 1 deletion frontend/dist/static/js/846.0d861cd5.chunk.js

This file was deleted.

1 change: 1 addition & 0 deletions frontend/dist/static/js/846.a985bbed.chunk.js
2 changes: 0 additions & 2 deletions frontend/dist/static/js/main.0106568b.js

This file was deleted.

2 changes: 2 additions & 0 deletions frontend/dist/static/js/main.3a6635dd.js

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions frontend/src/.env
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
REACT_APP_VERSION=v2.11.0
REACT_APP_RELEASE=35beebc3-20240306224424
REACT_APP_VERSION=v2.11.1
REACT_APP_RELEASE=73eb6f73-20240307132010
15 changes: 9 additions & 6 deletions frontend/src/src/App.tsx
Original file line number Diff line number Diff line change
@@ -49,8 +49,9 @@ const App = () => {
const [currentTitle, setCurrentTitle] = useState(title);
const [currentLocale, setCurrentLocale] = useState(fallback);

const setCurrentLocaleToState = async () =>
setCurrentLocale(await getCurrentLocale(i18n));
const setCurrentLocaleToState = async () => {
void setCurrentLocale(await getCurrentLocale(i18n));
};

const getCurrentTitle = useCallback(() => {
for (const key in routes) {
@@ -64,7 +65,7 @@ const App = () => {
}, [routes, pathname, currentLocale]);

useEffect(() => {
setCurrentLocaleToState();
void setCurrentLocaleToState();
const subtitle = getCurrentTitle();
setCurrentTitle(subtitle);
document.title = `${subtitle} - ${title}`;
@@ -79,7 +80,7 @@ const App = () => {
timeout: 30,
endpoint: endpoints.station,
});
if (res?.data) {
if (!!res?.data) {
const initialized = true;
const { sensitivity, frequency } = res.data.geophone;
dispatch(UpdateGeophone({ sensitivity, frequency, initialized }));
@@ -93,10 +94,12 @@ const App = () => {
}, [dispatch]);

useEffect(() => {
getStationAttributes();
void getStationAttributes();
}, [getStationAttributes]);

const handleSwitchLocale = (locale: string) => setUserLocale(i18n, locale);
const handleSwitchLocale = (locale: string) => {
setUserLocale(i18n, locale);
};

const locales = Object.entries(resources).reduce((acc, [key, value]) => {
acc[key] = value.label;
2 changes: 1 addition & 1 deletion frontend/src/src/components/Chart.tsx
Original file line number Diff line number Diff line change
@@ -9,7 +9,7 @@ import { Options, SeriesOptionsType } from "highcharts";
import { useTranslation } from "react-i18next";

const hasWebGLSupport = () => {
if (window.WebGLRenderingContext) {
if (!!window.WebGLRenderingContext) {
const canvas = document.createElement("canvas");
const names = [
"webgl",
8 changes: 6 additions & 2 deletions frontend/src/src/components/Code.tsx
Original file line number Diff line number Diff line change
@@ -38,7 +38,9 @@ export const Code = (props: CodeProps) => {
<div className="flex justify-end space-x-3 px-4">
<div
className="opacity-60 hover:opacity-100 transition-all cursor-pointer"
onClick={() => handleCopy(children)}
onClick={() => {
handleCopy(children);
}}
>
<img
className={`size-4 ${isCopied ? "hidden" : "block"}`}
@@ -54,7 +56,9 @@ export const Code = (props: CodeProps) => {
{!!fileName?.length && (
<div
className="opacity-60 hover:opacity-100 transition-all cursor-pointer"
onClick={() => handleDownload(children)}
onClick={() => {
handleDownload(children);
}}
>
<img className="size-4" src={saveIcon} alt="" />
</div>
6 changes: 3 additions & 3 deletions frontend/src/src/components/Form.tsx
Original file line number Diff line number Diff line change
@@ -71,9 +71,9 @@ export const Form = (props: FormProps) => {
labelId="select"
label={placeholder}
defaultValue={selectOptions?.[0].value}
onChange={({ target }) =>
setSelectValue(target?.value)
}
onChange={({ target }) => {
setSelectValue(target.value);
}}
>
{selectOptions?.map(({ value, label }) => (
<MenuItem key={value} value={value}>
14 changes: 8 additions & 6 deletions frontend/src/src/components/Holder.tsx
Original file line number Diff line number Diff line change
@@ -23,11 +23,11 @@ export const Holder = (props: HolderProps) => {
const [advancedOpen, setAdvancedOpen] = useState<boolean>(false);

useEffect(() => {
const initCollapse = collapse || CollapseMode.COLLAPSE_DISABLE;
const initCollapse = collapse ?? CollapseMode.COLLAPSE_DISABLE;
setCollapsed(initCollapse === CollapseMode.COLLAPSE_HIDE);
}, [collapse]);

const currentCollapse = collapse || CollapseMode.COLLAPSE_DISABLE;
const currentCollapse = collapse ?? CollapseMode.COLLAPSE_DISABLE;
const collapse_is_enabled =
currentCollapse !== CollapseMode.COLLAPSE_DISABLE;

@@ -42,9 +42,9 @@ export const Holder = (props: HolderProps) => {
className={`text-md font-bold text-gray-800 flex ${
collapse_is_enabled ? "cursor-pointer select-none" : ""
}`}
onClick={() =>
collapse_is_enabled && setCollapsed(!collapsed)
}
onClick={() => {
collapse_is_enabled && setCollapsed(!collapsed);
}}
>
{collapse_is_enabled && (
<img
@@ -70,7 +70,9 @@ export const Holder = (props: HolderProps) => {
>
<div
className="mx-1 cursor-pointer"
onClick={() => setAdvancedOpen(!advancedOpen)}
onClick={() => {
setAdvancedOpen(!advancedOpen);
}}
>
<img
className={`size-4 ${
15 changes: 9 additions & 6 deletions frontend/src/src/components/Scroller.tsx
Original file line number Diff line number Diff line change
@@ -9,16 +9,19 @@ export const Scroller = (props: ScrollerProps) => {
const { threshold = 100 } = props;
const [showButton, setShowButton] = useState(false);

const scrollToTop = () => window.scrollTo({ top: 0, behavior: "smooth" });
const scrollToTop = () => {
window.scrollTo({ top: 0, behavior: "smooth" });
};

const toggleButton = useCallback(
() => setShowButton(window.scrollY > threshold),
[threshold]
);
const toggleButton = useCallback(() => {
setShowButton(window.scrollY > threshold);
}, [threshold]);

useEffect(() => {
document.addEventListener("scroll", toggleButton);
return () => document.removeEventListener("scroll", toggleButton);
return () => {
document.removeEventListener("scroll", toggleButton);
};
}, [toggleButton]);

return (
8 changes: 4 additions & 4 deletions frontend/src/src/components/Select.tsx
Original file line number Diff line number Diff line change
@@ -14,7 +14,7 @@ import {
export interface SelectProps {
readonly open: boolean;
readonly title?: string;
readonly options?: (string)[][];
readonly options?: string[][];
readonly onClose?: () => void;
readonly onSelect?: (value: string) => void;
}
@@ -43,9 +43,9 @@ export const Select = (props: SelectProps) => {
<div key={item[1]}>
<ListItem>
<ListItemButton
onClick={() =>
onSelect && onSelect(item[1])
}
onClick={() => {
onSelect && onSelect(item[1]);
}}
>
<ListItemText
primary={item[0]}
4 changes: 3 additions & 1 deletion frontend/src/src/components/Sidebar.tsx
Original file line number Diff line number Diff line change
@@ -35,7 +35,9 @@ export const Sidebar = (props: SidebarProps) => {
</div>
<div
className="-right-6 cursor-pointer duration-500 border-4 border-white bg-gray-800 hover:bg-purple-500 absolute top-2 p-3 rounded-full hover:rotate-45"
onClick={() => setIsSidebarOpen(!isSidebarOpen)}
onClick={() => {
setIsSidebarOpen(!isSidebarOpen);
}}
>
<img className="size-4" src={MenuIcon} alt="" />
</div>
14 changes: 8 additions & 6 deletions frontend/src/src/components/Table.tsx
Original file line number Diff line number Diff line change
@@ -6,9 +6,9 @@ export interface TableColumn {
label: string;
}

export type TableData = {
export interface TableData {
[key: TableColumn["key"]]: string | number;
};
}

export interface TableAction {
icon: string;
@@ -31,8 +31,9 @@ export const Table = (props: TableProps) => {

const [rowsLength, setRowsLength] = useState(rowsLimit ?? -1);

const loadMoreRows = () =>
const loadMoreRows = () => {
setRowsLength((currentLength) => currentLength + (rowsLimit ?? 0));
};

return (
<div className="flex flex-col overflow-x-auto">
@@ -97,9 +98,10 @@ export const Table = (props: TableProps) => {
<td
key={label}
className="px-6 py-4 whitespace-nowrap text-sm font-medium"
onClick={() =>
onClick && onClick(item)
}
onClick={() => {
onClick &&
onClick(item);
}}
>
<img
className="w-5 h-5 cursor-pointer transition-all duration-200 hover:scale-125"
Loading

0 comments on commit bca8286

Please sign in to comment.