From a0dc62e76180b08b4238d3b51528178205893824 Mon Sep 17 00:00:00 2001
From: Brandon Presley <brandon@presley.nz>
Date: Sat, 17 Feb 2024 17:27:42 +1300
Subject: [PATCH] Remove all JS side Timers

This is the result of me fixing the background timers.
Previously our code just used a CountdownTimer
not even in a service, just immediately in the
@ReactMethod. This would in certain scenarios stop
running. Even with battery optimizations turned off.

The reason why all the JS side timers had to be removed
is because we were relying on RCTDeviceEventEmitter
which I don't know how to use from within a Service.
See my stackoverflow ticket here: https://stackoverflow.com/questions/74204339/sending-react-native-android-events-to-javascript-from-a-service

Closes #212, #196
---
 App.tsx           |  2 --
 AppDrawer.tsx     |  6 -----
 SettingsPage.tsx  |  1 -
 TimerPage.tsx     | 68 -----------------------------------------------
 TimerProgress.tsx | 31 ---------------------
 use-timer.ts      | 38 --------------------------
 6 files changed, 146 deletions(-)
 delete mode 100644 TimerPage.tsx
 delete mode 100644 TimerProgress.tsx
 delete mode 100644 use-timer.ts

diff --git a/App.tsx b/App.tsx
index 7e7a04d..68fb73c 100644
--- a/App.tsx
+++ b/App.tsx
@@ -17,7 +17,6 @@ import FatalError from "./FatalError";
 import { AppDataSource } from "./data-source";
 import { settingsRepo } from "./db";
 import { ThemeContext } from "./use-theme";
-import TimerProgress from "./TimerProgress";
 
 export const CombinedDefaultTheme = {
   ...NavigationDefaultTheme,
@@ -119,7 +118,6 @@ const App = () => {
       </NavigationContainer>
 
       <AppSnack textColor={paperTheme.colors.background} />
-      <TimerProgress />
     </PaperProvider>
   );
 };
diff --git a/AppDrawer.tsx b/AppDrawer.tsx
index 8dc3522..4838eaa 100644
--- a/AppDrawer.tsx
+++ b/AppDrawer.tsx
@@ -8,7 +8,6 @@ import InsightsPage from "./InsightsPage";
 import PlanList from "./PlanList";
 import SetList from "./SetList";
 import SettingsPage from "./SettingsPage";
-import TimerPage from "./TimerPage";
 import WeightList from "./WeightList";
 
 const Drawer = createDrawerNavigator<DrawerParams>();
@@ -55,11 +54,6 @@ export default function AppDrawer({
           drawerIcon: () => <IconButton icon="chart-bell-curve-cumulative" />,
         }}
       />
-      <Drawer.Screen
-        name="Timer"
-        component={TimerPage}
-        options={{ drawerIcon: () => <IconButton icon="timer-outline" /> }}
-      />
       <Drawer.Screen
         name="Weight"
         component={WeightList}
diff --git a/SettingsPage.tsx b/SettingsPage.tsx
index 1aeed9d..7cd31f1 100644
--- a/SettingsPage.tsx
+++ b/SettingsPage.tsx
@@ -6,7 +6,6 @@ import { FlatList, NativeModules } from "react-native";
 import DocumentPicker from "react-native-document-picker";
 import { Dirs, FileSystem } from "react-native-file-access";
 import { Button } from "react-native-paper";
-import { check, PERMISSIONS, request, RESULTS } from "react-native-permissions";
 import AppInput from "./AppInput";
 import ConfirmDialog from "./ConfirmDialog";
 import { PADDING } from "./constants";
