2c0d0bf7a1
* Upgraded to Next.js 16 * Refactored code to comply with React 19.2 ESLint rules * Refactored some useEffect usages with the new useEffectEvent * Added Identities page and added second step to set up an identity after accepting an invitation * Updated all dependencies * Introduced PNPM catalogs for some frequently updated dependencies * Bugs fixing and improvements
117 lines
3.1 KiB
TypeScript
117 lines
3.1 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
|
|
import { useQuery } from '@tanstack/react-query';
|
|
import { RocketIcon } from 'lucide-react';
|
|
|
|
import {
|
|
AlertDialog,
|
|
AlertDialogContent,
|
|
AlertDialogDescription,
|
|
AlertDialogFooter,
|
|
AlertDialogHeader,
|
|
AlertDialogTitle,
|
|
} from '../shadcn/alert-dialog';
|
|
import { Button } from '../shadcn/button';
|
|
import { Trans } from './trans';
|
|
|
|
/**
|
|
* Current version of the app that is running
|
|
*/
|
|
let version: string | null = null;
|
|
|
|
/**
|
|
* Default interval time in seconds to check for new version
|
|
* By default, it is set to 120 seconds
|
|
*/
|
|
const DEFAULT_REFETCH_INTERVAL = 120;
|
|
|
|
/**
|
|
* Default interval time in seconds to check for new version
|
|
*/
|
|
const VERSION_UPDATER_REFETCH_INTERVAL_SECONDS =
|
|
process.env.NEXT_PUBLIC_VERSION_UPDATER_REFETCH_INTERVAL_SECONDS;
|
|
|
|
export function VersionUpdater(props: { intervalTimeInSecond?: number }) {
|
|
const { data } = useVersionUpdater(props);
|
|
const [dismissed, setDismissed] = useState(false);
|
|
const [showDialog, setShowDialog] = useState<boolean>(false);
|
|
|
|
if (!data?.didChange || dismissed) {
|
|
return null;
|
|
} else {
|
|
setShowDialog(data?.didChange ?? false);
|
|
}
|
|
|
|
return (
|
|
<AlertDialog open={showDialog} onOpenChange={setShowDialog}>
|
|
<AlertDialogContent>
|
|
<AlertDialogHeader>
|
|
<AlertDialogTitle className={'flex items-center gap-x-2'}>
|
|
<RocketIcon className={'h-4'} />
|
|
<span>
|
|
<Trans i18nKey="common:newVersionAvailable" />
|
|
</span>
|
|
</AlertDialogTitle>
|
|
|
|
<AlertDialogDescription>
|
|
<Trans i18nKey="common:newVersionAvailableDescription" />
|
|
</AlertDialogDescription>
|
|
</AlertDialogHeader>
|
|
|
|
<AlertDialogFooter>
|
|
<Button
|
|
variant={'outline'}
|
|
onClick={() => {
|
|
setShowDialog(false);
|
|
setDismissed(true);
|
|
}}
|
|
>
|
|
<Trans i18nKey="common:back" />
|
|
</Button>
|
|
|
|
<Button onClick={() => window.location.reload()}>
|
|
<Trans i18nKey="common:newVersionSubmitButton" />
|
|
</Button>
|
|
</AlertDialogFooter>
|
|
</AlertDialogContent>
|
|
</AlertDialog>
|
|
);
|
|
}
|
|
|
|
function useVersionUpdater(props: { intervalTimeInSecond?: number } = {}) {
|
|
const interval = VERSION_UPDATER_REFETCH_INTERVAL_SECONDS
|
|
? Number(VERSION_UPDATER_REFETCH_INTERVAL_SECONDS)
|
|
: DEFAULT_REFETCH_INTERVAL;
|
|
|
|
const refetchInterval = (props.intervalTimeInSecond ?? interval) * 1000;
|
|
|
|
// start fetching new version after half of the interval time
|
|
const staleTime = refetchInterval / 2;
|
|
|
|
return useQuery({
|
|
queryKey: ['version-updater'],
|
|
staleTime,
|
|
gcTime: refetchInterval,
|
|
refetchIntervalInBackground: true,
|
|
refetchInterval,
|
|
initialData: null,
|
|
queryFn: async () => {
|
|
const response = await fetch('/version');
|
|
const currentVersion = await response.text();
|
|
const oldVersion = version;
|
|
|
|
version = currentVersion;
|
|
|
|
const didChange = oldVersion !== null && currentVersion !== oldVersion;
|
|
|
|
return {
|
|
currentVersion,
|
|
oldVersion,
|
|
didChange,
|
|
};
|
|
},
|
|
});
|
|
}
|