diff --git a/src/renderer/features/titlebar/components/app-menu.tsx b/src/renderer/features/titlebar/components/app-menu.tsx index a89592a6c..96220d579 100644 --- a/src/renderer/features/titlebar/components/app-menu.tsx +++ b/src/renderer/features/titlebar/components/app-menu.tsx @@ -9,6 +9,7 @@ import packageJson from '../../../../../package.json'; import { isServerLock } from '/@/renderer/features/action-required/utils/window-properties'; import { ServerList } from '/@/renderer/features/servers/components/server-list'; import { openSettingsModal } from '/@/renderer/features/settings/utils/open-settings-modal'; +import { openReleaseNotesModal } from '/@/renderer/release-notes-modal'; import { useAppStore, useAppStoreActions, useCommandPalette } from '/@/renderer/store'; import { DropdownMenu, MenuItemProps } from '/@/shared/components/dropdown-menu/dropdown-menu'; import { Icon } from '/@/shared/components/icon/icon'; @@ -225,16 +226,19 @@ export const AppMenu = () => { type: 'divider', }, { - component: 'a', - href: 'https://github.com/jeffvli/feishin/releases', icon: 'brandGitHub', id: 'version', label: t('page.appMenu.version', { postProcess: 'sentenceCase', version: packageJson.version, }), - rightSection: , - target: '_blank', + onClick: () => + openReleaseNotesModal( + t('common.newVersion', { + postProcess: 'sentenceCase', + version: packageJson.version, + }) as string, + ), type: 'item', }, { diff --git a/src/renderer/release-notes-modal.tsx b/src/renderer/release-notes-modal.tsx index 71bd5e692..8a2d8fa64 100644 --- a/src/renderer/release-notes-modal.tsx +++ b/src/renderer/release-notes-modal.tsx @@ -2,7 +2,7 @@ import { closeAllModals, openModal } from '@mantine/modals'; import { useQuery } from '@tanstack/react-query'; import axios from 'axios'; import DOMPurify from 'dompurify'; -import { useCallback, useEffect, useMemo, useState } from 'react'; +import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; import packageJson from '../../package.json'; @@ -216,10 +216,14 @@ const ReleaseNotesContent = ({ onDismiss, version }: ReleaseNotesContentProps) = const WAIT_FOR_LOCAL_STORAGE = 1000 * 2; -export const ReleaseNotesModal = () => { - const { version } = packageJson; - const { t } = useTranslation(); +interface ReleaseNotesModalContentWrapperProps { + setDismissRef?: (fn: (() => void) | undefined) => void; +} +const ReleaseNotesModalContentWrapper = ({ + setDismissRef, +}: ReleaseNotesModalContentWrapperProps) => { + const { version } = packageJson; const [, setValue] = useLocalStorage({ key: 'version' }); const handleDismiss = useCallback(() => { @@ -227,6 +231,36 @@ export const ReleaseNotesModal = () => { closeAllModals(); }, [setValue, version]); + useEffect(() => { + setDismissRef?.(handleDismiss); + return () => setDismissRef?.(undefined); + }, [handleDismiss, setDismissRef]); + + return ; +}; + +export const openReleaseNotesModal = (title: string) => { + const dismissRef = { current: null as (() => void) | null }; + + openModal({ + children: ( + { + dismissRef.current = fn ?? null; + }} + /> + ), + onClose: () => dismissRef.current?.(), + size: 'xl', + title, + }); +}; + +export const ReleaseNotesModal = () => { + const { version } = packageJson; + const { t } = useTranslation(); + const dismissRef = useRef<(() => void) | null>(null); + useEffect(() => { const timeoutId = setTimeout(() => { const valueFromLocalStorage = localStorage.getItem('version'); @@ -235,8 +269,14 @@ export const ReleaseNotesModal = () => { // Only show modal if the stored version is different from current version if (valueFromLocalStorage !== versionString) { openModal({ - children: , - onClose: handleDismiss, + children: ( + { + dismissRef.current = fn ?? null; + }} + /> + ), + onClose: () => dismissRef.current?.(), size: 'xl', title: t('common.newVersion', { postProcess: 'sentenceCase', @@ -249,7 +289,7 @@ export const ReleaseNotesModal = () => { return () => { clearTimeout(timeoutId); }; - }, [handleDismiss, t, version]); + }, [t, version]); return null; };