diff --git a/TimerPage.tsx b/TimerPage.tsx
deleted file mode 100644
index 1061436..0000000
--- a/TimerPage.tsx
+++ /dev/null
@@ -1,68 +0,0 @@
-import { useFocusEffect } from "@react-navigation/native";
-import React, { useCallback, useState } from "react";
-import { NativeModules, View } from "react-native";
-import { FAB, Text, useTheme } from "react-native-paper";
-import AppFab from "./AppFab";
-import DrawerHeader from "./DrawerHeader";
-import { settingsRepo } from "./db";
-import Settings from "./settings";
-import useTimer from "./use-timer";
-
-export interface TickEvent {
-  minutes: string;
-  seconds: string;
-}
-
-export default function TimerPage() {
-  const { minutes, seconds, update } = useTimer();
-  const [settings, setSettings] = useState<Settings>();
-  const { colors } = useTheme();
-
-  useFocusEffect(
-    useCallback(() => {
-      settingsRepo.findOne({ where: {} }).then(setSettings);
-    }, [])
-  );
-
-  const stop = () => {
-    NativeModules.AlarmModule.stop();
-    update();
-  };
-
-  const add = async () => {
-    console.log(`${TimerPage.name}.add:`, settings);
-    NativeModules.AlarmModule.add();
-    update();
-  };
-
-  return (
-    <>
-      <DrawerHeader name="Timer" />
-      <View
-        style={{
-          flex: 1,
-          flexGrow: 1,
-          justifyContent: "center",
-          alignItems: "center",
-        }}
-      >
-        <Text style={{ fontSize: 70, position: "absolute" }}>
-          {minutes}:{seconds}
-        </Text>
-      </View>
-
-      <FAB
-        icon="plus"
-        onPress={add}
-        style={{
-          position: "absolute",
-          left: 20,
-          bottom: 20,
-          backgroundColor: colors.primary,
-        }}
-        color={colors.background}
-      />
-      <AppFab icon="stop" onPress={stop} />
-    </>
-  );
-}
diff --git a/TimerProgress.tsx b/TimerProgress.tsx
deleted file mode 100644
index 1bad7d0..0000000
--- a/TimerProgress.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import { useEffect, useState } from "react";
-import { ProgressBar } from "react-native-paper";
-import { TickEvent } from "./TimerPage";
-import { emitter } from "./emitter";
-
-export default function TimerProgress() {
-  const [progress, setProgress] = useState(0);
-
-  useEffect(() => {
-    const description = emitter.addListener(
-      "tick",
-      ({ minutes, seconds }: TickEvent) => {
-        setProgress((Number(minutes) * 60 + Number(seconds)) / 210);
-      }
-    );
-    return description.remove;
-  }, []);
-
-  if (progress === 0) return null;
-
-  return (
-    <ProgressBar
-      style={{
-        position: "absolute",
-        bottom: 0,
-        height: 5,
-      }}
-      progress={progress}
-    />
-  );
-}
diff --git a/use-timer.ts b/use-timer.ts
deleted file mode 100644
index 5d3be71..0000000
--- a/use-timer.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-import { useFocusEffect } from "@react-navigation/native";
-import { useCallback, useState } from "react";
-import { NativeModules } from "react-native";
-import { emitter } from "./emitter";
-import { TickEvent } from "./TimerPage";
-
-export default function useTimer() {
-  const [minutes, setMinutes] = useState("00");
-  const [seconds, setSeconds] = useState("00");
-
-  const update = () => {
-    const current: number = NativeModules.AlarmModule.getCurrent();
-    setMinutes(
-      Math.floor(current / 1000 / 60)
-        .toString()
-        .padStart(2, "0")
-    );
-    setSeconds(
-      Math.floor((current / 1000) % 60)
-        .toString()
-        .padStart(2, "0")
-    );
-  };
-
-  useFocusEffect(
-    useCallback(() => {
-      update();
-      const listener = emitter.addListener("tick", (event: TickEvent) => {
-        console.log(`${useTimer.name}.tick:`, { event });
-        setMinutes(event.minutes);
-        setSeconds(event.seconds);
-      });
-      return listener.remove;
-    }, [])
-  );
-
-  return { minutes, seconds, update };
-}