try fix pr comment

clubcapra · Jun 11, 2023 · f868b19 · f868b19
1 parent f2847ea
commit f868b19
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 20 deletions.
diff --git a/src/renderer/components/ExplorationStatus/ExplorationStatus.tsx b/src/renderer/components/ExplorationStatus/ExplorationStatus.tsx
@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { FC, useState } from 'react';
 import { styled } from '@/renderer/globalStyles/styled';
 import { ExplorationTimer } from './ExplorationTimer';
 import {
@@ -9,12 +9,22 @@ import {
 import { GoTelescope } from 'react-icons/go';
 
 export const ExplorationStatus: FC = () => {
+  const [timerDisplay, setTimerDisplay] = useState('00:00');
+
+  const setTimerDisplayProps = (timerToDisplay: string) => {
+    setTimerDisplay(timerToDisplay);
+  };
+
+  const isShowTimerDisplay = () => {
+    return timerDisplay !== '00:00';
+  };
+
   return (
     <StyledPopup
       trigger={
         <StyledPopupContainer>
+          {isShowTimerDisplay() && timerDisplay}
           <StyledGoTelescope />
-          <p>Exploration</p>
         </StyledPopupContainer>
       }
       on="click"
@@ -23,7 +33,7 @@ export const ExplorationStatus: FC = () => {
       repositionOnResize={true}
     >
       <StyledPopupContent>
-        <ExplorationTimer />
+        <ExplorationTimer setTimerDisplayProps={setTimerDisplayProps} />
       </StyledPopupContent>
     </StyledPopup>
   );
@@ -32,4 +42,5 @@ export const ExplorationStatus: FC = () => {
 const StyledGoTelescope = styled(GoTelescope)`
   height: 1.25em;
   width: 1.25em;
+  margin-left: 0.5em;
 `;
diff --git a/src/renderer/components/ExplorationStatus/ExplorationTimer.tsx b/src/renderer/components/ExplorationStatus/ExplorationTimer.tsx
@@ -4,10 +4,21 @@ import React, { useEffect, FC, useState, ChangeEvent } from 'react';
 import { LabeledInput } from '@/renderer/components/common/LabeledInput';
 import { log } from '@/renderer/logger';
 import { styled } from '@/renderer/globalStyles/styled';
+import { toast } from 'react-toastify';
 
-export const ExplorationTimer: FC = () => {
+interface ExploationMsg {
+  message: string;
+}
+
+interface TimerDisplayProps {
+  setTimerDisplayProps: (timerDisplay: string) => void;
+}
+
+export const ExplorationTimer: FC<TimerDisplayProps> = ({
+  setTimerDisplayProps,
+}) => {
   const [duration, setDuration] = useState(2);
-  const [timeRemaining, setTimeRemaining] = useState(Number);
+  const [timeRemaining, setTimeRemaining] = useState(0);
   const [isTimerActive, setIsTimerActive] = useState(false);
   const [timerDisplay, setTimerDisplay] = useState('00:00');
   const [countDownDate, setCountDownDate] = useState(Date.now());
@@ -16,24 +27,26 @@ export const ExplorationTimer: FC = () => {
     setDuration(Number(e.target.value));
   };
 
-  const startTimer = () => {
-    setIsTimerActive(false);
-    setCountDownDate(Date.now() + duration * 60 * 1000);
-    setIsTimerActive(true);
-    setRosExplorationTimer();
+  const startTimer = async () => {
+    if (duration > 0) {
+      setCountDownDate(Date.now() + duration * 60 * 1000);
+      await setRosExplorationTimer(duration);
+    }
   };
 
-  const stopTimer = () => {
+  const stopTimer = async () => {
     setIsTimerActive(false);
     setDuration(0);
-    setRosExplorationTimer();
+    setTimeRemaining(0);
+    await setRosExplorationTimer(0);
   };
 
   useEffect(() => {
     let interval: ReturnType<typeof setInterval> | undefined;
     const intervalMs = 1000;
-    if (isTimerActive) {
+    if (isTimerActive && timeRemaining > 0) {
       interval = setInterval(() => {
+        setTimerDisplayProps(getTimeRemaining());
         setTimerDisplay(getTimeRemaining());
         setTimeRemaining(timeRemaining - intervalMs);
       }, intervalMs);
@@ -50,28 +63,45 @@ export const ExplorationTimer: FC = () => {
       const minutes = Math.floor((total % (1000 * 60 * 60)) / (1000 * 60));
       const seconds = Math.floor((total % (1000 * 60)) / 1000);
 
-      const minutesDiplay =
+      const minutesDisplay =
         minutes < 10 ? '0' + minutes.toString() : minutes.toString();
-      const secondsDiplay =
+      const secondsDisplay =
         seconds < 10 ? '0' + seconds.toString() : seconds.toString();
 
       if (total < 0) {
         setIsTimerActive(false);
       }
-      return `${minutesDiplay}:${secondsDiplay}`;
+      return `${minutesDisplay}:${secondsDisplay}`;
     };
     return () => clearInterval(interval);
-  }, [isTimerActive, countDownDate, timeRemaining]);
+  }, [
+    isTimerActive,
+    countDownDate,
+    timeRemaining,
+    setTimerDisplayProps,
+    timerDisplay,
+  ]);
 
-  const setRosExplorationTimer = () => {
+  const setRosExplorationTimer = async (timer: number) => {
     rosClient
       .callService(
         {
           name: `/start_exploration`,
         },
-        { timeout: duration * 60 }
+        { timeout: timer * 60 }
       )
       .catch(log.error);
+
+    const result = (await rosClient.callService({
+      name: '/explore/get_loggers',
+    })) as ExploationMsg;
+
+    if (result && result.message === 'ERROR: unknown service') {
+      setIsTimerActive(false);
+      toast.error(result.message);
+    } else {
+      setIsTimerActive(true);
+    }
   };
 
   return (

diff --git a/src/renderer/components/GpioPinsStatus/GpioPinsStatus.tsx b/src/renderer/components/GpioPinsStatus/GpioPinsStatus.tsx
@@ -15,7 +15,6 @@ const GpioPinsStatus = () => {
       trigger={
         <Container>
           {isAGpioPinOn ? <StyledBsLightbulb /> : <StyledBsLightbulbOff />}
-          <p>GPIO</p>
         </Container>
       }
       on="click"