settings: Add the ability to see all toast notifications in current s…

…ession
hsjoberg · May 29, 2023 · 25d96d6 · 25d96d6 · vercel · May 29, 2023
1 parent 485ea65
commit 25d96d6
Show file tree

Hide file tree

Showing 5 changed files with 104 additions and 1 deletion.
diff --git a/locales/en.json b/locales/en.json
@@ -897,6 +897,10 @@
         "title": "Show startup info notifications",
         "subtitle": ""
       },
+      "showNotifications": {
+        "title": "Show notifications for this session",
+        "subtitle": ""
+      },
       "helpCencer": {
         "title": "LndMobile help center",
         "subtitle": ""

diff --git a/src/utils/index.ts b/src/utils/index.ts
@@ -74,9 +74,17 @@ export const hexToUint8Array = (hexString: string) => {
   return new Uint8Array(hexString.match(/.{1,2}/g)!.map(byte => parseInt(byte, 16)));
 };
 
+export const toastEntries: string[] = []
+
+// TODO: maybe make array observable in order trigger re-render for hook
+export function useGetToastEntries(): string[] {
+  return toastEntries;
+}
+
 export const toast = (message: string, period = 8000, type: "danger" | "success" | "warning" = "success", button?: string) => {
+  toastEntries.push(message);
+  console.log(message);
   try {
-    console.log(message);
     if (AppState.currentState === "active") {
       Toast.show({
         duration: period,

diff --git a/src/windows/Settings/Settings.tsx b/src/windows/Settings/Settings.tsx
@@ -1555,6 +1555,12 @@ ${t("experimental.tor.disabled.msg2")}`;
             <Body><Text>{t("debug.startup.title")}</Text></Body>
             <Right><CheckBox checked={debugShowStartupInfo} onPress={onToggleDebugShowStartupInfo} /></Right>
           </ListItem>
+          <ListItem style={style.listItem} button={true} icon={true} onPress={() => navigation.navigate("ToastLog")}>
+            <Left><Icon style={style.icon} type="MaterialCommunityIcons" name="format-list-bulleted" /></Left>
+            <Body>
+              <Text>{t("debug.showNotifications.title")}</Text>
+            </Body>
+          </ListItem>
           <ListItem style={style.listItem} button={true} icon={true} onPress={onPressRescanWallet}>
             <Left><Icon style={style.icon} type="MaterialCommunityIcons" name="restart" /></Left>
             <Body>

diff --git a/src/windows/Settings/ToastLog.tsx b/src/windows/Settings/ToastLog.tsx
@@ -0,0 +1,82 @@
+import React, { useLayoutEffect } from "react";
+import { FlatList, StyleSheet } from "react-native";
+import { Body, Card, CardItem, Icon, Row, Text } from "native-base";
+import { StackNavigationProp } from "@react-navigation/stack";
+import { RouteProp } from "@react-navigation/native";
+import Clipboard from "@react-native-community/clipboard";
+
+import Container from "../../components/Container";
+import { NavigationButton } from "../../components/NavigationButton";
+import { SettingsStackParamList } from "./index";
+import { toast, useGetToastEntries } from "../../utils";
+import { fontFactorNormalized } from "../../utils/scale";
+
+import { useTranslation } from "react-i18next";
+import { namespaces } from "../../i18n/i18n.constants";
+
+
+export interface ISelectListProps {
+  navigation: StackNavigationProp<SettingsStackParamList, "LightningPeers">;
+  route: RouteProp<SettingsStackParamList, "LightningPeers">;
+}
+
+export default function({ navigation }: ISelectListProps) {
+  const t = useTranslation(namespaces.settings.lightningPeers).t;
+  const toastEntries = useGetToastEntries();
+
+  useLayoutEffect(() => {
+    navigation.setOptions({
+      headerTitle: t("layout.title"),
+      headerShown: true,
+      headerRight: () => {
+        return (
+          <NavigationButton onPress={onPressCopyAllToasts}>
+            <Icon type="MaterialCommunityIcons" name="content-copy" style={{ fontSize: 22 }} />
+          </NavigationButton>
+        )
+      }
+    });
+  }, [navigation]);
+
+  const onCopyToastMessage = (i: number) => {
+    console.log(toastEntries);
+    Clipboard.setString(toastEntries[i] ?? "");
+    toast("Copied to clipboard");
+  }
+
+  const onPressCopyAllToasts = () => {
+    Clipboard.setString(toastEntries.join("\n") ?? "");
+    toast("Copied to clipboard");
+  }
+
+  return (
+    <Container>
+      <FlatList
+        contentContainerStyle={{ padding: 14 }}
+        initialNumToRender={20}
+        data={toastEntries}
+        renderItem={({ item: toast, index }) => (
+          <Card style={style.card} key={index}>
+            <CardItem>
+              <Body>
+                <Row style={{ width: "100%" }}>
+                  <Text style={{marginRight: 28 }}>{toast}</Text>
+                  <Text style={{ position:"absolute", right: 0 }}>
+                    <Icon type="MaterialCommunityIcons" name="content-copy" style={style.icon} onPress={() => onCopyToastMessage(index)} />
+                  </Text>
+                </Row>
+              </Body>
+            </CardItem>
+          </Card>
+        )}
+        keyExtractor={(toast, i) => toast + i}
+      />
+    </Container>
+  )
+}
+
+const style = StyleSheet.create({
+  icon: {
+    fontSize: 18 * fontFactorNormalized,
+  },
+});
diff --git a/src/windows/Settings/index.tsx b/src/windows/Settings/index.tsx
@@ -18,6 +18,7 @@ import LightningPeers from "./LightningPeers";
 import ConnectToLightningPeer from "./ConnectToLightningPeer";
 import LndLog from "./LndLog";
 import DunderDoctor from "./DunderDoctor";
+import ToastLog from "./ToastLog";
 
 const Stack = createStackNavigator();
 
@@ -41,6 +42,7 @@ export type SettingsStackParamList = {
   ChannelProvider: ISelectListNavigationProps<string>;
   LndLog: undefined;
   DunderDoctor: undefined;
+  ToastLog: undefined;
 }
 
 export default function SettingsIndex() {
@@ -73,6 +75,7 @@ export default function SettingsIndex() {
       <Stack.Screen name="ChannelProvider" component={SelectList} />
       <Stack.Screen name="LndLog" component={LndLog} />
       <Stack.Screen name="DunderDoctor" component={DunderDoctor} />
+      <Stack.Screen name="ToastLog" component={ToastLog} />
     </Stack.Navigator>
   );
 }