|
@@ -31,7 +31,9 @@ import { MASCOT_STYLE } from '../../components/Mascot/Mascot';
|
31
|
31
|
import MascotPopup from '../../components/Mascot/MascotPopup';
|
32
|
32
|
import { getPrettierPlanexGroupName } from '../../utils/Utils';
|
33
|
33
|
import GENERAL_STYLES from '../../constants/Styles';
|
34
|
|
-import PlanexWebview from '../../components/Screens/PlanexWebview';
|
|
34
|
+import PlanexWebview, {
|
|
35
|
+ JS_LOADED_MESSAGE,
|
|
36
|
+} from '../../components/Screens/PlanexWebview';
|
35
|
37
|
import PlanexBottomBar from '../../components/Animations/PlanexBottomBar';
|
36
|
38
|
import {
|
37
|
39
|
getPreferenceString,
|
|
@@ -39,6 +41,7 @@ import {
|
39
|
41
|
PlanexPreferenceKeys,
|
40
|
42
|
} from '../../utils/asyncStorage';
|
41
|
43
|
import { usePlanexPreferences } from '../../context/preferencesContext';
|
|
44
|
+import BasicLoadingScreen from '../../components/Screens/BasicLoadingScreen';
|
42
|
45
|
|
43
|
46
|
const styles = StyleSheet.create({
|
44
|
47
|
container: {
|
|
@@ -65,6 +68,7 @@ function PlanexScreen() {
|
65
|
68
|
}
|
66
|
69
|
>();
|
67
|
70
|
const [injectJS, setInjectJS] = useState('');
|
|
71
|
+ const [loading, setLoading] = useState(true);
|
68
|
72
|
|
69
|
73
|
const getCurrentGroup: () => PlanexGroupType | undefined = useCallback(() => {
|
70
|
74
|
let currentGroupString = getPreferenceString(
|
|
@@ -132,22 +136,26 @@ function PlanexScreen() {
|
132
|
136
|
* @param event
|
133
|
137
|
*/
|
134
|
138
|
const onMessage = (event: { nativeEvent: { data: string } }) => {
|
135
|
|
- const data: {
|
136
|
|
- start: string;
|
137
|
|
- end: string;
|
138
|
|
- title: string;
|
139
|
|
- color: string;
|
140
|
|
- } = JSON.parse(event.nativeEvent.data);
|
141
|
|
- const startDate = dateToString(new Date(data.start), true);
|
142
|
|
- const endDate = dateToString(new Date(data.end), true);
|
143
|
|
- const startString = getTimeOnlyString(startDate);
|
144
|
|
- const endString = getTimeOnlyString(endDate);
|
145
|
|
-
|
146
|
|
- let msg = `${DateManager.getInstance().getTranslatedDate(startDate)}\n`;
|
147
|
|
- if (startString != null && endString != null) {
|
148
|
|
- msg += `${startString} - ${endString}`;
|
|
139
|
+ if (event.nativeEvent.data === JS_LOADED_MESSAGE) {
|
|
140
|
+ setLoading(false);
|
|
141
|
+ } else {
|
|
142
|
+ const data: {
|
|
143
|
+ start: string;
|
|
144
|
+ end: string;
|
|
145
|
+ title: string;
|
|
146
|
+ color: string;
|
|
147
|
+ } = JSON.parse(event.nativeEvent.data);
|
|
148
|
+ const startDate = dateToString(new Date(data.start), true);
|
|
149
|
+ const endDate = dateToString(new Date(data.end), true);
|
|
150
|
+ const startString = getTimeOnlyString(startDate);
|
|
151
|
+ const endString = getTimeOnlyString(endDate);
|
|
152
|
+
|
|
153
|
+ let msg = `${DateManager.getInstance().getTranslatedDate(startDate)}\n`;
|
|
154
|
+ if (startString != null && endString != null) {
|
|
155
|
+ msg += `${startString} - ${endString}`;
|
|
156
|
+ }
|
|
157
|
+ showDialog(data.title, msg, data.color);
|
149
|
158
|
}
|
150
|
|
- showDialog(data.title, msg, data.color);
|
151
|
159
|
};
|
152
|
160
|
|
153
|
161
|
/**
|
|
@@ -202,6 +210,11 @@ function PlanexScreen() {
|
202
|
210
|
<View style={GENERAL_STYLES.flex}>{getWebView()}</View>
|
203
|
211
|
)}
|
204
|
212
|
</View>
|
|
213
|
+ {loading ? (
|
|
214
|
+ <View style={styles.container}>
|
|
215
|
+ <BasicLoadingScreen />
|
|
216
|
+ </View>
|
|
217
|
+ ) : null}
|
205
|
218
|
{showMascot ? (
|
206
|
219
|
<MascotPopup
|
207
|
220
|
title={i18n.t('screens.planex.mascotDialog.title')}
|