Browse Source

move last refresh date in request screen

Arnaud Vergnet 2 years ago
parent
commit
c1dd69d0ed

+ 18
- 13
src/components/Screens/RequestScreen.tsx View File

@@ -11,6 +11,7 @@ export type RequestScreenProps<T> = {
11 11
   render: (
12 12
     data: T | undefined,
13 13
     loading: boolean,
14
+    lastRefreshDate: Date | undefined,
14 15
     refreshData: (newRequest?: () => Promise<T>) => void,
15 16
     status: REQUEST_STATUS,
16 17
     code?: REQUEST_CODES
@@ -37,8 +38,15 @@ const MIN_REFRESH_TIME = 5 * 1000;
37 38
 
38 39
 export default function RequestScreen<T>(props: Props<T>) {
39 40
   const refreshInterval = useRef<number>();
40
-  const [loading, status, code, data, refreshData] = useRequestLogic<T>(
41
-    () => props.request(),
41
+  const [
42
+    loading,
43
+    lastRefreshDate,
44
+    status,
45
+    code,
46
+    data,
47
+    refreshData,
48
+  ] = useRequestLogic<T>(
49
+    props.request,
42 50
     props.cache,
43 51
     props.onCacheUpdate,
44 52
     props.refreshOnFocus,
@@ -81,16 +89,6 @@ export default function RequestScreen<T>(props: Props<T>) {
81 89
     }, [props.cache, props.refreshOnFocus])
82 90
   );
83 91
 
84
-  // useEffect(() => {
85
-  //   if (status === REQUEST_STATUS.BAD_TOKEN && props.onMajorError) {
86
-  //     props.onMajorError(status, code);
87
-  //   }
88
-  //   // eslint-disable-next-line react-hooks/exhaustive-deps
89
-  // }, [status, code]);
90
-
91
-  // if (status === REQUEST_STATUS.BAD_TOKEN && props.onMajorError) {
92
-  //   return <View />;
93
-  // } else
94 92
   if (data === undefined && loading && props.showLoading !== false) {
95 93
     return <BasicLoadingScreen />;
96 94
   } else if (
@@ -110,6 +108,13 @@ export default function RequestScreen<T>(props: Props<T>) {
110 108
       />
111 109
     );
112 110
   } else {
113
-    return props.render(data, loading, refreshData, status, code);
111
+    return props.render(
112
+      data,
113
+      loading,
114
+      lastRefreshDate,
115
+      refreshData,
116
+      status,
117
+      code
118
+    );
114 119
   }
115 120
 }

+ 5
- 0
src/components/Screens/WebSectionList.tsx View File

@@ -62,6 +62,7 @@ type Props<ItemT, RawData> = Omit<
62 62
     createDataset: (
63 63
       data: RawData | undefined,
64 64
       loading: boolean,
65
+      lastRefreshDate: Date | undefined,
65 66
       refreshData: (newRequest?: () => Promise<RawData>) => void,
66 67
       status: REQUEST_STATUS,
67 68
       code?: REQUEST_CODES
@@ -69,6 +70,7 @@ type Props<ItemT, RawData> = Omit<
69 70
     renderListHeaderComponent?: (
70 71
       data: RawData | undefined,
71 72
       loading: boolean,
73
+      lastRefreshDate: Date | undefined,
72 74
       refreshData: (newRequest?: () => Promise<RawData>) => void,
73 75
       status: REQUEST_STATUS,
74 76
       code?: REQUEST_CODES
@@ -108,6 +110,7 @@ function WebSectionList<ItemT, RawData>(props: Props<ItemT, RawData>) {
108 110
   const render = (
109 111
     data: RawData | undefined,
110 112
     loading: boolean,
113
+    lastRefreshDate: Date | undefined,
111 114
     refreshData: (newRequest?: () => Promise<RawData>) => void,
112 115
     status: REQUEST_STATUS,
113 116
     code?: REQUEST_CODES
@@ -116,6 +119,7 @@ function WebSectionList<ItemT, RawData>(props: Props<ItemT, RawData>) {
116 119
     const dataset = props.createDataset(
117 120
       data,
118 121
       loading,
122
+      lastRefreshDate,
119 123
       refreshData,
120 124
       status,
121 125
       code
@@ -143,6 +147,7 @@ function WebSectionList<ItemT, RawData>(props: Props<ItemT, RawData>) {
143 147
             ? props.renderListHeaderComponent(
144 148
                 data,
145 149
                 loading,
150
+                lastRefreshDate,
146 151
                 refreshData,
147 152
                 status,
148 153
                 code

+ 9
- 16
src/screens/Proxiwash/ProxiwashScreen.tsx View File

@@ -52,7 +52,6 @@ import GENERAL_STYLES from '../../constants/Styles';
52 52
 import { readData } from '../../utils/WebData';
53 53
 import { useFocusEffect, useNavigation } from '@react-navigation/core';
54 54
 import { setupMachineNotification } from '../../utils/Notifications';
55
-import { REQUEST_STATUS } from '../../utils/Requests';
56 55
 import ProximoListHeader from '../../components/Lists/Proximo/ProximoListHeader';
57 56
 
58 57
 const REFRESH_TIME = 1000 * 10; // Refresh every 10 seconds
@@ -110,8 +109,6 @@ function ProxiwashScreen() {
110 109
     ) as 'tripodeB' | 'washinsa'
111 110
   );
112 111
 
113
-  const lastrefreshDate = useRef<Date | undefined>(undefined);
114
-
115 112
   const modalStateStrings: { [key in MachineStates]: string } = {
116 113
     [MachineStates.AVAILABLE]: i18n.t('screens.proxiwash.modal.ready'),
117 114
     [MachineStates.RUNNING]: i18n.t('screens.proxiwash.modal.running'),
@@ -418,21 +415,17 @@ function ProxiwashScreen() {
418 415
   };
419 416
 
420 417
   const renderListHeaderComponent = (
421
-    _data: FetchedDataType | undefined,
422
-    loading: boolean,
423
-    _refreshData: (newRequest?: () => Promise<FetchedDataType>) => void,
424
-    status: REQUEST_STATUS
418
+    data: FetchedDataType | undefined,
419
+    _loading: boolean,
420
+    lastRefreshDate: Date | undefined
425 421
   ) => {
426
-    const success = status === REQUEST_STATUS.SUCCESS;
427
-    if (success && !loading) {
428
-      lastrefreshDate.current = new Date();
422
+    if (data) {
423
+      return (
424
+        <ProximoListHeader date={lastRefreshDate} selectedWash={selectedWash} />
425
+      );
426
+    } else {
427
+      return null;
429 428
     }
430
-    return (
431
-      <ProximoListHeader
432
-        date={lastrefreshDate.current}
433
-        selectedWash={selectedWash}
434
-      />
435
-    );
436 429
   };
437 430
 
438 431
   let data: LaundromatType;

+ 10
- 8
src/utils/customHooks.tsx View File

@@ -55,24 +55,24 @@ export function useRequestLogic<T>(
55 55
 ) {
56 56
   const [response, setResponse] = useState<{
57 57
     loading: boolean;
58
+    lastRefreshDate?: Date;
58 59
     status: REQUEST_STATUS;
59 60
     code?: number;
60 61
     data: T | undefined;
61 62
   }>({
62 63
     loading: startLoading !== false && cache === undefined,
64
+    lastRefreshDate: undefined,
63 65
     status: REQUEST_STATUS.SUCCESS,
64 66
     code: undefined,
65 67
     data: undefined,
66 68
   });
67
-  const [lastRefreshDate, setLastRefreshDate] = useState<Date | undefined>(
68
-    undefined
69
-  );
70 69
 
71 70
   const refreshData = (newRequest?: () => Promise<T>) => {
72 71
     let canRefresh;
73
-    if (lastRefreshDate && minRefreshTime) {
74
-      const last = lastRefreshDate;
75
-      canRefresh = new Date().getTime() - last.getTime() > minRefreshTime;
72
+    if (response.lastRefreshDate && minRefreshTime) {
73
+      canRefresh =
74
+        new Date().getTime() - response.lastRefreshDate.getTime() >
75
+        minRefreshTime;
76 76
     } else {
77 77
       canRefresh = true;
78 78
     }
@@ -83,12 +83,12 @@ export function useRequestLogic<T>(
83 83
           loading: true,
84 84
         }));
85 85
       }
86
-      setLastRefreshDate(new Date());
87 86
       const r = newRequest ? newRequest : request;
88 87
       r()
89 88
         .then((requestResponse: T) => {
90 89
           setResponse({
91 90
             loading: false,
91
+            lastRefreshDate: new Date(),
92 92
             status: REQUEST_STATUS.SUCCESS,
93 93
             code: undefined,
94 94
             data: requestResponse,
@@ -100,23 +100,25 @@ export function useRequestLogic<T>(
100 100
         .catch(() => {
101 101
           setResponse((prevState) => ({
102 102
             loading: false,
103
+            lastRefreshDate: prevState.lastRefreshDate,
103 104
             status: REQUEST_STATUS.CONNECTION_ERROR,
104 105
             code: 0,
105 106
             data: prevState.data,
106 107
           }));
107
-          setLastRefreshDate(undefined);
108 108
         });
109 109
     }
110 110
   };
111 111
 
112 112
   const value: [
113 113
     boolean,
114
+    Date | undefined,
114 115
     REQUEST_STATUS,
115 116
     number | undefined,
116 117
     T | undefined,
117 118
     (newRequest?: () => Promise<T>) => void
118 119
   ] = [
119 120
     response.loading,
121
+    response.lastRefreshDate,
120 122
     response.status,
121 123
     response.code,
122 124
     cache ? cache : response.data,

Loading…
Cancel
Save