From 73d6d813249a2be4ed5ad3d517d146c7c6a5b97e Mon Sep 17 00:00:00 2001 From: Afonso Jorge Ramos Date: Sun, 28 Dec 2025 23:29:02 +0000 Subject: [PATCH] refactor: add type-safe useAppContext hook --- src/renderer/App.tsx | 5 ++--- src/renderer/components/AllRead.tsx | 6 +++--- src/renderer/components/Sidebar.tsx | 6 +++--- src/renderer/components/filters/FilterSection.tsx | 6 +++--- src/renderer/components/filters/SearchFilter.tsx | 6 +++--- .../components/filters/SearchFilterSuggestions.tsx | 6 +++--- src/renderer/components/metrics/MetricGroup.tsx | 6 +++--- .../notifications/AccountNotifications.tsx | 6 +++--- .../components/notifications/NotificationHeader.tsx | 6 +++--- .../components/notifications/NotificationRow.tsx | 6 +++--- .../notifications/RepositoryNotifications.tsx | 6 +++--- src/renderer/components/primitives/Header.tsx | 6 +++--- .../components/settings/AppearanceSettings.tsx | 6 +++--- .../components/settings/NotificationSettings.tsx | 12 +++--------- src/renderer/components/settings/SettingsReset.tsx | 6 +++--- src/renderer/components/settings/SystemSettings.tsx | 6 +++--- src/renderer/components/settings/TraySettings.tsx | 6 +++--- src/renderer/context/App.tsx | 13 +++++++++++++ src/renderer/routes/Accounts.tsx | 6 +++--- src/renderer/routes/Filters.tsx | 6 +++--- src/renderer/routes/Login.tsx | 6 +++--- src/renderer/routes/LoginWithOAuthApp.tsx | 6 +++--- .../routes/LoginWithPersonalAccessToken.tsx | 6 +++--- src/renderer/routes/Notifications.tsx | 6 +++--- 24 files changed, 81 insertions(+), 75 deletions(-) diff --git a/src/renderer/App.tsx b/src/renderer/App.tsx index adf1f35b4..3c2b893fc 100644 --- a/src/renderer/App.tsx +++ b/src/renderer/App.tsx @@ -1,4 +1,3 @@ -import { useContext } from 'react'; import { Navigate, Route, @@ -10,7 +9,7 @@ import { import { BaseStyles, ThemeProvider } from '@primer/react'; import { AppLayout } from './components/layout/AppLayout'; -import { AppContext, AppProvider } from './context/App'; +import { AppProvider, useAppContext } from './context/App'; import { AccountsRoute } from './routes/Accounts'; import { FiltersRoute } from './routes/Filters'; import { LoginRoute } from './routes/Login'; @@ -22,7 +21,7 @@ import { SettingsRoute } from './routes/Settings'; import './App.css'; function RequireAuth({ children }) { - const { isLoggedIn } = useContext(AppContext); + const { isLoggedIn } = useAppContext(); const location = useLocation(); return isLoggedIn ? ( diff --git a/src/renderer/components/AllRead.tsx b/src/renderer/components/AllRead.tsx index 5b8956ae7..95e0de99d 100644 --- a/src/renderer/components/AllRead.tsx +++ b/src/renderer/components/AllRead.tsx @@ -1,7 +1,7 @@ -import { type FC, useContext, useMemo } from 'react'; +import { type FC, useMemo } from 'react'; import { Constants } from '../constants'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import { hasActiveFilters } from '../utils/notifications/filters/filter'; import { EmojiSplash } from './layout/EmojiSplash'; @@ -12,7 +12,7 @@ interface AllReadProps { export const AllRead: FC = ({ fullHeight = true, }: AllReadProps) => { - const { settings } = useContext(AppContext); + const { settings } = useAppContext(); const hasFilters = hasActiveFilters(settings); diff --git a/src/renderer/components/Sidebar.tsx b/src/renderer/components/Sidebar.tsx index be480c5aa..f4c7ae55c 100644 --- a/src/renderer/components/Sidebar.tsx +++ b/src/renderer/components/Sidebar.tsx @@ -1,4 +1,4 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; import { @@ -15,7 +15,7 @@ import { IconButton, Stack } from '@primer/react'; import { APPLICATION } from '../../shared/constants'; import { Constants } from '../constants'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import { quitApp } from '../utils/comms'; import { openGitHubIssues, @@ -37,7 +37,7 @@ export const Sidebar: FC = () => { auth, unreadNotificationCount, hasUnreadNotifications, - } = useContext(AppContext); + } = useAppContext(); // We naively assume that the first account is the primary account for the purposes of our sidebar quick links const primaryAccountHostname = diff --git a/src/renderer/components/filters/FilterSection.tsx b/src/renderer/components/filters/FilterSection.tsx index 6b3986b16..dbf7c0d84 100644 --- a/src/renderer/components/filters/FilterSection.tsx +++ b/src/renderer/components/filters/FilterSection.tsx @@ -1,9 +1,9 @@ -import { type ReactNode, useContext } from 'react'; +import type { ReactNode } from 'react'; import type { Icon } from '@primer/octicons-react'; import { Stack, Text } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import type { FilterSettingsState, FilterSettingsValue } from '../../types'; import type { Filter } from '../../utils/notifications/filters'; import { Checkbox } from '../fields/Checkbox'; @@ -29,7 +29,7 @@ export const FilterSection = ({ tooltip, layout = 'vertical', }: FilterSectionProps) => { - const { updateFilter, settings, notifications } = useContext(AppContext); + const { updateFilter, settings, notifications } = useAppContext(); return (
diff --git a/src/renderer/components/filters/SearchFilter.tsx b/src/renderer/components/filters/SearchFilter.tsx index 9a9ad1b8f..b5999349d 100644 --- a/src/renderer/components/filters/SearchFilter.tsx +++ b/src/renderer/components/filters/SearchFilter.tsx @@ -1,4 +1,4 @@ -import { type FC, useContext, useEffect, useState } from 'react'; +import { type FC, useEffect, useState } from 'react'; import { CheckCircleFillIcon, @@ -10,7 +10,7 @@ import { } from '@primer/octicons-react'; import { Stack, Text } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { IconColor, type SearchToken, Size } from '../../types'; import { cn } from '../../utils/cn'; import { @@ -22,7 +22,7 @@ import { RequiresDetailedNotificationWarning } from './RequiresDetailedNotificat import { TokenSearchInput } from './TokenSearchInput'; export const SearchFilter: FC = () => { - const { updateFilter, settings } = useContext(AppContext); + const { updateFilter, settings } = useAppContext(); // biome-ignore lint/correctness/useExhaustiveDependencies: only run on search filter changes useEffect(() => { diff --git a/src/renderer/components/filters/SearchFilterSuggestions.tsx b/src/renderer/components/filters/SearchFilterSuggestions.tsx index 606b02201..5a94dcaf0 100644 --- a/src/renderer/components/filters/SearchFilterSuggestions.tsx +++ b/src/renderer/components/filters/SearchFilterSuggestions.tsx @@ -1,8 +1,8 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { Popover, Stack, Text } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { Opacity } from '../../types'; import { cn } from '../../utils/cn'; import { @@ -20,7 +20,7 @@ export const SearchFilterSuggestions: FC = ({ open, inputValue, }) => { - const { settings } = useContext(AppContext); + const { settings } = useAppContext(); if (!open) { return null; diff --git a/src/renderer/components/metrics/MetricGroup.tsx b/src/renderer/components/metrics/MetricGroup.tsx index 9e39bb47a..203bcc795 100644 --- a/src/renderer/components/metrics/MetricGroup.tsx +++ b/src/renderer/components/metrics/MetricGroup.tsx @@ -1,4 +1,4 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { CommentIcon, @@ -7,7 +7,7 @@ import { TagIcon, } from '@primer/octicons-react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { IconColor } from '../../types'; import type { Notification } from '../../typesGitHub'; import { getPullRequestReviewIcon } from '../../utils/icons'; @@ -20,7 +20,7 @@ interface MetricGroupProps { export const MetricGroup: FC = ({ notification, }: MetricGroupProps) => { - const { settings } = useContext(AppContext); + const { settings } = useAppContext(); const commentsPillDescription = `${notification.subject.comments} ${ notification.subject.comments > 1 ? 'comments' : 'comment' diff --git a/src/renderer/components/notifications/AccountNotifications.tsx b/src/renderer/components/notifications/AccountNotifications.tsx index 4e1fb9a7e..599283f10 100644 --- a/src/renderer/components/notifications/AccountNotifications.tsx +++ b/src/renderer/components/notifications/AccountNotifications.tsx @@ -1,9 +1,9 @@ -import { type FC, type MouseEvent, useContext, useMemo, useState } from 'react'; +import { type FC, type MouseEvent, useMemo, useState } from 'react'; import { GitPullRequestIcon, IssueOpenedIcon } from '@primer/octicons-react'; import { Button, Stack } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { type Account, type GitifyError, Size } from '../../types'; import type { Notification } from '../../typesGitHub'; import { hasMultipleAccounts } from '../../utils/auth/utils'; @@ -38,7 +38,7 @@ export const AccountNotifications: FC = ( ) => { const { account, showAccountHeader, notifications } = props; - const { auth, settings } = useContext(AppContext); + const { auth, settings } = useAppContext(); const [showAccountNotifications, setShowAccountNotifications] = useState(true); diff --git a/src/renderer/components/notifications/NotificationHeader.tsx b/src/renderer/components/notifications/NotificationHeader.tsx index e3e0a8f77..1753843a7 100644 --- a/src/renderer/components/notifications/NotificationHeader.tsx +++ b/src/renderer/components/notifications/NotificationHeader.tsx @@ -1,8 +1,8 @@ -import { type FC, type MouseEvent, useContext } from 'react'; +import type { FC, MouseEvent } from 'react'; import { Stack } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { GroupBy, Opacity, Size } from '../../types'; import type { Notification } from '../../typesGitHub'; import { cn } from '../../utils/cn'; @@ -16,7 +16,7 @@ interface NotificationHeaderProps { export const NotificationHeader: FC = ({ notification, }: NotificationHeaderProps) => { - const { settings } = useContext(AppContext); + const { settings } = useAppContext(); const repoSlug = notification.repository.full_name; diff --git a/src/renderer/components/notifications/NotificationRow.tsx b/src/renderer/components/notifications/NotificationRow.tsx index 976f46bc7..2a77f129f 100644 --- a/src/renderer/components/notifications/NotificationRow.tsx +++ b/src/renderer/components/notifications/NotificationRow.tsx @@ -1,9 +1,9 @@ -import { type FC, useCallback, useContext, useState } from 'react'; +import { type FC, useCallback, useState } from 'react'; import { BellSlashIcon, CheckIcon, ReadIcon } from '@primer/octicons-react'; import { Stack, Text, Tooltip } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { GroupBy, Opacity, Size } from '../../types'; import type { Notification } from '../../typesGitHub'; import { cn } from '../../utils/cn'; @@ -29,7 +29,7 @@ export const NotificationRow: FC = ({ markNotificationsAsRead, markNotificationsAsDone, unsubscribeNotification, - } = useContext(AppContext); + } = useAppContext(); const [animateExit, setAnimateExit] = useState(false); const handleNotification = useCallback(() => { diff --git a/src/renderer/components/notifications/RepositoryNotifications.tsx b/src/renderer/components/notifications/RepositoryNotifications.tsx index da71b165f..cedf73ece 100644 --- a/src/renderer/components/notifications/RepositoryNotifications.tsx +++ b/src/renderer/components/notifications/RepositoryNotifications.tsx @@ -1,9 +1,9 @@ -import { type FC, type MouseEvent, useContext, useState } from 'react'; +import { type FC, type MouseEvent, useState } from 'react'; import { CheckIcon, ReadIcon } from '@primer/octicons-react'; import { Button, Stack } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { Opacity, Size } from '../../types'; import type { Notification } from '../../typesGitHub'; import { cn } from '../../utils/cn'; @@ -25,7 +25,7 @@ export const RepositoryNotifications: FC = ({ repoNotifications, }) => { const { settings, markNotificationsAsRead, markNotificationsAsDone } = - useContext(AppContext); + useAppContext(); const [animateExit, setAnimateExit] = useState(false); const [showRepositoryNotifications, setShowRepositoryNotifications] = useState(true); diff --git a/src/renderer/components/primitives/Header.tsx b/src/renderer/components/primitives/Header.tsx index 4f080f86a..80536dcc1 100644 --- a/src/renderer/components/primitives/Header.tsx +++ b/src/renderer/components/primitives/Header.tsx @@ -1,10 +1,10 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { useNavigate } from 'react-router-dom'; import { ArrowLeftIcon, type Icon } from '@primer/octicons-react'; import { IconButton, Stack } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { Title } from './Title'; interface HeaderProps { @@ -16,7 +16,7 @@ interface HeaderProps { export const Header: FC = (props: HeaderProps) => { const navigate = useNavigate(); - const { fetchNotifications } = useContext(AppContext); + const { fetchNotifications } = useAppContext(); return (
diff --git a/src/renderer/components/settings/AppearanceSettings.tsx b/src/renderer/components/settings/AppearanceSettings.tsx index 393e8d83d..0c904e56a 100644 --- a/src/renderer/components/settings/AppearanceSettings.tsx +++ b/src/renderer/components/settings/AppearanceSettings.tsx @@ -1,4 +1,4 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { PaintbrushIcon, @@ -15,7 +15,7 @@ import { Text, } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { Theme } from '../../types'; import { hasMultipleAccounts } from '../../utils/auth/utils'; import { @@ -31,7 +31,7 @@ import { FieldLabel } from '../fields/FieldLabel'; import { Title } from '../primitives/Title'; export const AppearanceSettings: FC = () => { - const { auth, settings, updateSetting } = useContext(AppContext); + const { auth, settings, updateSetting } = useAppContext(); const zoomPercentage = zoomLevelToPercentage(window.gitify.zoom.getLevel()); return ( diff --git a/src/renderer/components/settings/NotificationSettings.tsx b/src/renderer/components/settings/NotificationSettings.tsx index e330c2886..66bb02de7 100644 --- a/src/renderer/components/settings/NotificationSettings.tsx +++ b/src/renderer/components/settings/NotificationSettings.tsx @@ -1,10 +1,4 @@ -import { - type FC, - type MouseEvent, - useContext, - useEffect, - useState, -} from 'react'; +import { type FC, type MouseEvent, useEffect, useState } from 'react'; import { BellIcon, @@ -25,7 +19,7 @@ import { formatDuration, millisecondsToMinutes } from 'date-fns'; import { APPLICATION } from '../../../shared/constants'; import { Constants } from '../../constants'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { FetchType, GroupBy, Size } from '../../types'; import { openGitHubParticipatingDocs } from '../../utils/links'; import { Checkbox } from '../fields/Checkbox'; @@ -34,7 +28,7 @@ import { RadioGroup } from '../fields/RadioGroup'; import { Title } from '../primitives/Title'; export const NotificationSettings: FC = () => { - const { settings, updateSetting } = useContext(AppContext); + const { settings, updateSetting } = useAppContext(); const [fetchInterval, setFetchInterval] = useState( settings.fetchInterval, ); diff --git a/src/renderer/components/settings/SettingsReset.tsx b/src/renderer/components/settings/SettingsReset.tsx index 4fbd9cd92..ead10082b 100644 --- a/src/renderer/components/settings/SettingsReset.tsx +++ b/src/renderer/components/settings/SettingsReset.tsx @@ -1,12 +1,12 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { Button, Stack, useConfirm } from '@primer/react'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { rendererLogInfo } from '../../utils/logger'; export const SettingsReset: FC = () => { - const { resetSettings } = useContext(AppContext); + const { resetSettings } = useAppContext(); const confirm = useConfirm(); diff --git a/src/renderer/components/settings/SystemSettings.tsx b/src/renderer/components/settings/SystemSettings.tsx index 2a85bb994..c87d4aacb 100644 --- a/src/renderer/components/settings/SystemSettings.tsx +++ b/src/renderer/components/settings/SystemSettings.tsx @@ -1,11 +1,11 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { DeviceDesktopIcon, SyncIcon } from '@primer/octicons-react'; import { Button, ButtonGroup, IconButton, Stack, Text } from '@primer/react'; import { APPLICATION } from '../../../shared/constants'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { defaultSettings } from '../../context/defaults'; import { OpenPreference } from '../../types'; import { @@ -21,7 +21,7 @@ import { VolumeUpIcon } from '../icons/VolumeUpIcon'; import { Title } from '../primitives/Title'; export const SystemSettings: FC = () => { - const { settings, updateSetting } = useContext(AppContext); + const { settings, updateSetting } = useAppContext(); return (
diff --git a/src/renderer/components/settings/TraySettings.tsx b/src/renderer/components/settings/TraySettings.tsx index 37e287f04..2866411e6 100644 --- a/src/renderer/components/settings/TraySettings.tsx +++ b/src/renderer/components/settings/TraySettings.tsx @@ -1,16 +1,16 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { DevicesIcon } from '@primer/octicons-react'; import { Stack, Text } from '@primer/react'; import { APPLICATION } from '../../../shared/constants'; -import { AppContext } from '../../context/App'; +import { useAppContext } from '../../context/App'; import { Checkbox } from '../fields/Checkbox'; import { Title } from '../primitives/Title'; export const TraySettings: FC = () => { - const { settings, updateSetting } = useContext(AppContext); + const { settings, updateSetting } = useAppContext(); return (
diff --git a/src/renderer/context/App.tsx b/src/renderer/context/App.tsx index 068a34707..e0b7ab0c0 100644 --- a/src/renderer/context/App.tsx +++ b/src/renderer/context/App.tsx @@ -2,6 +2,7 @@ import { createContext, type ReactNode, useCallback, + useContext, useEffect, useMemo, useState, @@ -108,6 +109,18 @@ export interface AppContextState { export const AppContext = createContext>({}); +/** + * Custom hook that provides type-safe access to AppContext. + * Throws if used outside of AppProvider. + */ +export function useAppContext(): AppContextState { + const context = useContext(AppContext); + if (!context || Object.keys(context).length === 0) { + throw new Error('useAppContext must be used within an AppProvider'); + } + return context as AppContextState; +} + export const AppProvider = ({ children }: { children: ReactNode }) => { const existingState = loadState(); diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx index b4530f2ab..2f2539ddf 100644 --- a/src/renderer/routes/Accounts.tsx +++ b/src/renderer/routes/Accounts.tsx @@ -1,4 +1,4 @@ -import { type FC, useCallback, useContext, useState } from 'react'; +import { type FC, useCallback, useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { @@ -26,7 +26,7 @@ import { Contents } from '../components/layout/Contents'; import { Page } from '../components/layout/Page'; import { Footer } from '../components/primitives/Footer'; import { Header } from '../components/primitives/Header'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import { type Account, Size } from '../types'; import { formatAlternateOAuthScopes, @@ -45,7 +45,7 @@ import { saveState } from '../utils/storage'; export const AccountsRoute: FC = () => { const { auth, settings, loginWithGitHubApp, logoutFromAccount } = - useContext(AppContext); + useAppContext(); const navigate = useNavigate(); const [loadingStates, setLoadingStates] = useState>( diff --git a/src/renderer/routes/Filters.tsx b/src/renderer/routes/Filters.tsx index 160af183e..cccb634c6 100644 --- a/src/renderer/routes/Filters.tsx +++ b/src/renderer/routes/Filters.tsx @@ -1,4 +1,4 @@ -import { type FC, useContext } from 'react'; +import type { FC } from 'react'; import { FilterIcon, FilterRemoveIcon } from '@primer/octicons-react'; import { Button, Stack, Tooltip } from '@primer/react'; @@ -12,10 +12,10 @@ import { Contents } from '../components/layout/Contents'; import { Page } from '../components/layout/Page'; import { Footer } from '../components/primitives/Footer'; import { Header } from '../components/primitives/Header'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; export const FiltersRoute: FC = () => { - const { clearFilters } = useContext(AppContext); + const { clearFilters } = useAppContext(); return ( diff --git a/src/renderer/routes/Login.tsx b/src/renderer/routes/Login.tsx index 657d89006..c79bae8fb 100644 --- a/src/renderer/routes/Login.tsx +++ b/src/renderer/routes/Login.tsx @@ -1,4 +1,4 @@ -import { type FC, useCallback, useContext, useEffect } from 'react'; +import { type FC, useCallback, useEffect } from 'react'; import { useNavigate } from 'react-router-dom'; import { KeyIcon, MarkGithubIcon, PersonIcon } from '@primer/octicons-react'; @@ -6,14 +6,14 @@ import { Button, Heading, Stack, Text } from '@primer/react'; import { LogoIcon } from '../components/icons/LogoIcon'; import { Centered } from '../components/layout/Centered'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import { Size } from '../types'; import { showWindow } from '../utils/comms'; import { rendererLogError } from '../utils/logger'; export const LoginRoute: FC = () => { const navigate = useNavigate(); - const { loginWithGitHubApp, isLoggedIn } = useContext(AppContext); + const { loginWithGitHubApp, isLoggedIn } = useAppContext(); useEffect(() => { if (isLoggedIn) { diff --git a/src/renderer/routes/LoginWithOAuthApp.tsx b/src/renderer/routes/LoginWithOAuthApp.tsx index 1a2bd9b4e..423296f91 100644 --- a/src/renderer/routes/LoginWithOAuthApp.tsx +++ b/src/renderer/routes/LoginWithOAuthApp.tsx @@ -1,4 +1,4 @@ -import { type FC, useCallback, useContext, useState } from 'react'; +import { type FC, useCallback, useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { @@ -23,7 +23,7 @@ import { Page } from '../components/layout/Page'; import { Footer } from '../components/primitives/Footer'; import { Header } from '../components/primitives/Header'; import { Constants } from '../constants'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import type { ClientID, ClientSecret, Hostname, Token } from '../types'; import type { LoginOAuthAppOptions } from '../utils/auth/types'; import { @@ -75,7 +75,7 @@ export const validateForm = (values: IFormData): IFormErrors => { export const LoginWithOAuthAppRoute: FC = () => { const navigate = useNavigate(); - const { loginWithOAuthApp } = useContext(AppContext); + const { loginWithOAuthApp } = useAppContext(); const [maskToken, setMaskToken] = useState(true); const [isVerifyingCredentials, setIsVerifyingCredentials] = useState(false); diff --git a/src/renderer/routes/LoginWithPersonalAccessToken.tsx b/src/renderer/routes/LoginWithPersonalAccessToken.tsx index 9ec15609b..8c78c0c9a 100644 --- a/src/renderer/routes/LoginWithPersonalAccessToken.tsx +++ b/src/renderer/routes/LoginWithPersonalAccessToken.tsx @@ -1,4 +1,4 @@ -import { type FC, useCallback, useContext, useState } from 'react'; +import { type FC, useCallback, useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { @@ -23,7 +23,7 @@ import { Page } from '../components/layout/Page'; import { Footer } from '../components/primitives/Footer'; import { Header } from '../components/primitives/Header'; import { Constants } from '../constants'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import type { Hostname, Token } from '../types'; import type { LoginPersonalAccessTokenOptions } from '../utils/auth/types'; import { @@ -67,7 +67,7 @@ export const validateForm = (values: IFormData): IFormErrors => { export const LoginWithPersonalAccessTokenRoute: FC = () => { const navigate = useNavigate(); - const { loginWithPersonalAccessToken } = useContext(AppContext); + const { loginWithPersonalAccessToken } = useAppContext(); const [maskClientSecret, setMaskClientSecret] = useState(true); const [isVerifyingCredentials, setIsVerifyingCredentials] = useState(false); diff --git a/src/renderer/routes/Notifications.tsx b/src/renderer/routes/Notifications.tsx index 065cecf96..04aabcc1a 100644 --- a/src/renderer/routes/Notifications.tsx +++ b/src/renderer/routes/Notifications.tsx @@ -1,16 +1,16 @@ -import { type FC, useContext, useMemo } from 'react'; +import { type FC, useMemo } from 'react'; import { AllRead } from '../components/AllRead'; import { Contents } from '../components/layout/Contents'; import { Page } from '../components/layout/Page'; import { AccountNotifications } from '../components/notifications/AccountNotifications'; import { Oops } from '../components/Oops'; -import { AppContext } from '../context/App'; +import { useAppContext } from '../context/App'; import { getAccountUUID } from '../utils/auth/utils'; export const NotificationsRoute: FC = () => { const { notifications, status, globalError, settings, hasNotifications } = - useContext(AppContext); + useAppContext(); const hasMultipleAccounts = useMemo( () => notifications.length > 1,