Move app-update-checker files into new folder

src/screens/settings/About.tsx

@@ -12,184 +12,16 @@ import ListItem from '@mui/material/ListItem';
 import ListItemText from '@mui/material/ListItemText';
 import { useTranslation } from 'react-i18next';
 import ListSubheader from '@mui/material/ListSubheader';
-import Button from '@mui/material/Button';
-import CircularProgress from '@mui/material/CircularProgress';
 import Divider from '@mui/material/Divider';
-import Stack from '@mui/material/Stack';
-import Typography from '@mui/material/Typography';
-import RefreshIcon from '@mui/icons-material/Refresh';
-import DownloadIcon from '@mui/icons-material/Download';
-import OpenInNewIcon from '@mui/icons-material/OpenInNew';
-import { t as translate } from 'i18next';
-import DownloadingIcon from '@mui/icons-material/Downloading';
 import { requestManager } from '@/lib/requests/requests/RequestManager.ts';
 import { ListItemLink } from '@/modules/core/components/ListItemLink.tsx';
 import { NavBarContext } from '@/components/context/NavbarContext';
 import { LoadingPlaceholder } from '@/modules/core/components/placeholder/LoadingPlaceholder.tsx';
-import { GetAboutQuery, UpdateState } from '@/lib/graphql/generated/graphql.ts';
+import { UpdateState } from '@/lib/graphql/generated/graphql.ts';
 import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
 import { EmptyViewAbsoluteCentered } from '@/modules/core/components/placeholder/EmptyViewAbsoluteCentered.tsx';
-import { epochToDate } from '@/util/DateHelper.ts';
-
-type AboutServer = GetAboutQuery['aboutServer'];
-
-export const getVersion = (aboutServer: AboutServer) => {
-    if (aboutServer.buildType === 'Stable') return `${aboutServer.version}`;
-    return `${aboutServer.version}-${aboutServer.revision}`;
-};
-
-const getBuildTime = (aboutServer: AboutServer) => epochToDate(Number(aboutServer.buildTime)).toString();
-
-const getUpdateCheckButtonIcon = (
-    isLoading: boolean,
-    isUpdateAvailable: boolean,
-    updateState?: UpdateState,
-    asLink: boolean = false,
-) => {
-    const isUpdateInProgress = updateState === UpdateState.Downloading;
-    if (isUpdateInProgress) {
-        return <DownloadingIcon />;
-    }
-
-    if (isLoading) {
-        return <CircularProgress size={15} />;
-    }
-
-    const isRefreshRequired = !isUpdateAvailable || updateState === UpdateState.Error;
-    if (isRefreshRequired) {
-        return <RefreshIcon />;
-    }
-
-    return asLink ? <OpenInNewIcon /> : <DownloadIcon />;
-};
-
-const getUpdateCheckButtonText = (
-    isLoading: boolean,
-    isUpdateAvailable: boolean,
-    error: any,
-    updateState?: UpdateState,
-    progress: number = 0,
-) => {
-    const isUpdating = updateState === UpdateState.Downloading;
-    if (isUpdating) {
-        return translate('global.update.label.updating', { progress });
-    }
-
-    const didUpdateFail = updateState === UpdateState.Error;
-    if (didUpdateFail) {
-        return translate('global.update.label.update_failure');
-    }
-
-    if (isLoading) {
-        return translate('global.update.label.checking');
-    }
-
-    if (error) {
-        return translate('global.update.label.check_failure');
-    }
-
-    if (isUpdateAvailable) {
-        return translate('global.update.label.available');
-    }
-
-    return translate('global.update.label.up_to_date');
-};
-
-type BaseVersionInfoProps = {
-    version: string;
-    isCheckingForUpdate: boolean;
-    isUpdateAvailable: boolean;
-    updateCheckError: any;
-    checkForUpdate: () => void;
-};
-
-type LinkVersionInfoProps = {
-    downloadAsLink: true;
-    url: string;
-};
-
-type TriggerVersionInfoProps = {
-    triggerUpdate: () => void;
-    updateState: UpdateState;
-    progress: number;
-};
-
-type VersionInfoProps =
-    | (BaseVersionInfoProps & PropertiesNever<TriggerVersionInfoProps> & LinkVersionInfoProps)
-    | (BaseVersionInfoProps & TriggerVersionInfoProps & PropertiesNever<LinkVersionInfoProps>);
-
-const VersionInfo = ({
-    version,
-    isCheckingForUpdate,
-    isUpdateAvailable,
-    updateCheckError,
-    checkForUpdate,
-    triggerUpdate,
-    updateState,
-    progress,
-    downloadAsLink,
-    url,
-}: VersionInfoProps) => {
-    const isUpdateInProgress = updateState === UpdateState.Downloading;
-
-    const onClick = () => {
-        if (isUpdateInProgress) {
-            return;
-        }
-
-        const shouldCheckForUpdate = !isUpdateAvailable || updateCheckError || updateState === UpdateState.Error;
-        if (shouldCheckForUpdate) {
-            checkForUpdate();
-            return;
-        }
-
-        if (isUpdateAvailable) {
-            triggerUpdate?.();
-        }
-    };
-
-    return (
-        <Stack
-            sx={{
-                alignItems: 'start',
-            }}
-        >
-            <Typography component="span" variant="body2">
-                {version}
-            </Typography>
-            <Button
-                sx={{
-                    marginTop: '5px',
-                    backgroundColor: 'transparent',
-                    pointerEvents: isUpdateInProgress ? 'none' : 'unset',
-                }}
-                size="small"
-                variant="outlined"
-                startIcon={getUpdateCheckButtonIcon(
-                    isCheckingForUpdate,
-                    isUpdateAvailable,
-                    updateState,
-                    downloadAsLink,
-                )}
-                onClick={onClick}
-                {...(!!url && isUpdateAvailable
-                    ? {
-                          href: url,
-                          target: '_blank',
-                      }
-                    : undefined)}
-            >
-                {getUpdateCheckButtonText(
-                    isCheckingForUpdate,
-                    isUpdateAvailable,
-                    updateCheckError,
-                    updateState,
-                    progress,
-                )}
-            </Button>
-        </Stack>
-    );
-};
+import { getBuildTime, getVersion } from '@/modules/app-updates/services/AppUpdateChecker.tsx';
+import { VersionInfo } from '@/modules/app-updates/components/VersionInfo.tsx';
 
 export function About() {
     const { t } = useTranslation();