Run prettier

codeforbielefeld · Aug 7, 2023 · ec226d6 · ec226d6
1 parent af3070e
commit ec226d6
Show file tree

Hide file tree

Showing 12 changed files with 58 additions and 99 deletions.
diff --git a/.github/workflows/build_and_deploy.yml b/.github/workflows/build_and_deploy.yml
@@ -19,7 +19,7 @@ jobs:
 
         strategy:
             matrix:
-                node-version: [16.x]
+                node-version: [18.x]
 
         steps:
             - name: 🚚 Get latest code

diff --git a/.prettierrc.json b/.prettierrc.json
@@ -1,5 +1,6 @@
 {
     "tabWidth": 4,
+    "printWidth": 120,
     "overrides": [
         {
             "files": "*.md",

diff --git a/public/index.html b/public/index.html
@@ -5,10 +5,7 @@
         <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <meta name="theme-color" content="#000000" />
-        <meta
-            name="description"
-            content="Bodenfeuchtigkeitskarte des Teuteburger Waldes"
-        />
+        <meta name="description" content="Bodenfeuchtigkeitskarte des Teuteburger Waldes" />
         <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
         <!--
       manifest.json provides metadata used when your web app is installed on a

diff --git a/src/App.tsx b/src/App.tsx
@@ -26,10 +26,8 @@ function App() {
     const [map, setMap] = React.useState<LeafletMap>();
     const zoom = 13;
 
-    const [imprintOpen, { setTrue: openImprint, setFalse: dismissImprint }] =
-        useBoolean(false);
-    const [infoOpen, { setTrue: openInfo, setFalse: dismissInfo }] =
-        useBoolean(false);
+    const [imprintOpen, { setTrue: openImprint, setFalse: dismissImprint }] = useBoolean(false);
+    const [infoOpen, { setTrue: openInfo, setFalse: dismissInfo }] = useBoolean(false);
 
     useEffect(() => {
         const cb = () => setHeight(window.innerHeight);
@@ -39,22 +37,13 @@ function App() {
 
     return (
         <div className="App">
-            <SidePanel
-                isOpen={infoOpen}
-                dismissPanel={() => dismissInfo()}
-                children={<Markdown file={"info.md"} />}
-            />
+            <SidePanel isOpen={infoOpen} dismissPanel={() => dismissInfo()} children={<Markdown file={"info.md"} />} />
             <SidePanel
                 isOpen={imprintOpen}
                 dismissPanel={() => dismissImprint()}
                 children={<Markdown file={"imprint.md"} />}
             />
-            <MapContainer
-                zoomControl={false}
-                center={position}
-                zoom={zoom}
-                style={{ height: height }}
-            >
+            <MapContainer zoomControl={false} center={position} zoom={zoom} style={{ height: height }}>
                 <MapHack setMap={setMap} />
                 <MoistureMarkers />
                 <TileLayer

diff --git a/src/components/CommandBar/index.tsx b/src/components/CommandBar/index.tsx
@@ -9,12 +9,7 @@ interface CommandBarProps {
     openInfo: () => void;
 }
 
-const AppCommandBar: React.FunctionComponent<CommandBarProps> = ({
-    zoomIn,
-    zoomOut,
-    openImprint,
-    openInfo,
-}) => (
+const AppCommandBar: React.FunctionComponent<CommandBarProps> = ({ zoomIn, zoomOut, openImprint, openInfo }) => (
     <div className={"CommandBar"}>
         <CommandBar
             translate={"no"}

diff --git a/src/components/MoistureMarkers/index.tsx b/src/components/MoistureMarkers/index.tsx
@@ -49,9 +49,7 @@ const icon = (record: SensorInfo) =>
         className: "custom-pin",
         iconAnchor: [30, 83],
         popupAnchor: [-14, -83],
-        html: renderToString(
-            <img src={getImageForMeasurment(record)} alt={"tag"}></img>,
-        ),
+        html: renderToString(<img src={getImageForMeasurment(record)} alt={"tag"}></img>),
     });
 
 const getImageForMeasurment = (record: SensorInfo) => {
@@ -75,20 +73,14 @@ const MoistureMarkers: React.FC = () => {
     else if (error)
         return (
             <Overlay isDarkThemed={true} className={styles.overlay}>
-                <div className={styles.loading}>
-                    Fehler beim Laden der Daten :(
-                </div>
+                <div className={styles.loading}>Fehler beim Laden der Daten :(</div>
             </Overlay>
         );
     else
         return (
             <>
                 {data?.records?.map((record: SensorInfo, idx) => (
-                    <Marker
-                        key={idx}
-                        icon={icon(record)}
-                        position={[record.latitude, record.longitude]}
-                    >
+                    <Marker key={idx} icon={icon(record)} position={[record.latitude, record.longitude]}>
                         <Popup className="request-popup">
                             <SensorTooltip record={record} />
                         </Popup>

diff --git a/src/components/SensorTooltip/index.tsx b/src/components/SensorTooltip/index.tsx
@@ -40,60 +40,48 @@ const styles = mergeStyleSets({
 });
 
 const SensorTooltip = ({ record }: { record: SensorInfo }) => {
-    const format = (n: number) =>
-        new Intl.NumberFormat("de-DE", {
-            maximumFractionDigits: 2,
-        }).format(n);
+    const format = (n: number) => new Intl.NumberFormat("de-DE", { maximumFractionDigits: 2 }).format(Number(n));
     return (
         <>
-            <div className={styles.header}>
-                <Text className={styles.title}>
-                    Bodenfeuchte {format(record.soil_moisture)} %
-                </Text>
-            </div>
             <div className={styles.inner}>
                 <table>
+                    <thead>
+                        <td></td>
+                        <td>tagesmittel</td>
+                        <td>letzte</td>
+                    </thead>
                     <tbody>
-                        {record.soil_temperature != null && (
+                        <tr>
+                            <td>Bodenfeuchte</td>
+                            <td>{format(record.avg_soil_moisture)} %</td>
+                            <td>{format(record.soil_moisture)} %</td>
+                        </tr>
+                        {record.soil_temperature != null && record.avg_soil_temperature != null && (
                             <tr>
-                                <td>
-                                    <Text>Bodentemperatur</Text>
-                                </td>
-                                <td>
-                                    <Text>
-                                        {format(record.soil_temperature)} °C
-                                    </Text>
-                                </td>
+                                <td>Bodentemperatur</td>
+                                <td>{format(record.avg_soil_temperature)} °C</td>
+                                <td>{format(record.soil_temperature)} °C</td>
                             </tr>
                         )}
-                        {record.soil_conductivity != null && (
+                        {record.soil_conductivity != null && record.avg_soil_conductivity != null && (
                             <tr>
-                                <td>
-                                    <Text>Leitfähigkeit</Text>
-                                </td>
-                                <td>
-                                    <Text>
-                                        {format(record.soil_conductivity)} μS/cm
-                                    </Text>
-                                </td>
+                                <td>Leitfähigkeit</td>
+                                <td>{format(record.avg_soil_conductivity)} μS/cm</td>
+                                <td>{format(record.soil_conductivity)} μS/cm</td>
                             </tr>
                         )}
-                        {record.battery != null && (
+                        {record.battery != null && record.avg_battery != null && (
                             <tr>
-                                <td>
-                                    <Text>Batteriespannung</Text>
-                                </td>
-                                <td>
-                                    <Text>{format(record.battery)} V</Text>
-                                </td>
+                                <td>Batteriespannung</td>
+                                <td>{format(record.avg_battery)} V</td>
+                                <td>{format(record.battery)} V</td>
                             </tr>
                         )}
                     </tbody>
                 </table>
                 <div className={styles.footer}>
                     <Text className={styles.subtext}>
-                        Letzte Aktualisierung:{" "}
-                        {record.last_updated.toLocaleString()}
+                        Letzte Aktualisierung: {record.last_updated.toLocaleString()}
                     </Text>
                 </div>
             </div>

diff --git a/src/components/SidePanel/index.tsx b/src/components/SidePanel/index.tsx
@@ -7,11 +7,7 @@ interface SidePanelProps {
     dismissPanel: () => void;
 }
 
-const SidePanel: React.FunctionComponent<SidePanelProps> = ({
-    children,
-    isOpen,
-    dismissPanel,
-}) => (
+const SidePanel: React.FunctionComponent<SidePanelProps> = ({ children, isOpen, dismissPanel }) => (
     <Panel
         className="SidePanel"
         isBlocking={true}

diff --git a/src/hooks/useMoistureData.ts b/src/hooks/useMoistureData.ts
@@ -12,7 +12,8 @@ const MOCK_DATA: MoistureDataDto = {
             latitude: 52.03333,
             longitude: 8.53333,
             altitude: 0,
-            soil_moisture: 13.37,
+            soil_moisture: 13,
+            avg_soil_moisture: 13.37,
             device: "mock",
             last_update: "1970-01-01 00:00:00",
         },
@@ -47,9 +48,7 @@ export default function useMoistureData(): MoistureState {
         error,
         data: dto,
         cache,
-    } = useFetch<MoistureDataDto>(MOISTURE_DATA_URL, { cache: "reload" }, [
-        signal,
-    ]);
+    } = useFetch<MoistureDataDto>(MOISTURE_DATA_URL, { cache: "reload" }, [signal]);
     const reload = useCallback(() => {
         cache.clear();
         setSignal(!signal);
@@ -86,9 +85,7 @@ export default function useMoistureData(): MoistureState {
     }
 
     const data = dto ? processData(dto) : undefined;
-    validTo.current = data
-        ? add(data.timestamp, { days: 1, minutes: 1 })
-        : add(new Date(), { minutes: 5 });
+    validTo.current = data ? add(data.timestamp, { days: 1, minutes: 1 }) : add(new Date(), { minutes: 5 });
 
     return { loading, error, data };
 }
diff --git a/src/index.css b/src/index.css
@@ -1,13 +1,11 @@
 body {
     margin: 0;
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
-        "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
-        "Helvetica Neue", sans-serif;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
+        "Droid Sans", "Helvetica Neue", sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
 }
 
 code {
-    font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
-        monospace;
+    font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
 }
diff --git a/src/model/models.ts b/src/model/models.ts
@@ -6,7 +6,11 @@ export interface SensorInfoDto {
     soil_moisture: number;
     soil_temperature?: number;
     soil_conductivity?: number;
+    avg_soil_moisture: number;
+    avg_soil_temperature?: number;
+    avg_soil_conductivity?: number;
     battery?: number;
+    avg_battery?: number;
     last_update: string;
 }
 export interface MoistureDataDto {
@@ -23,7 +27,11 @@ export interface SensorInfo {
     soil_moisture: number;
     soil_temperature?: number;
     soil_conductivity?: number;
+    avg_soil_moisture: number;
+    avg_soil_temperature?: number;
+    avg_soil_conductivity?: number;
     battery?: number;
+    avg_battery?: number;
     last_updated: Date;
 }
 

diff --git a/src/reportWebVitals.ts b/src/reportWebVitals.ts
@@ -2,15 +2,13 @@ import { ReportHandler } from "web-vitals";
 
 const reportWebVitals = (onPerfEntry?: ReportHandler) => {
     if (onPerfEntry && onPerfEntry instanceof Function) {
-        import("web-vitals").then(
-            ({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
-                getCLS(onPerfEntry);
-                getFID(onPerfEntry);
-                getFCP(onPerfEntry);
-                getLCP(onPerfEntry);
-                getTTFB(onPerfEntry);
-            },
-        );
+        import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+            getCLS(onPerfEntry);
+            getFID(onPerfEntry);
+            getFCP(onPerfEntry);
+            getLCP(onPerfEntry);
+            getTTFB(onPerfEntry);
+        });
     }
 };