upgrade alova to v3

This commit is contained in:
proddy
2024-08-03 15:35:54 +02:00
parent 9a23d4e2b3
commit 7751baf8bf
33 changed files with 481 additions and 867 deletions

View File

@@ -22,7 +22,7 @@
"lint": "eslint . --fix"
},
"dependencies": {
"@alova/adapter-xhr": "^1.0.6",
"@alova/adapter-xhr": "^2.0.4",
"@alova/scene-react": "^1.6.2",
"@emotion/react": "^11.13.0",
"@emotion/styled": "^11.13.0",
@@ -30,18 +30,18 @@
"@mui/material": "^5.16.6",
"@table-library/react-table-library": "4.1.7",
"@types/lodash-es": "^4.17.12",
"@types/node": "^22.0.2",
"@types/node": "^22.1.0",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@types/react-router-dom": "^5.3.3",
"alova": "^2.21.4",
"alova": "^3.0.5",
"async-validator": "^4.2.5",
"history": "^5.3.0",
"jwt-decode": "^4.0.0",
"lodash-es": "^4.17.21",
"mime-types": "^2.1.35",
"react": "latest",
"react-dom": "latest",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-dropzone": "^14.2.3",
"react-icons": "^5.2.1",
"react-router-dom": "^6.26.0",

View File

@@ -4,6 +4,7 @@ import { Navigate, Route, Routes } from 'react-router-dom';
import CustomEntities from 'app/main/CustomEntities';
import Customization from 'app/main/Customization';
import Devices from 'app/main/Devices';
import Help from 'app/main/Help';
import Modules from 'app/main/Modules';
import Scheduler from 'app/main/Scheduler';
import Sensors from 'app/main/Sensors';
@@ -26,8 +27,6 @@ import SystemLog from 'app/status/SystemLog';
import { Layout } from 'components';
import { AuthenticatedContext } from 'contexts/authentication';
import Help from './app/main/Help';
const AuthenticatedRouting: FC = () => {
const { me } = useContext(AuthenticatedContext);
return (

View File

@@ -8,7 +8,7 @@ import { Box, Button, Paper, Typography } from '@mui/material';
import * as AuthenticationApi from 'api/authentication';
import { PROJECT_NAME } from 'api/env';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import type { ValidateFieldsError } from 'async-validator';
import {
LanguageSelector,

View File

@@ -8,8 +8,19 @@ export const ACCESS_TOKEN = 'access_token';
export const alovaInstance = createAlova({
statesHook: ReactHook,
timeout: 3000, // 3 seconds but throwing a timeout error
localCache: null,
cacheFor: null,
// TODO fix cache
// cacheFor: {
// // Set the cache mode for POST uniformly
// POST: {
// mode: 'restore',
// expire: 60 * 10 * 1000
// },
// // Set the cache mode for HEAD requests uniformly
// HEAD: 60 * 10 * 1000
// },
// timeout: 3000, // 3 seconds but throwing a timeout error
// localCache: null,
// localCache: {
// GET: {
// mode: 'placeholder', // see https://alova.js.org/learning/response-cache/#cache-replaceholder-mode

View File

@@ -1,8 +1,3 @@
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
/* eslint-disable @typescript-eslint/no-unsafe-call */
/* eslint-disable @typescript-eslint/no-unsafe-return */
import type { HardwareStatus, LogSettings, SystemStatus } from 'types';
import { alovaInstance, alovaInstanceGH } from './endpoints';
@@ -31,13 +26,13 @@ export const fetchLogES = () => alovaInstance.Get('/es/log');
// Get versions from github
export const getStableVersion = () =>
alovaInstanceGH.Get('latest', {
transformData(response) {
transform(response: { data: { name: string } }) {
return response.data.name.substring(1);
}
});
export const getDevVersion = () =>
alovaInstanceGH.Get('tags/latest', {
transformData(response) {
transform(response: { data: { name: string } }) {
return response.data.name.split(/\s+/).splice(-1)[0].substring(1);
}
});

View File

@@ -20,7 +20,7 @@ import {
Table
} from '@table-library/react-table-library/table';
import { useTheme } from '@table-library/react-table-library/theme';
import { updateState, useRequest } from 'alova';
import { updateState, useRequest } from 'alova/client';
import {
BlockNavigation,
ButtonRow,
@@ -182,7 +182,6 @@ const CustomEntities: FC = () => {
const onDialogSave = (updatedItem: EntityItem) => {
setDialogOpen(false);
updateState('entities', (data: EntityItem[]) => {
const new_data = creating
? [

View File

@@ -40,7 +40,7 @@ import {
} from '@table-library/react-table-library/table';
import { useTheme } from '@table-library/react-table-library/theme';
import { dialogStyle } from 'CustomTheme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import RestartMonitor from 'app/status/RestartMonitor';
import {
BlockNavigation,

View File

@@ -57,7 +57,7 @@ import {
import { useTheme } from '@table-library/react-table-library/theme';
import type { Action, State } from '@table-library/react-table-library/types/common';
import { dialogStyle } from 'CustomTheme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, MessageBox, SectionContent, useLayoutTitle } from 'components';
import { AuthenticatedContext } from 'contexts/authentication';
import { useI18nContext } from 'i18n/i18n-react';

View File

@@ -18,8 +18,10 @@ import {
Typography
} from '@mui/material';
import * as SystemApi from 'api/system';
import * as EMSESP from 'app/main/api';
import { useRequest } from 'alova';
import { useAutoRequest, useRequest } from 'alova/client';
import { SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
@@ -36,6 +38,9 @@ const Help: FC = () => {
}
);
// TODO check useAutoRequest - https://alova.js.org/tutorial/client/strategy/use-auto-request/#basic-usage
const { data, loading } = useAutoRequest(SystemApi.readSystemStatus);
onGetAPI((event) => {
const anchor = document.createElement('a');
anchor.href = URL.createObjectURL(
@@ -45,7 +50,7 @@ const Help: FC = () => {
);
anchor.download =
'emsesp_' + event.sendArgs[0].device + '_' + event.sendArgs[0].entity + '.txt';
'emsesp_' + event.args[0].device + '_' + event.args[0].entity + '.txt';
anchor.click();
URL.revokeObjectURL(anchor.href);
toast.info(LL.DOWNLOAD_SUCCESSFUL());
@@ -57,88 +62,97 @@ const Help: FC = () => {
});
};
console.log('loading: ' + loading + ' data2: ' + data);
if (loading) {
return <div>Loading...</div>;
}
return (
<SectionContent>
<List sx={{ borderRadius: 3, border: '2px solid grey' }}>
<ListItem>
<ListItemButton component="a" href="https://emsesp.github.io/docs">
<ListItemAvatar>
<Avatar sx={{ bgcolor: '#72caf9' }}>
<MenuBookIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.HELP_INFORMATION_1()} />
</ListItemButton>
</ListItem>
<>
<div>version is {data.emsesp_version}</div>
<SectionContent>
<List sx={{ borderRadius: 3, border: '2px solid grey' }}>
<ListItem>
<ListItemButton component="a" href="https://emsesp.github.io/docs">
<ListItemAvatar>
<Avatar sx={{ bgcolor: '#72caf9' }}>
<MenuBookIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.HELP_INFORMATION_1()} />
</ListItemButton>
</ListItem>
<ListItem>
<ListItemButton component="a" href="https://discord.gg/3J3GgnzpyT">
<ListItemAvatar>
<Avatar sx={{ bgcolor: '#72caf9' }}>
<CommentIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.HELP_INFORMATION_2()} />
</ListItemButton>
</ListItem>
<ListItem>
<ListItemButton component="a" href="https://discord.gg/3J3GgnzpyT">
<ListItemAvatar>
<Avatar sx={{ bgcolor: '#72caf9' }}>
<CommentIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.HELP_INFORMATION_2()} />
</ListItemButton>
</ListItem>
<ListItem>
<ListItemButton
component="a"
href="https://github.com/emsesp/EMS-ESP32/issues/new/choose"
<ListItem>
<ListItemButton
component="a"
href="https://github.com/emsesp/EMS-ESP32/issues/new/choose"
>
<ListItemAvatar>
<Avatar sx={{ bgcolor: '#72caf9' }}>
<GitHubIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.HELP_INFORMATION_3()} />
</ListItemButton>
</ListItem>
</List>
<Box p={2} color="warning.main">
<Typography mb={1} variant="body2">
{LL.HELP_INFORMATION_4()}
</Typography>
<Button
startIcon={<DownloadIcon />}
variant="outlined"
color="primary"
onClick={() => callAPI('system', 'info')}
>
<ListItemAvatar>
<Avatar sx={{ bgcolor: '#72caf9' }}>
<GitHubIcon />
</Avatar>
</ListItemAvatar>
<ListItemText primary={LL.HELP_INFORMATION_3()} />
</ListItemButton>
</ListItem>
</List>
{LL.SUPPORT_INFORMATION(0)}
</Button>
</Box>
<Box p={2} color="warning.main">
<Typography mb={1} variant="body2">
{LL.HELP_INFORMATION_4()}
</Typography>
<Button
sx={{ ml: 2 }}
startIcon={<DownloadIcon />}
variant="outlined"
color="primary"
onClick={() => callAPI('system', 'info')}
onClick={() => callAPI('system', 'allvalues')}
>
{LL.SUPPORT_INFORMATION(0)}
All Values
</Button>
</Box>
<Button
sx={{ ml: 2 }}
startIcon={<DownloadIcon />}
variant="outlined"
color="primary"
onClick={() => callAPI('system', 'allvalues')}
>
All Values
</Button>
<Box border={1} p={1} mt={4}>
<Typography align="center" variant="subtitle1" color="orange">
<b>{LL.HELP_INFORMATION_5()}</b>
</Typography>
<Typography align="center">
<Link
target="_blank"
href="https://github.com/emsesp/EMS-ESP32"
color="primary"
>
{'github.com/emsesp/EMS-ESP32'}
</Link>
</Typography>
<Typography color="white" variant="subtitle2" align="center">
@proddy @MichaelDvP
</Typography>
</Box>
</SectionContent>
<Box border={1} p={1} mt={4}>
<Typography align="center" variant="subtitle1" color="orange">
<b>{LL.HELP_INFORMATION_5()}</b>
</Typography>
<Typography align="center">
<Link
target="_blank"
href="https://github.com/emsesp/EMS-ESP32"
color="primary"
>
{'github.com/emsesp/EMS-ESP32'}
</Link>
</Typography>
<Typography color="white" variant="subtitle2" align="center">
@proddy @MichaelDvP
</Typography>
</Box>
</SectionContent>
</>
);
};

View File

@@ -8,6 +8,8 @@ import CircleIcon from '@mui/icons-material/Circle';
import WarningIcon from '@mui/icons-material/Warning';
import { Box, Button, Typography } from '@mui/material';
import { alovaInstance } from 'api/endpoints';
import {
Body,
Cell,
@@ -18,7 +20,7 @@ import {
Table
} from '@table-library/react-table-library/table';
import { useTheme } from '@table-library/react-table-library/theme';
import { updateState, useRequest } from 'alova';
import { updateState, useRequest } from 'alova/client';
import {
BlockNavigation,
ButtonRow,
@@ -122,14 +124,19 @@ const Modules: FC = () => {
return mi.enabled !== mi.o_enabled || mi.license !== mi.o_license;
}
// TODO example of how to use updateState
// TODO see https://alova.js.org/api/states/#updatestate
const updateModuleItem = (updatedItem: ModuleItem) => {
updateState('modules', (data: ModuleItem[]) => {
const new_data = data.map((mi) =>
mi.id === updatedItem.id ? { ...mi, ...updatedItem } : mi
);
setNumChanges(new_data.filter((mi) => hasModulesChanged(mi)).length);
return new_data;
});
updateState<ModuleItem[]>(
[alovaInstance.snapshots.match('modules', true)] as any,
(data: ModuleItem[]) => {
const new_data = data.map((mi) =>
mi.id === updatedItem.id ? { ...mi, ...updatedItem } : mi
);
setNumChanges(new_data.filter((mi) => hasModulesChanged(mi)).length);
return new_data;
}
);
};
const saveModules = async () => {

View File

@@ -19,7 +19,7 @@ import {
Table
} from '@table-library/react-table-library/table';
import { useTheme } from '@table-library/react-table-library/theme';
import { updateState, useRequest } from 'alova';
import { updateState, useRequest } from 'alova/client';
import {
BlockNavigation,
ButtonRow,
@@ -177,7 +177,6 @@ const Scheduler: FC = () => {
const onDialogSave = (updatedItem: ScheduleItem) => {
setDialogOpen(false);
updateState('schedule', (data: ScheduleItem[]) => {
const new_data = creating
? [

View File

@@ -21,7 +21,7 @@ import {
} from '@table-library/react-table-library/table';
import { useTheme } from '@table-library/react-table-library/theme';
import type { State } from '@table-library/react-table-library/types/common';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, SectionContent, useLayoutTitle } from 'components';
import { AuthenticatedContext } from 'contexts/authentication';
import { useI18nContext } from 'i18n/i18n-react';

View File

@@ -65,7 +65,7 @@ export const readDeviceEntities = (id: number) =>
alovaInstance.Get<DeviceEntity[]>(`/rest/deviceEntities`, {
params: { id },
responseType: 'arraybuffer',
transformData(data) {
transform(data) {
return (data as DeviceEntity[]).map((de: DeviceEntity) => ({
...de,
o_m: de.m,
@@ -89,7 +89,7 @@ export const writeDeviceName = (data: { id: number; name: string }) =>
export const readSchedule = () =>
alovaInstance.Get<ScheduleItem[]>('/rest/schedule', {
name: 'schedule',
transformData(data) {
transform(data) {
return (data as Schedule).schedule.map((si: ScheduleItem) => ({
...si,
o_id: si.id,
@@ -110,7 +110,7 @@ export const writeSchedule = (data: Schedule) =>
export const readModules = () =>
alovaInstance.Get<ModuleItem[]>('/rest/modules', {
name: 'modules',
transformData(data) {
transform(data) {
return (data as Modules).modules.map((mi: ModuleItem) => ({
...mi,
o_enabled: mi.enabled,
@@ -128,7 +128,7 @@ export const writeModules = (data: {
export const readCustomEntities = () =>
alovaInstance.Get<EntityItem[]>('/rest/customEntities', {
name: 'entities',
transformData(data) {
transform(data) {
return (data as Entities).entities.map((ei: EntityItem) => ({
...ei,
o_id: ei.id,

View File

@@ -19,7 +19,7 @@ import {
import * as SystemApi from 'api/system';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import RestartMonitor from 'app/status/RestartMonitor';
import type { ValidateFieldsError } from 'async-validator';
import {

View File

@@ -7,7 +7,7 @@ import { Button, Checkbox, MenuItem } from '@mui/material';
import * as NTPApi from 'api/ntp';
import { updateState } from 'alova';
import { updateState } from 'alova/client';
import type { ValidateFieldsError } from 'async-validator';
import {
BlockFormControlLabel,
@@ -73,6 +73,7 @@ const NTPSettings: FC = () => {
const changeTimeZone = (event: React.ChangeEvent<HTMLInputElement>) => {
updateFormValue(event);
// TODO fix
updateState('ntpSettings', (settings: NTPSettingsType) => ({
...settings,
tz_label: event.target.value,

View File

@@ -24,7 +24,7 @@ import {
import * as SystemApi from 'api/system';
import { dialogStyle } from 'CustomTheme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { SectionContent, useLayoutTitle } from 'components';
import ListMenuItem from 'components/layout/ListMenuItem';
import { useI18nContext } from 'i18n/i18n-react';

View File

@@ -7,7 +7,7 @@ import { Box, Button, Divider, Link, Typography } from '@mui/material';
import * as SystemApi from 'api/system';
import * as EMSESP from 'app/main/api';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import type { APIcall } from 'app/main/types';
import {
FormLoader,
@@ -150,11 +150,7 @@ const UploadDownload: FC = () => {
saveFile(event.data, 'schedule.json');
});
onGetAPI((event) => {
saveFile(
event.data,
event.sendArgs[0].device + '_' + event.sendArgs[0].entity + '.txt'
);
saveFile(event.data, event.args[0].device + '_' + event.args[0].entity + '.txt');
});
const downloadSettings = async () => {

View File

@@ -26,7 +26,7 @@ import {
import * as NetworkApi from 'api/network';
import * as SystemApi from 'api/system';
import { updateState, useRequest } from 'alova';
import { updateState, useRequest } from 'alova/client';
import type { ValidateFieldsError } from 'async-validator';
import {
BlockFormControlLabel,

View File

@@ -6,7 +6,7 @@ import { Button } from '@mui/material';
import * as NetworkApi from 'api/network';
import { updateState, useRequest } from 'alova';
import { updateState, useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
@@ -47,6 +47,7 @@ const WiFiNetworkScanner: FC = () => {
onCompleteScanNetworks(() => {
pollCount.current = 0;
setErrorMessage(undefined);
// TODO fix
updateState('listNetworks', () => undefined);
void getNetworkList();
});

View File

@@ -17,7 +17,7 @@ import {
import * as SecurityApi from 'api/security';
import { dialogStyle } from 'CustomTheme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { MessageBox } from 'components';
import { useI18nContext } from 'i18n/i18n-react';

View File

@@ -18,7 +18,7 @@ import type { Theme } from '@mui/material';
import * as APApi from 'api/ap';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { APStatusType } from 'types';

View File

@@ -14,7 +14,7 @@ import {
Table
} from '@table-library/react-table-library/table';
import { useTheme as tableTheme } from '@table-library/react-table-library/theme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { Translation } from 'i18n/i18n-types';

View File

@@ -22,7 +22,7 @@ import {
import * as SystemApi from 'api/system';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';

View File

@@ -19,7 +19,7 @@ import type { Theme } from '@mui/material';
import * as MqttApi from 'api/mqtt';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { MqttStatusType } from 'types';

View File

@@ -30,7 +30,7 @@ import type { Theme } from '@mui/material';
import * as NTPApi from 'api/ntp';
import { dialogStyle } from 'CustomTheme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { NTPStatusType, Time } from 'types';

View File

@@ -22,7 +22,7 @@ import type { Theme } from '@mui/material';
import * as NetworkApi from 'api/network';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { ButtonRow, FormLoader, SectionContent, useLayoutTitle } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { NetworkStatusType } from 'types';

View File

@@ -3,7 +3,7 @@ import type { FC } from 'react';
import * as SystemApi from 'api/system';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { FormLoader } from 'components';
import { useI18nContext } from 'i18n/i18n-react';

View File

@@ -34,7 +34,7 @@ import {
import * as SystemApi from 'api/system';
import { dialogStyle } from 'CustomTheme';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { busConnectionStatus } from 'app/main/types';
import { FormLoader, SectionContent, useLayoutTitle } from 'components';
import ListMenuItem from 'components/layout/ListMenuItem';
@@ -67,9 +67,11 @@ const SystemStatus: FC = () => {
const {
data: data,
send: loadData,
error
} = useRequest(SystemApi.readSystemStatus, { force: true });
loading,
send: loadData
} = useRequest(SystemApi.readSystemStatus, {
initialData: []
});
const theme = useTheme();
@@ -270,8 +272,12 @@ const SystemStatus: FC = () => {
);
const content = () => {
if (!data) {
return <FormLoader onRetry={loadData} errorMessage={error?.message} />;
// if (!data) {
// return <FormLoader onRetry={loadData} errorMessage={error?.message} />;
// }
if (loading) {
return <>fddfdd</>;
}
return (
@@ -405,9 +411,7 @@ const SystemStatus: FC = () => {
);
};
return (
<SectionContent>{restarting ? <RestartMonitor /> : content()}</SectionContent>
);
return <SectionContent>{content()}</SectionContent>;
};
export default SystemStatus;

View File

@@ -17,8 +17,7 @@ import {
import * as SystemApi from 'api/system';
import { fetchLogES } from 'api/system';
import { useSSE } from '@alova/scene-react';
import { useRequest } from 'alova';
import { useRequest, useSSE } from 'alova/client';
import {
BlockFormControlLabel,
BlockNavigation,

View File

@@ -8,7 +8,7 @@ import CloudUploadIcon from '@mui/icons-material/CloudUpload';
import { Box, Button, LinearProgress, Typography, useTheme } from '@mui/material';
import type { Theme } from '@mui/material';
import type { Progress } from 'alova';
import type { Progress } from 'alova/client';
import { useI18nContext } from 'i18n/i18n-react';
const getBorderColor = (theme: Theme, props: DropzoneState) => {

View File

@@ -6,7 +6,7 @@ import { toast } from 'react-toastify';
import * as AuthenticationApi from 'api/authentication';
import { ACCESS_TOKEN } from 'api/endpoints';
import { useRequest } from 'alova';
import { useRequest } from 'alova/client';
import { LoadingSpinner } from 'components';
import { useI18nContext } from 'i18n/i18n-react';
import type { Me } from 'types';

View File

@@ -2,14 +2,13 @@ import { useState } from 'react';
import { useBlocker } from 'react-router-dom';
import { toast } from 'react-toastify';
import { type Method, useRequest } from 'alova';
import type { AlovaGenerics, Method } from 'alova';
import { useRequest } from 'alova/client';
import { useI18nContext } from 'i18n/i18n-react';
export interface RestRequestOptions<D> {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
read: () => Method<any, any, any, any, any, any, any>;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
update: (value: D) => Method<any, any, any, any, any, any, any>;
read: () => Method<AlovaGenerics>;
update: (value: D) => Method<AlovaGenerics>;
}
export const useRest = <D>({ read, update }: RestRequestOptions<D>) => {
@@ -26,12 +25,14 @@ export const useRest = <D>({ read, update }: RestRequestOptions<D>) => {
data,
send: readData,
update: updateData,
// TODO refactor
onComplete: onReadComplete
} = useRequest(read());
const {
loading: saving,
send: writeData,
// TODO refactor
onSuccess: onWriteSuccess
} = useRequest((newData: D) => update(newData), { immediate: false });

File diff suppressed because it is too large Load Diff