Remove deprecated imports for several components

packages/desktop-client/src/auth/ProtectedRoute.tsx

@@ -1,8 +1,9 @@
 import { useEffect, useState, type ReactElement } from 'react';
 
+import { View } from '@actual-app/components/view';
+
 import { type RemoteFile, type SyncedLocalFile } from 'loot-core/types/file';
 
-import { View } from '../components/common/View';
 import { useMetadataPref } from '../hooks/useMetadataPref';
 import { useSelector } from '../redux';
 

packages/desktop-client/src/components/AnimatedRefresh.tsx

@@ -1,12 +1,11 @@
 // @ts-strict-ignore
 import React, { type CSSProperties } from 'react';
 
+import { View } from '@actual-app/components/view';
 import { keyframes } from '@emotion/css';
 
 import { SvgRefresh } from '../icons/v1';
 
-import { View } from './common/View';
-
 const spin = keyframes({
   '0%': { transform: 'rotateZ(0deg)' },
   '100%': { transform: 'rotateZ(360deg)' },

packages/desktop-client/src/components/App.tsx

@@ -11,6 +11,9 @@ import { HotkeysProvider } from 'react-hotkeys-hook';
 import { useTranslation } from 'react-i18next';
 import { BrowserRouter } from 'react-router-dom';
 
+import { styles } from '@actual-app/components/styles';
+import { View } from '@actual-app/components/view';
+
 import {
   addNotification,
   closeBudget,
@@ -27,12 +30,11 @@ import { handleGlobalEvents } from '../global-events';
 import { useMetadataPref } from '../hooks/useMetadataPref';
 import { installPolyfills } from '../polyfills';
 import { useDispatch, useSelector, useStore } from '../redux';
-import { styles, hasHiddenScrollbars, ThemeStyle, useTheme } from '../style';
+import { hasHiddenScrollbars, ThemeStyle, useTheme } from '../style';
 import { ExposeNavigate } from '../util/router-tools';
 
 import { AppBackground } from './AppBackground';
 import { BudgetMonthCountProvider } from './budget/BudgetMonthCountContext';
-import { View } from './common/View';
 import { DevelopmentTopBar } from './DevelopmentTopBar';
 import { FatalError } from './FatalError';
 import { FinancesApp } from './FinancesApp';

packages/desktop-client/src/components/BankSyncStatus.tsx

@@ -2,12 +2,14 @@ import React from 'react';
 import { Trans } from 'react-i18next';
 import { useTransition, animated } from 'react-spring';
 
+import { styles } from '@actual-app/components/styles';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
+
 import { useSelector } from '../redux';
-import { theme, styles } from '../style';
+import { theme } from '../style';
 
 import { AnimatedRefresh } from './AnimatedRefresh';
-import { Text } from './common/Text';
-import { View } from './common/View';
 
 export function BankSyncStatus() {
   const accountsSyncing = useSelector(state => state.account.accountsSyncing);

packages/desktop-client/src/components/DevelopmentTopBar.tsx

@@ -1,7 +1,8 @@
+import { View } from '@actual-app/components/view';
+
 import { theme } from '../style';
 
 import { Link } from './common/Link';
-import { View } from './common/View';
 
 export function DevelopmentTopBar() {
   return (

packages/desktop-client/src/components/EditablePageHeaderTitle.tsx

@@ -1,12 +1,13 @@
 import React, { useCallback, useEffect, useState } from 'react';
 
+import { Button } from '@actual-app/components/button';
+import { InitialFocus } from '@actual-app/components/initial-focus';
+import { View } from '@actual-app/components/view';
+
 import { SvgPencil1 } from '../icons/v2';
 import { theme } from '../style';
 
-import { Button } from './common/Button2';
-import { InitialFocus } from './common/InitialFocus';
 import { Input } from './common/Input';
-import { View } from './common/View';
 
 type EditablePageHeaderTitleProps = {
   title: string;

packages/desktop-client/src/components/FinancesApp.tsx

@@ -9,6 +9,8 @@ import {
   useHref,
 } from 'react-router-dom';
 
+import { View } from '@actual-app/components/view';
+
 import { addNotification } from 'loot-core/client/actions';
 import { sync } from 'loot-core/client/app/appSlice';
 import * as undo from 'loot-core/platform/client/undo';
@@ -26,7 +28,6 @@ import { getIsOutdated, getLatestVersion } from '../util/versions';
 import { UserAccessPage } from './admin/UserAccess/UserAccessPage';
 import { BankSync } from './banksync';
 import { BankSyncStatus } from './BankSyncStatus';
-import { View } from './common/View';
 import { GlobalKeys } from './GlobalKeys';
 import { ManageRulesPage } from './ManageRulesPage';
 import { Category } from './mobile/budget/Category';

packages/desktop-client/src/components/FixedSizeList.tsx

@@ -9,10 +9,9 @@ import {
   type CSSProperties,
 } from 'react';
 
+import { View } from '@actual-app/components/view';
 import memoizeOne from 'memoize-one';
 
-import { View } from './common/View';
-
 const IS_SCROLLING_DEBOUNCE_INTERVAL = 150;
 
 const defaultItemKey: FixedSizeListProps['itemKey'] = (index: number) => index;

packages/desktop-client/src/components/HelpMenu.tsx

@@ -3,6 +3,10 @@ import { useHotkeys } from 'react-hotkeys-hook';
 import { Trans, useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router-dom';
 
+import { Button } from '@actual-app/components/button';
+import { Menu } from '@actual-app/components/menu';
+import { Popover } from '@actual-app/components/popover';
+import { SpaceBetween } from '@actual-app/components/space-between';
 import { useToggle } from 'usehooks-ts';
 
 import { pushModal } from 'loot-core/client/actions/modals';
@@ -11,11 +15,6 @@ import { useFeatureFlag } from '../hooks/useFeatureFlag';
 import { SvgHelp } from '../icons/v2/Help';
 import { useDispatch } from '../redux';
 
-import { Button } from './common/Button2';
-import { Menu } from './common/Menu';
-import { Popover } from './common/Popover';
-import { SpaceBetween } from './common/SpaceBetween';
-
 const getPageDocs = (page: string) => {
   switch (page) {
     case '/budget':

packages/desktop-client/src/components/LoggedInUser.tsx

@@ -2,6 +2,13 @@ import React, { useState, useEffect, useRef, type CSSProperties } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router-dom';
 
+import { Button } from '@actual-app/components/button';
+import { Menu } from '@actual-app/components/menu';
+import { Popover } from '@actual-app/components/popover';
+import { styles } from '@actual-app/components/styles';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
+
 import { closeBudget, getUserData, signOut } from 'loot-core/client/actions';
 import { listen } from 'loot-core/platform/client/fetch';
 import { type RemoteFile, type SyncedLocalFile } from 'loot-core/types/file';
@@ -12,13 +19,8 @@ import { Permissions } from '../auth/types';
 import { useMetadataPref } from '../hooks/useMetadataPref';
 import { useNavigate } from '../hooks/useNavigate';
 import { useSelector, useDispatch } from '../redux';
-import { theme, styles } from '../style';
+import { theme } from '../style';
 
-import { Button } from './common/Button2';
-import { Menu } from './common/Menu';
-import { Popover } from './common/Popover';
-import { Text } from './common/Text';
-import { View } from './common/View';
 import { PrivacyFilter } from './PrivacyFilter';
 import { useMultiuserEnabled, useServerURL } from './ServerContext';
 

packages/desktop-client/src/components/ManageRules.tsx

@@ -9,6 +9,11 @@ import React, {
 } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { Button } from '@actual-app/components/button';
+import { Stack } from '@actual-app/components/stack';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
+
 import { pushModal } from 'loot-core/client/actions/modals';
 import { useSchedules } from 'loot-core/client/data-hooks/schedules';
 import { initiallyLoadPayees } from 'loot-core/client/queries/queriesSlice';
@@ -27,13 +32,9 @@ import { useSelected, SelectedProvider } from '../hooks/useSelected';
 import { useDispatch } from '../redux';
 import { theme } from '../style';
 
-import { Button } from './common/Button2';
 import { Link } from './common/Link';
 import { Search } from './common/Search';
 import { SimpleTable } from './common/SimpleTable';
-import { Stack } from './common/Stack';
-import { Text } from './common/Text';
-import { View } from './common/View';
 import { RulesHeader } from './rules/RulesHeader';
 import { RulesList } from './rules/RulesList';
 

packages/desktop-client/src/components/Notes.tsx

@@ -3,13 +3,13 @@ import React, { useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import ReactMarkdown from 'react-markdown';
 
+import { Text } from '@actual-app/components/text';
 import { css } from '@emotion/css';
 import remarkGfm from 'remark-gfm';
 
 import { type CSSProperties, theme } from '../style';
 import { remarkBreaks, sequentialNewlinesPlugin } from '../util/markdown';
 
-import { Text } from './common/Text';
 import { useResponsive } from './responsive/ResponsiveProvider';
 
 const remarkPlugins = [sequentialNewlinesPlugin, remarkGfm, remarkBreaks];

packages/desktop-client/src/components/NotesButton.tsx

@@ -7,16 +7,17 @@ import React, {
 } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { Button } from '@actual-app/components/button';
+import { Popover } from '@actual-app/components/popover';
+import { Tooltip } from '@actual-app/components/tooltip';
+import { View } from '@actual-app/components/view';
+
 import { send } from 'loot-core/platform/client/fetch';
 
 import { useNotes } from '../hooks/useNotes';
 import { SvgCustomNotesPaper } from '../icons/v2';
 import { theme } from '../style';
 
-import { Button } from './common/Button2';
-import { Popover } from './common/Popover';
-import { Tooltip } from './common/Tooltip';
-import { View } from './common/View';
 import { Notes } from './Notes';
 
 type NotesButtonProps = {

packages/desktop-client/src/components/Notifications.tsx

@@ -8,6 +8,11 @@ import React, {
 } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { Button, ButtonWithLoading } from '@actual-app/components/button';
+import { Stack } from '@actual-app/components/stack';
+import { styles } from '@actual-app/components/styles';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
 import { css } from '@emotion/css';
 
 import { removeNotification } from 'loot-core/client/actions';
@@ -16,13 +21,9 @@ import type { NotificationWithId } from 'loot-core/client/state-types/notificati
 import { AnimatedLoading } from '../icons/AnimatedLoading';
 import { SvgDelete } from '../icons/v0';
 import { useSelector, useDispatch } from '../redux';
-import { styles, theme } from '../style';
+import { theme } from '../style';
 
-import { Button, ButtonWithLoading } from './common/Button2';
 import { Link } from './common/Link';
-import { Stack } from './common/Stack';
-import { Text } from './common/Text';
-import { View } from './common/View';
 import { useResponsive } from './responsive/ResponsiveProvider';
 
 function compileMessage(

packages/desktop-client/src/components/Page.tsx

@@ -1,9 +1,11 @@
 import React, { type ReactNode, type CSSProperties } from 'react';
 
-import { theme, styles } from '../style';
+import { styles } from '@actual-app/components/styles';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
+
+import { theme } from '../style';
 
-import { Text } from './common/Text';
-import { View } from './common/View';
 import { useResponsive } from './responsive/ResponsiveProvider';
 
 const HEADER_HEIGHT = 50;

packages/desktop-client/src/components/PrivacyFilter.tsx

@@ -5,11 +5,11 @@ import React, {
   type ReactNode,
 } from 'react';
 
+import { View } from '@actual-app/components/view';
 import { css } from '@emotion/css';
 
 import { usePrivacyMode } from '../hooks/usePrivacyMode';
 
-import { View } from './common/View';
 import { useResponsive } from './responsive/ResponsiveProvider';
 
 type ConditionalPrivacyFilterProps = {

packages/desktop-client/src/components/ThemeSelector.tsx

@@ -1,14 +1,15 @@
 import React, { useRef, useState, type CSSProperties } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { Button } from '@actual-app/components/button';
+import { Menu } from '@actual-app/components/menu';
+import { Popover } from '@actual-app/components/popover';
+
 import type { Theme } from 'loot-core/types/prefs';
 
 import { SvgMoonStars, SvgSun, SvgSystem } from '../icons/v2';
 import { themeOptions, useTheme } from '../style';
 
-import { Button } from './common/Button2';
-import { Menu } from './common/Menu';
-import { Popover } from './common/Popover';
 import { useResponsive } from './responsive/ResponsiveProvider';
 
 type ThemeSelectorProps = {

packages/desktop-client/src/components/Titlebar.tsx

@@ -3,6 +3,11 @@ import { useHotkeys } from 'react-hotkeys-hook';
 import { useTranslation } from 'react-i18next';
 import { Routes, Route, useLocation } from 'react-router-dom';
 
+import { Button } from '@actual-app/components/button';
+import { SpaceBetween } from '@actual-app/components/space-between';
+import { styles } from '@actual-app/components/styles';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
 import { css } from '@emotion/css';
 
 import { sync } from 'loot-core/client/app/appSlice';
@@ -26,16 +31,12 @@ import {
   SvgViewShow,
 } from '../icons/v2';
 import { useDispatch } from '../redux';
-import { theme, styles, type CSSProperties } from '../style';
+import { theme, type CSSProperties } from '../style';
 
 import { AccountSyncCheck } from './accounts/AccountSyncCheck';
 import { AnimatedRefresh } from './AnimatedRefresh';
 import { MonthCountSelector } from './budget/MonthCountSelector';
-import { Button } from './common/Button2';
 import { Link } from './common/Link';
-import { SpaceBetween } from './common/SpaceBetween';
-import { Text } from './common/Text';
-import { View } from './common/View';
 import { HelpMenu } from './HelpMenu';
 import { LoggedInUser } from './LoggedInUser';
 import { useResponsive } from './responsive/ResponsiveProvider';

packages/desktop-client/src/components/UpdateNotification.tsx

@@ -1,16 +1,17 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { Button } from '@actual-app/components/button';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
+
 import { setAppState, updateApp } from 'loot-core/client/app/appSlice';
 
 import { SvgClose } from '../icons/v1';
 import { useSelector, useDispatch } from '../redux';
 import { theme } from '../style';
 
-import { Button } from './common/Button2';
 import { Link } from './common/Link';
-import { Text } from './common/Text';
-import { View } from './common/View';
 
 export function UpdateNotification() {
   const { t } = useTranslation();

packages/desktop-client/src/components/accounts/Account.tsx

@@ -9,6 +9,10 @@ import React, {
 import { Trans } from 'react-i18next';
 import { Navigate, useParams, useLocation } from 'react-router-dom';
 
+import { Button } from '@actual-app/components/button';
+import { styles } from '@actual-app/components/styles';
+import { Text } from '@actual-app/components/text';
+import { View } from '@actual-app/components/view';
 import { debounce } from 'debounce';
 import { t } from 'i18next';
 import { v4 as uuidv4 } from 'uuid';
@@ -83,10 +87,7 @@ import {
 import { useSyncedPref } from '../../hooks/useSyncedPref';
 import { useTransactionBatchActions } from '../../hooks/useTransactionBatchActions';
 import { useSelector, useDispatch } from '../../redux';
-import { styles, theme } from '../../style';
-import { Button } from '../common/Button2';
-import { Text } from '../common/Text';
-import { View } from '../common/View';
+import { theme } from '../../style';
 import { type SavedFilter } from '../filters/SavedFilterMenuButton';
 import { TransactionList } from '../transactions/TransactionList';
 import { validateAccountName } from '../util/accountValidation';