b0ed19d6a3
* feat: implement prefs -> credentials section UI (w/o backend integration) * feat: implement credentials information on Prefs -> Account pane - implement email changing UI (w/o backend integration) - implement password changing UI and reuse existing change password logic - replace 2FA dialog with shared one - implement React hook for preventing window refresh * fix: provide correct types * refactor: reuse styles from stylekit, rename components and create enum for input types * refactor: update default exports to named ones, correct texts * chore: remove unnecessary depenedency * chore: yarn.lock without unnecessary packages * Revert "chore: yarn.lock without unnecessary packages" This reverts commit 64aa75e8408b06884d6e7383180292a4a9a3e8ad.
59 lines
1.9 KiB
TypeScript
59 lines
1.9 KiB
TypeScript
import { PreferencesGroup, PreferencesSegment, Text, Title } from '@/preferences/components';
|
|
import { Button } from '@/components/Button';
|
|
import { SyncQueueStrategy } from '@node_modules/@standardnotes/snjs';
|
|
import { STRING_GENERIC_SYNC_ERROR } from '@/strings';
|
|
import { useState } from '@node_modules/preact/hooks';
|
|
import { dateToLocalizedString } from '@/utils';
|
|
import { observer } from '@node_modules/mobx-react-lite';
|
|
import { WebApplication } from '@/ui_models/application';
|
|
|
|
type Props = {
|
|
application: WebApplication;
|
|
};
|
|
|
|
export const Sync = observer(({ application }: Props) => {
|
|
const formatLastSyncDate = (lastUpdatedDate: Date) => {
|
|
return dateToLocalizedString(lastUpdatedDate);
|
|
};
|
|
|
|
const [isSyncingInProgress, setIsSyncingInProgress] = useState(false);
|
|
const [lastSyncDate, setLastSyncDate] = useState(formatLastSyncDate(application.getLastSyncDate() as Date));
|
|
|
|
const doSynchronization = async () => {
|
|
setIsSyncingInProgress(true);
|
|
|
|
const response = await application.sync({
|
|
queueStrategy: SyncQueueStrategy.ForceSpawnNew,
|
|
checkIntegrity: true
|
|
});
|
|
setIsSyncingInProgress(false);
|
|
if (response && response.error) {
|
|
application.alertService!.alert(STRING_GENERIC_SYNC_ERROR);
|
|
} else {
|
|
setLastSyncDate(formatLastSyncDate(application.getLastSyncDate() as Date));
|
|
}
|
|
};
|
|
|
|
return (
|
|
<PreferencesGroup>
|
|
<PreferencesSegment>
|
|
<div className='flex flex-row items-center'>
|
|
<div className='flex-grow flex flex-col'>
|
|
<Title>Sync</Title>
|
|
<Text>
|
|
Last synced <span className='font-bold'>on {lastSyncDate}</span>
|
|
</Text>
|
|
<Button
|
|
className='min-w-20 mt-3'
|
|
type='normal'
|
|
label='Sync now'
|
|
disabled={isSyncingInProgress}
|
|
onClick={doSynchronization}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</PreferencesSegment>
|
|
</PreferencesGroup>
|
|
);
|
|
});
|