From f0048c741f758badb6ade1a917b78443708b3a0f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nicole=20Miko=C5=82ajczyk?= Date: Tue, 29 Apr 2025 16:51:25 +0200 Subject: [PATCH] pl-fe: start moving files around MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Nicole Mikołajczyk --- packages/pl-fe/src/actions/compose.ts | 2 +- .../src/features/admin/announcements.tsx | 4 +- packages/pl-fe/src/features/admin/domains.tsx | 4 +- packages/pl-fe/src/features/admin/index.tsx | 4 +- .../features/aliases/components/account.tsx | 56 ---------- .../features/aliases/components/search.tsx | 65 ----------- .../landing-timeline/components/logo-text.tsx | 17 --- .../components/site-banner.tsx | 32 ------ .../compose-interaction-policy-modal.tsx | 2 +- .../src/features/ui/util/async-components.ts | 34 +++--- .../about/index.tsx => pages/about.tsx} | 2 +- .../index.tsx => pages/settings/aliases.tsx} | 105 +++++++++++++++++- .../index.tsx => pages/settings/backups.tsx} | 4 +- .../settings/edit-email.tsx} | 4 +- .../settings/edit-password.tsx} | 4 +- .../settings/edit-profile.tsx} | 12 +- .../settings/interaction-policies.tsx} | 6 +- .../settings/migration.tsx} | 4 +- .../index.tsx => pages/settings/settings.tsx} | 9 +- .../status-lists/quotes.tsx} | 4 +- .../timelines/bubble-timeline.tsx} | 7 +- .../timelines/community-timeline.tsx} | 7 +- .../timelines/landing-timeline.tsx} | 47 +++++++- .../timelines/link-timeline.tsx} | 6 +- .../timelines/list-timeline.tsx} | 6 +- .../timelines/public-timeline.tsx} | 8 +- .../timelines/test-timeline.tsx} | 4 +- 27 files changed, 207 insertions(+), 252 deletions(-) delete mode 100644 packages/pl-fe/src/features/aliases/components/account.tsx delete mode 100644 packages/pl-fe/src/features/aliases/components/search.tsx delete mode 100644 packages/pl-fe/src/features/landing-timeline/components/logo-text.tsx delete mode 100644 packages/pl-fe/src/features/landing-timeline/components/site-banner.tsx rename packages/pl-fe/src/{features/about/index.tsx => pages/about.tsx} (97%) rename packages/pl-fe/src/{features/aliases/index.tsx => pages/settings/aliases.tsx} (53%) rename packages/pl-fe/src/{features/backups/index.tsx => pages/settings/backups.tsx} (98%) rename packages/pl-fe/src/{features/edit-email/index.tsx => pages/settings/edit-email.tsx} (97%) rename packages/pl-fe/src/{features/edit-password/index.tsx => pages/settings/edit-password.tsx} (98%) rename packages/pl-fe/src/{features/edit-profile/index.tsx => pages/settings/edit-profile.tsx} (98%) rename packages/pl-fe/src/{features/interaction-policies/index.tsx => pages/settings/interaction-policies.tsx} (98%) rename packages/pl-fe/src/{features/migration/index.tsx => pages/settings/migration.tsx} (98%) rename packages/pl-fe/src/{features/settings/index.tsx => pages/settings/settings.tsx} (97%) rename packages/pl-fe/src/{features/quotes/index.tsx => pages/status-lists/quotes.tsx} (96%) rename packages/pl-fe/src/{features/bubble-timeline/index.tsx => pages/timelines/bubble-timeline.tsx} (93%) rename packages/pl-fe/src/{features/community-timeline/index.tsx => pages/timelines/community-timeline.tsx} (93%) rename packages/pl-fe/src/{features/landing-timeline/index.tsx => pages/timelines/landing-timeline.tsx} (59%) rename packages/pl-fe/src/{features/link-timeline/index.tsx => pages/timelines/link-timeline.tsx} (91%) rename packages/pl-fe/src/{features/list-timeline/index.tsx => pages/timelines/list-timeline.tsx} (96%) rename packages/pl-fe/src/{features/public-timeline/index.tsx => pages/timelines/public-timeline.tsx} (94%) rename packages/pl-fe/src/{features/test-timeline/index.tsx => pages/timelines/test-timeline.tsx} (95%) diff --git a/packages/pl-fe/src/actions/compose.ts b/packages/pl-fe/src/actions/compose.ts index d1e8e415c..7d25bb59e 100644 --- a/packages/pl-fe/src/actions/compose.ts +++ b/packages/pl-fe/src/actions/compose.ts @@ -22,9 +22,9 @@ import type { EditorState } from 'lexical'; import type { Account as BaseAccount, CreateStatusParams, CustomEmoji, Group, MediaAttachment, Status as BaseStatus, Tag, Poll, ScheduledStatus, InteractionPolicy, UpdateMediaParams } from 'pl-api'; import type { AutoSuggestion } from 'pl-fe/components/autosuggest-input'; import type { Emoji } from 'pl-fe/features/emoji'; -import type { Policy, Rule, Scope } from 'pl-fe/features/interaction-policies'; import type { Account } from 'pl-fe/normalizers/account'; import type { Status } from 'pl-fe/normalizers/status'; +import type { Policy, Rule, Scope } from 'pl-fe/pages/settings/interaction-policies'; import type { ClearLinkSuggestion } from 'pl-fe/reducers/compose'; import type { AppDispatch, RootState } from 'pl-fe/store'; import type { History } from 'pl-fe/types/history'; diff --git a/packages/pl-fe/src/features/admin/announcements.tsx b/packages/pl-fe/src/features/admin/announcements.tsx index 3e59a5185..e214a3dfd 100644 --- a/packages/pl-fe/src/features/admin/announcements.tsx +++ b/packages/pl-fe/src/features/admin/announcements.tsx @@ -92,7 +92,7 @@ const Announcement: React.FC = ({ announcement }) => { ); }; -const Announcements: React.FC = () => { +const AdminAnnouncementsPage: React.FC = () => { const intl = useIntl(); const { openModal } = useModalsStore(); @@ -132,4 +132,4 @@ const Announcements: React.FC = () => { ); }; -export { Announcements as default }; +export { AdminAnnouncementsPage as default }; diff --git a/packages/pl-fe/src/features/admin/domains.tsx b/packages/pl-fe/src/features/admin/domains.tsx index 55518e4ab..12a142e10 100644 --- a/packages/pl-fe/src/features/admin/domains.tsx +++ b/packages/pl-fe/src/features/admin/domains.tsx @@ -102,7 +102,7 @@ const Domain: React.FC = ({ domain }) => { ); }; -const Domains: React.FC = () => { +const AdminDomainsPage: React.FC = () => { const intl = useIntl(); const { openModal } = useModalsStore(); @@ -148,4 +148,4 @@ const Domains: React.FC = () => { ); }; -export { Domains as default }; +export { AdminDomainsPage as default }; diff --git a/packages/pl-fe/src/features/admin/index.tsx b/packages/pl-fe/src/features/admin/index.tsx index fc15f54e6..baaae72cc 100644 --- a/packages/pl-fe/src/features/admin/index.tsx +++ b/packages/pl-fe/src/features/admin/index.tsx @@ -14,7 +14,7 @@ const messages = defineMessages({ heading: { id: 'column.admin.dashboard', defaultMessage: 'Dashboard' }, }); -const Admin: React.FC = () => { +const AdminPage: React.FC = () => { const intl = useIntl(); const { account } = useOwnAccount(); @@ -33,4 +33,4 @@ const Admin: React.FC = () => { ); }; -export { Admin as default }; +export { AdminPage as default }; diff --git a/packages/pl-fe/src/features/aliases/components/account.tsx b/packages/pl-fe/src/features/aliases/components/account.tsx deleted file mode 100644 index 0159aad82..000000000 --- a/packages/pl-fe/src/features/aliases/components/account.tsx +++ /dev/null @@ -1,56 +0,0 @@ -import React from 'react'; -import { defineMessages, useIntl } from 'react-intl'; - -import { addToAliases } from 'pl-fe/actions/aliases'; -import { useAccount } from 'pl-fe/api/hooks/accounts/use-account'; -import AccountComponent from 'pl-fe/components/account'; -import IconButton from 'pl-fe/components/icon-button'; -import HStack from 'pl-fe/components/ui/hstack'; -import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; -import { useFeatures } from 'pl-fe/hooks/use-features'; - -const messages = defineMessages({ - add: { id: 'aliases.account.add', defaultMessage: 'Create alias' }, -}); - -interface IAccount { - accountId: string; - aliases: string[]; -} - -const Account: React.FC = ({ accountId, aliases }) => { - const intl = useIntl(); - const dispatch = useAppDispatch(); - const features = useFeatures(); - - const me = useAppSelector((state) => state.me); - const { account } = useAccount(accountId); - - const apId = account?.ap_id; - const name = features.accountMoving ? account?.acct : apId; - const added = name ? aliases.includes(name) : false; - - const handleOnAdd = () => dispatch(addToAliases(account!)); - - if (!account) return null; - - let button; - - if (!added && accountId !== me) { - button = ( - - ); - } - - return ( - -
- -
- {button} - - ); -}; - -export { Account as default }; diff --git a/packages/pl-fe/src/features/aliases/components/search.tsx b/packages/pl-fe/src/features/aliases/components/search.tsx deleted file mode 100644 index f17f8ffff..000000000 --- a/packages/pl-fe/src/features/aliases/components/search.tsx +++ /dev/null @@ -1,65 +0,0 @@ -import clsx from 'clsx'; -import React from 'react'; -import { defineMessages, useIntl } from 'react-intl'; - -import { fetchAliasesSuggestions, clearAliasesSuggestions, changeAliasesSuggestions } from 'pl-fe/actions/aliases'; -import Icon from 'pl-fe/components/icon'; -import Button from 'pl-fe/components/ui/button'; -import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; -import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; - -const messages = defineMessages({ - search: { id: 'aliases.search', defaultMessage: 'Search your old account' }, - searchTitle: { id: 'tabs_bar.search', defaultMessage: 'Search' }, -}); - -const Search: React.FC = () => { - const dispatch = useAppDispatch(); - const intl = useIntl(); - - const value = useAppSelector(state => state.aliases.suggestions.value); - - const handleChange = (e: React.ChangeEvent) => { - dispatch(changeAliasesSuggestions(e.target.value)); - }; - - const handleKeyUp = (e: React.KeyboardEvent) => { - if (e.keyCode === 13) { - dispatch(fetchAliasesSuggestions(value)); - } - }; - - const handleSubmit = () => { - dispatch(fetchAliasesSuggestions(value)); - }; - - const handleClear = () => { - dispatch(clearAliasesSuggestions()); - }; - - const hasValue = value.length > 0; - - return ( -
- - -
- ); -}; - -export { Search as default }; diff --git a/packages/pl-fe/src/features/landing-timeline/components/logo-text.tsx b/packages/pl-fe/src/features/landing-timeline/components/logo-text.tsx deleted file mode 100644 index 57212ef89..000000000 --- a/packages/pl-fe/src/features/landing-timeline/components/logo-text.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react'; - -interface ILogoText extends Pick, 'dir'> { - children: React.ReactNode; -} - -/** Big text in site colors, for displaying the site name. Resizes itself according to the screen size. */ -const LogoText: React.FC = ({ children, dir }) => ( -

- {children} -

-); - -export { LogoText }; diff --git a/packages/pl-fe/src/features/landing-timeline/components/site-banner.tsx b/packages/pl-fe/src/features/landing-timeline/components/site-banner.tsx deleted file mode 100644 index a82bcc84e..000000000 --- a/packages/pl-fe/src/features/landing-timeline/components/site-banner.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; - -import Markup from 'pl-fe/components/markup'; -import { ParsedContent } from 'pl-fe/components/parsed-content'; -import Stack from 'pl-fe/components/ui/stack'; -import { useInstance } from 'pl-fe/hooks/use-instance'; -import { getTextDirection } from 'pl-fe/utils/rtl'; - -import { LogoText } from './logo-text'; - -const SiteBanner: React.FC = () => { - const instance = useInstance(); - - return ( - - - {instance.title} - - - {instance.description.trim().length > 0 && ( - - - - )} - - ); -}; - -export { SiteBanner }; diff --git a/packages/pl-fe/src/features/ui/components/modals/compose-interaction-policy-modal.tsx b/packages/pl-fe/src/features/ui/components/modals/compose-interaction-policy-modal.tsx index 451f5442c..02d626e1a 100644 --- a/packages/pl-fe/src/features/ui/components/modals/compose-interaction-policy-modal.tsx +++ b/packages/pl-fe/src/features/ui/components/modals/compose-interaction-policy-modal.tsx @@ -4,9 +4,9 @@ import { FormattedMessage } from 'react-intl'; import { changeComposeInteractionPolicyOption } from 'pl-fe/actions/compose'; import Modal from 'pl-fe/components/ui/modal'; import Stack from 'pl-fe/components/ui/stack'; -import { InteractionPolicyConfig, type Policy, type Rule, type Scope } from 'pl-fe/features/interaction-policies'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useCompose } from 'pl-fe/hooks/use-compose'; +import { InteractionPolicyConfig, type Policy, type Rule, type Scope } from 'pl-fe/pages/settings/interaction-policies'; import { useInteractionPolicies } from 'pl-fe/queries/settings/use-interaction-policies'; import type { BaseModalProps } from '../modal-root'; diff --git a/packages/pl-fe/src/features/ui/util/async-components.ts b/packages/pl-fe/src/features/ui/util/async-components.ts index 7db1d5312..b690db2da 100644 --- a/packages/pl-fe/src/features/ui/util/async-components.ts +++ b/packages/pl-fe/src/features/ui/util/async-components.ts @@ -1,21 +1,21 @@ import { lazy } from 'react'; // Pages -export const AboutPage = lazy(() => import('pl-fe/features/about')); +export const AboutPage = lazy(() => import('pl-fe/pages/about')); export const AccountGallery = lazy(() => import('pl-fe/features/account-gallery')); export const AccountTimeline = lazy(() => import('pl-fe/features/account-timeline')); -export const Aliases = lazy(() => import('pl-fe/features/aliases')); +export const Aliases = lazy(() => import('pl-fe/pages/settings/aliases')); export const Announcements = lazy(() => import('pl-fe/features/admin/announcements')); export const AuthTokenList = lazy(() => import('pl-fe/features/auth-token-list')); -export const Backups = lazy(() => import('pl-fe/features/backups')); +export const Backups = lazy(() => import('pl-fe/pages/settings/backups')); export const Blocks = lazy(() => import('pl-fe/features/blocks')); export const BookmarkFolders = lazy(() => import('pl-fe/features/bookmark-folders')); export const Bookmarks = lazy(() => import('pl-fe/features/bookmarks')); -export const BubbleTimeline = lazy(() => import('pl-fe/features/bubble-timeline')); +export const BubbleTimeline = lazy(() => import('pl-fe/pages/timelines/bubble-timeline')); export const ChatIndex = lazy(() => import('pl-fe/features/chats')); export const Circle = lazy(() => import('pl-fe/features/circle')); export const Circles = lazy(() => import('pl-fe/features/circles')); -export const CommunityTimeline = lazy(() => import('pl-fe/features/community-timeline')); +export const CommunityTimeline = lazy(() => import('pl-fe/pages/timelines/community-timeline')); export const ComposeEditor = lazy(() => import('pl-fe/features/compose/editor')); export const ComposeEvent = lazy(() => import('pl-fe/features/compose-event')); export const Conversations = lazy(() => import('pl-fe/features/conversations')); @@ -28,11 +28,11 @@ export const Directory = lazy(() => import('pl-fe/features/directory')); export const DomainBlocks = lazy(() => import('pl-fe/features/domain-blocks')); export const Domains = lazy(() => import('pl-fe/features/admin/domains')); export const DraftStatuses = lazy(() => import('pl-fe/features/draft-statuses')); -export const EditEmail = lazy(() => import('pl-fe/features/edit-email')); +export const EditEmail = lazy(() => import('pl-fe/pages/settings/edit-email')); export const EditFilter = lazy(() => import('pl-fe/features/filters/edit-filter')); export const EditGroup = lazy(() => import('pl-fe/features/group/edit-group')); -export const EditPassword = lazy(() => import('pl-fe/features/edit-password')); -export const EditProfile = lazy(() => import('pl-fe/features/edit-profile')); +export const EditPassword = lazy(() => import('pl-fe/pages/settings/edit-password')); +export const EditProfile = lazy(() => import('pl-fe/pages/settings/edit-profile')); export const EventDiscussion = lazy(() => import('pl-fe/features/event/event-discussion')); export const EventInformation = lazy(() => import('pl-fe/features/event/event-information')); export const Events = lazy(() => import('pl-fe/features/events')); @@ -57,17 +57,17 @@ export const HashtagTimeline = lazy(() => import('pl-fe/features/hashtag-timelin export const HomeTimeline = lazy(() => import('pl-fe/features/home-timeline')); export const ImportData = lazy(() => import('pl-fe/features/import-data')); export const IntentionalError = lazy(() => import('pl-fe/features/intentional-error')); -export const InteractionPolicies = lazy(() => import('pl-fe/features/interaction-policies')); +export const InteractionPolicies = lazy(() => import('pl-fe/pages/settings/interaction-policies')); export const InteractionRequests = lazy(() => import('pl-fe/features/interaction-requests')); -export const LandingTimeline = lazy(() => import('pl-fe/features/landing-timeline')); -export const LinkTimeline = lazy(() => import('pl-fe/features/link-timeline')); +export const LandingTimeline = lazy(() => import('pl-fe/pages/timelines/landing-timeline')); +export const LinkTimeline = lazy(() => import('pl-fe/pages/timelines/link-timeline')); export const Lists = lazy(() => import('pl-fe/features/lists')); -export const ListTimeline = lazy(() => import('pl-fe/features/list-timeline')); +export const ListTimeline = lazy(() => import('pl-fe/pages/timelines/list-timeline')); export const LoginPage = lazy(() => import('pl-fe/features/auth-login/components/login-page')); export const LogoutPage = lazy(() => import('pl-fe/features/auth-login/components/logout')); export const ManageGroup = lazy(() => import('pl-fe/features/group/manage-group')); export const MediaGallery = lazy(() => import('pl-fe/components/media-gallery')); -export const Migration = lazy(() => import('pl-fe/features/migration')); +export const Migration = lazy(() => import('pl-fe/pages/settings/migration')); export const ModerationLog = lazy(() => import('pl-fe/features/admin/moderation-log')); export const Mutes = lazy(() => import('pl-fe/features/mutes')); export const NewStatus = lazy(() => import('pl-fe/features/new-status')); @@ -76,8 +76,8 @@ export const OutgoingFollowRequests = lazy(() => import('pl-fe/features/follow-r export const PasswordReset = lazy(() => import('pl-fe/features/auth-login/components/password-reset')); export const PinnedStatuses = lazy(() => import('pl-fe/features/pinned-statuses')); export const PlFeConfig = lazy(() => import('pl-fe/features/pl-fe-config')); -export const PublicTimeline = lazy(() => import('pl-fe/features/public-timeline')); -export const Quotes = lazy(() => import('pl-fe/features/quotes')); +export const PublicTimeline = lazy(() => import('pl-fe/pages/timelines/public-timeline')); +export const Quotes = lazy(() => import('pl-fe/pages/status-lists/quotes')); export const RegisterInvite = lazy(() => import('pl-fe/features/register-invite')); export const RegistrationPage = lazy(() => import('pl-fe/features/auth-login/components/registration-page')); export const Relays = lazy(() => import('pl-fe/features/admin/relays')); @@ -87,11 +87,11 @@ export const ScheduledStatuses = lazy(() => import('pl-fe/features/scheduled-sta export const Search = lazy(() => import('pl-fe/features/search')); export const ServerInfo = lazy(() => import('pl-fe/features/server-info')); export const ServiceWorkerInfo = lazy(() => import('pl-fe/features/developers/service-worker-info')); -export const Settings = lazy(() => import('pl-fe/features/settings')); +export const Settings = lazy(() => import('pl-fe/pages/settings/settings')); export const SettingsStore = lazy(() => import('pl-fe/features/developers/settings-store')); export const Share = lazy(() => import('pl-fe/features/share')); export const Status = lazy(() => import('pl-fe/features/status')); -export const TestTimeline = lazy(() => import('pl-fe/features/test-timeline')); +export const TestTimeline = lazy(() => import('pl-fe/pages/timelines/test-timeline')); export const ThemeEditor = lazy(() => import('pl-fe/features/theme-editor')); export const UrlPrivacy = lazy(() => import('pl-fe/features/url-privacy')); export const UserIndex = lazy(() => import('pl-fe/features/admin/user-index')); diff --git a/packages/pl-fe/src/features/about/index.tsx b/packages/pl-fe/src/pages/about.tsx similarity index 97% rename from packages/pl-fe/src/features/about/index.tsx rename to packages/pl-fe/src/pages/about.tsx index d9fa728fd..5b0209afb 100644 --- a/packages/pl-fe/src/features/about/index.tsx +++ b/packages/pl-fe/src/pages/about.tsx @@ -8,7 +8,7 @@ import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config'; import { useSettings } from 'pl-fe/hooks/use-settings'; import { useAboutPage } from 'pl-fe/queries/pl-fe/use-about-page'; -import { languages } from '../preferences'; +import { languages } from '../features/preferences'; /** Displays arbitrary user-uploaded HTML on a page at `/about/:slug` */ const AboutPage: React.FC = () => { diff --git a/packages/pl-fe/src/features/aliases/index.tsx b/packages/pl-fe/src/pages/settings/aliases.tsx similarity index 53% rename from packages/pl-fe/src/features/aliases/index.tsx rename to packages/pl-fe/src/pages/settings/aliases.tsx index f62c3c4f9..a28173ac6 100644 --- a/packages/pl-fe/src/features/aliases/index.tsx +++ b/packages/pl-fe/src/pages/settings/aliases.tsx @@ -1,9 +1,14 @@ +import clsx from 'clsx'; import React, { useEffect } from 'react'; import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; -import { fetchAliases, removeFromAliases } from 'pl-fe/actions/aliases'; +import { addToAliases, changeAliasesSuggestions, clearAliasesSuggestions, fetchAliases, fetchAliasesSuggestions, removeFromAliases } from 'pl-fe/actions/aliases'; +import { useAccount } from 'pl-fe/api/hooks/accounts/use-account'; +import AccountComponent from 'pl-fe/components/account'; import Icon from 'pl-fe/components/icon'; +import IconButton from 'pl-fe/components/icon-button'; import ScrollableList from 'pl-fe/components/scrollable-list'; +import Button from 'pl-fe/components/ui/button'; import { CardHeader, CardTitle } from 'pl-fe/components/ui/card'; import Column from 'pl-fe/components/ui/column'; import HStack from 'pl-fe/components/ui/hstack'; @@ -13,9 +18,6 @@ import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; -import Account from './components/account'; -import Search from './components/search'; - const messages = defineMessages({ heading: { id: 'column.aliases', defaultMessage: 'Account aliases' }, subheading_add_new: { id: 'column.aliases.subheading_add_new', defaultMessage: 'Add New Alias' }, @@ -23,9 +25,100 @@ const messages = defineMessages({ delete_error: { id: 'column.aliases.delete_error', defaultMessage: 'Error deleting alias' }, subheading_aliases: { id: 'column.aliases.subheading_aliases', defaultMessage: 'Current aliases' }, delete: { id: 'column.aliases.delete', defaultMessage: 'Delete' }, + add: { id: 'aliases.account.add', defaultMessage: 'Create alias' }, + search: { id: 'aliases.search', defaultMessage: 'Search your old account' }, + searchTitle: { id: 'tabs_bar.search', defaultMessage: 'Search' }, }); -const Aliases = () => { +interface IAccount { + accountId: string; + aliases: string[]; +} + +const Account: React.FC = ({ accountId, aliases }) => { + const intl = useIntl(); + const dispatch = useAppDispatch(); + const features = useFeatures(); + + const me = useAppSelector((state) => state.me); + const { account } = useAccount(accountId); + + const apId = account?.ap_id; + const name = features.accountMoving ? account?.acct : apId; + const added = name ? aliases.includes(name) : false; + + const handleOnAdd = () => dispatch(addToAliases(account!)); + + if (!account) return null; + + let button; + + if (!added && accountId !== me) { + button = ( + + ); + } + + return ( + +
+ +
+ {button} + + ); +}; + +const Search: React.FC = () => { + const dispatch = useAppDispatch(); + const intl = useIntl(); + + const value = useAppSelector(state => state.aliases.suggestions.value); + + const handleChange = (e: React.ChangeEvent) => { + dispatch(changeAliasesSuggestions(e.target.value)); + }; + + const handleKeyUp = (e: React.KeyboardEvent) => { + if (e.keyCode === 13) { + dispatch(fetchAliasesSuggestions(value)); + } + }; + + const handleSubmit = () => { + dispatch(fetchAliasesSuggestions(value)); + }; + + const handleClear = () => { + dispatch(clearAliasesSuggestions()); + }; + + const hasValue = value.length > 0; + + return ( +
+ + +
+ ); +}; + +const AliasesPage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const features = useFeatures(); @@ -96,4 +189,4 @@ const Aliases = () => { ); }; -export { Aliases as default }; +export { AliasesPage as default }; diff --git a/packages/pl-fe/src/features/backups/index.tsx b/packages/pl-fe/src/pages/settings/backups.tsx similarity index 98% rename from packages/pl-fe/src/features/backups/index.tsx rename to packages/pl-fe/src/pages/settings/backups.tsx index 22af98463..db17b8816 100644 --- a/packages/pl-fe/src/features/backups/index.tsx +++ b/packages/pl-fe/src/pages/settings/backups.tsx @@ -59,7 +59,7 @@ const Backup: React.FC = ({ backup }) => { ); }; -const Backups = () => { +const BackupsPage = () => { const intl = useIntl(); const { data: backups = [], isLoading } = useBackups(); @@ -105,4 +105,4 @@ const Backups = () => { ); }; -export { Backups as default }; +export { BackupsPage as default }; diff --git a/packages/pl-fe/src/features/edit-email/index.tsx b/packages/pl-fe/src/pages/settings/edit-email.tsx similarity index 97% rename from packages/pl-fe/src/features/edit-email/index.tsx rename to packages/pl-fe/src/pages/settings/edit-email.tsx index fdab9d058..10d497d00 100644 --- a/packages/pl-fe/src/features/edit-email/index.tsx +++ b/packages/pl-fe/src/pages/settings/edit-email.tsx @@ -24,7 +24,7 @@ const messages = defineMessages({ const initialState = { email: '', password: '' }; -const EditEmail = () => { +const EditEmailPage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); @@ -84,4 +84,4 @@ const EditEmail = () => { ); }; -export { EditEmail as default }; +export { EditEmailPage as default }; diff --git a/packages/pl-fe/src/features/edit-password/index.tsx b/packages/pl-fe/src/pages/settings/edit-password.tsx similarity index 98% rename from packages/pl-fe/src/features/edit-password/index.tsx rename to packages/pl-fe/src/pages/settings/edit-password.tsx index 6589e4c96..9bb191961 100644 --- a/packages/pl-fe/src/features/edit-password/index.tsx +++ b/packages/pl-fe/src/pages/settings/edit-password.tsx @@ -25,7 +25,7 @@ const messages = defineMessages({ const initialState = { currentPassword: '', newPassword: '', newPasswordConfirmation: '' }; -const EditPassword = () => { +const EditPasswordPage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); @@ -102,4 +102,4 @@ const EditPassword = () => { ); }; -export { EditPassword as default }; +export { EditPasswordPage as default }; diff --git a/packages/pl-fe/src/features/edit-profile/index.tsx b/packages/pl-fe/src/pages/settings/edit-profile.tsx similarity index 98% rename from packages/pl-fe/src/features/edit-profile/index.tsx rename to packages/pl-fe/src/pages/settings/edit-profile.tsx index be9f95e34..d1476081a 100644 --- a/packages/pl-fe/src/features/edit-profile/index.tsx +++ b/packages/pl-fe/src/pages/settings/edit-profile.tsx @@ -18,6 +18,9 @@ import Input from 'pl-fe/components/ui/input'; import Streamfield from 'pl-fe/components/ui/streamfield'; import Textarea from 'pl-fe/components/ui/textarea'; import Toggle from 'pl-fe/components/ui/toggle'; +import AvatarPicker from 'pl-fe/features/edit-profile/components/avatar-picker'; +import HeaderPicker from 'pl-fe/features/edit-profile/components/header-picker'; +import { SelectDropdown } from 'pl-fe/features/forms'; import { useImageField } from 'pl-fe/hooks/forms/use-image-field'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; @@ -28,11 +31,6 @@ import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; import toast from 'pl-fe/toast'; import { isDefaultAvatar, isDefaultHeader } from 'pl-fe/utils/accounts'; -import { SelectDropdown } from '../forms'; - -import AvatarPicker from './components/avatar-picker'; -import HeaderPicker from './components/header-picker'; - import type { StreamfieldComponent } from 'pl-fe/components/ui/streamfield'; const nonDefaultAvatar = (url: string | undefined) => url && isDefaultAvatar(url) ? undefined : url; @@ -190,7 +188,7 @@ const ProfileField: StreamfieldComponent = ({ index, va }; /** Edit profile page. */ -const EditProfile: React.FC = () => { +const EditProfilePage: React.FC = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const instance = useInstance(); @@ -584,4 +582,4 @@ const EditProfile: React.FC = () => { ); }; -export { EditProfile as default }; +export { EditProfilePage as default }; diff --git a/packages/pl-fe/src/features/interaction-policies/index.tsx b/packages/pl-fe/src/pages/settings/interaction-policies.tsx similarity index 98% rename from packages/pl-fe/src/features/interaction-policies/index.tsx rename to packages/pl-fe/src/pages/settings/interaction-policies.tsx index d4dcec0e0..d699c3b99 100644 --- a/packages/pl-fe/src/features/interaction-policies/index.tsx +++ b/packages/pl-fe/src/pages/settings/interaction-policies.tsx @@ -13,7 +13,7 @@ import Text from 'pl-fe/components/ui/text'; import { useInteractionPolicies } from 'pl-fe/queries/settings/use-interaction-policies'; import toast from 'pl-fe/toast'; -import Warning from '../compose/components/warning'; +import Warning from '../../features/compose/components/warning'; import type { InteractionPolicy } from 'pl-api'; @@ -143,7 +143,7 @@ const InteractionPolicyConfig: React.FC = ({ interacti ); }; -const InteractionPolicies = () => { +const InteractionPoliciesPage = () => { const { interactionPolicies: initial, updateInteractionPolicies, isUpdating } = useInteractionPolicies(); const intl = useIntl(); const [interactionPolicies, setInteractionPolicies] = useState(initial); @@ -208,7 +208,7 @@ const InteractionPolicies = () => { }; export { - InteractionPolicies as default, + InteractionPoliciesPage as default, InteractionPolicyConfig, type Policy, type Rule, diff --git a/packages/pl-fe/src/features/migration/index.tsx b/packages/pl-fe/src/pages/settings/migration.tsx similarity index 98% rename from packages/pl-fe/src/features/migration/index.tsx rename to packages/pl-fe/src/pages/settings/migration.tsx index d1ca4df7f..eb9529385 100644 --- a/packages/pl-fe/src/features/migration/index.tsx +++ b/packages/pl-fe/src/pages/settings/migration.tsx @@ -25,7 +25,7 @@ const messages = defineMessages({ currentPasswordFieldLabel: { id: 'migration.fields.confirm_password.label', defaultMessage: 'Current password' }, }); -const Migration = () => { +const MigrationPage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const instance = useInstance(); @@ -130,4 +130,4 @@ const Migration = () => { ); }; -export { Migration as default }; +export { MigrationPage as default }; diff --git a/packages/pl-fe/src/features/settings/index.tsx b/packages/pl-fe/src/pages/settings/settings.tsx similarity index 97% rename from packages/pl-fe/src/features/settings/index.tsx rename to packages/pl-fe/src/pages/settings/settings.tsx index 6abfbfc60..4b44eb74f 100644 --- a/packages/pl-fe/src/features/settings/index.tsx +++ b/packages/pl-fe/src/pages/settings/settings.tsx @@ -6,14 +6,13 @@ import List, { ListItem } from 'pl-fe/components/list'; import Card, { CardBody, CardHeader, CardTitle } from 'pl-fe/components/ui/card'; import Column from 'pl-fe/components/ui/column'; import Text from 'pl-fe/components/ui/text'; +import Preferences from 'pl-fe/features/preferences'; +import MessagesSettings from 'pl-fe/features/settings/components/messages-settings'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useAppSelector } from 'pl-fe/hooks/use-app-selector'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useOwnAccount } from 'pl-fe/hooks/use-own-account'; -import Preferences from '../preferences'; - -import MessagesSettings from './components/messages-settings'; const messages = defineMessages({ accountAliases: { id: 'navigation_bar.account_aliases', defaultMessage: 'Account aliases' }, @@ -45,7 +44,7 @@ const messages = defineMessages({ }); /** User settings page. */ -const Settings = () => { +const SettingsPage = () => { const dispatch = useAppDispatch(); const intl = useIntl(); @@ -172,4 +171,4 @@ const Settings = () => { ); }; -export { Settings as default }; +export { SettingsPage as default }; diff --git a/packages/pl-fe/src/features/quotes/index.tsx b/packages/pl-fe/src/pages/status-lists/quotes.tsx similarity index 96% rename from packages/pl-fe/src/features/quotes/index.tsx rename to packages/pl-fe/src/pages/status-lists/quotes.tsx index f3bfbd98f..c0086647b 100644 --- a/packages/pl-fe/src/features/quotes/index.tsx +++ b/packages/pl-fe/src/pages/status-lists/quotes.tsx @@ -13,7 +13,7 @@ const messages = defineMessages({ heading: { id: 'column.quotes', defaultMessage: 'Post quotes' }, }); -const Quotes: React.FC = () => { +const QuotesPage: React.FC = () => { const intl = useIntl(); const { statusId } = useParams<{ statusId: string }>(); const theme = useTheme(); @@ -50,4 +50,4 @@ const Quotes: React.FC = () => { ); }; -export { Quotes as default }; +export { QuotesPage as default }; diff --git a/packages/pl-fe/src/features/bubble-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/bubble-timeline.tsx similarity index 93% rename from packages/pl-fe/src/features/bubble-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/bubble-timeline.tsx index c927e3b8b..ee2b8a7fe 100644 --- a/packages/pl-fe/src/features/bubble-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/bubble-timeline.tsx @@ -5,19 +5,18 @@ import { fetchBubbleTimeline } from 'pl-fe/actions/timelines'; import { useBubbleStream } from 'pl-fe/api/hooks/streaming/use-bubble-stream'; import PullToRefresh from 'pl-fe/components/pull-to-refresh'; import Column from 'pl-fe/components/ui/column'; +import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useFeatures } from 'pl-fe/hooks/use-features'; import { useIsMobile } from 'pl-fe/hooks/use-is-mobile'; import { useSettings } from 'pl-fe/hooks/use-settings'; import { useTheme } from 'pl-fe/hooks/use-theme'; -import Timeline from '../ui/components/timeline'; - const messages = defineMessages({ title: { id: 'column.bubble', defaultMessage: 'Bubble timeline' }, }); -const BubbleTimeline = () => { +const BubbleTimelinePage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const theme = useTheme(); @@ -59,4 +58,4 @@ const BubbleTimeline = () => { ); }; -export { BubbleTimeline as default }; +export { BubbleTimelinePage as default }; diff --git a/packages/pl-fe/src/features/community-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/community-timeline.tsx similarity index 93% rename from packages/pl-fe/src/features/community-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/community-timeline.tsx index e6f0bdceb..1fc546dfd 100644 --- a/packages/pl-fe/src/features/community-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/community-timeline.tsx @@ -5,18 +5,17 @@ import { fetchPublicTimeline } from 'pl-fe/actions/timelines'; import { useCommunityStream } from 'pl-fe/api/hooks/streaming/use-community-stream'; import PullToRefresh from 'pl-fe/components/pull-to-refresh'; import Column from 'pl-fe/components/ui/column'; +import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useIsMobile } from 'pl-fe/hooks/use-is-mobile'; import { useSettings } from 'pl-fe/hooks/use-settings'; import { useTheme } from 'pl-fe/hooks/use-theme'; -import Timeline from '../ui/components/timeline'; - const messages = defineMessages({ title: { id: 'column.community', defaultMessage: 'Local timeline' }, }); -const CommunityTimeline = () => { +const CommunityTimelinePage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const theme = useTheme(); @@ -57,4 +56,4 @@ const CommunityTimeline = () => { ); }; -export { CommunityTimeline as default }; +export { CommunityTimelinePage as default }; diff --git a/packages/pl-fe/src/features/landing-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/landing-timeline.tsx similarity index 59% rename from packages/pl-fe/src/features/landing-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/landing-timeline.tsx index d79793e89..15f13f3b0 100644 --- a/packages/pl-fe/src/features/landing-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/landing-timeline.tsx @@ -3,19 +3,56 @@ import { FormattedMessage } from 'react-intl'; import { fetchPublicTimeline } from 'pl-fe/actions/timelines'; import { useCommunityStream } from 'pl-fe/api/hooks/streaming/use-community-stream'; +import Markup from 'pl-fe/components/markup'; +import { ParsedContent } from 'pl-fe/components/parsed-content'; import PullToRefresh from 'pl-fe/components/pull-to-refresh'; import Column from 'pl-fe/components/ui/column'; +import Stack from 'pl-fe/components/ui/stack'; +import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useInstance } from 'pl-fe/hooks/use-instance'; import { useIsMobile } from 'pl-fe/hooks/use-is-mobile'; import { useTheme } from 'pl-fe/hooks/use-theme'; +import AboutPage from 'pl-fe/pages/about'; +import { getTextDirection } from 'pl-fe/utils/rtl'; -import AboutPage from '../about'; -import Timeline from '../ui/components/timeline'; -import { SiteBanner } from './components/site-banner'; +interface ILogoText extends Pick, 'dir'> { + children: React.ReactNode; +} -const LandingTimeline = () => { +/** Big text in site colors, for displaying the site name. Resizes itself according to the screen size. */ +const LogoText: React.FC = ({ children, dir }) => ( +

+ {children} +

+); + +const SiteBanner: React.FC = () => { + const instance = useInstance(); + + return ( + + + {instance.title} + + + {instance.description.trim().length > 0 && ( + + + + )} + + ); +}; + +const LandingTimelinePage = () => { const dispatch = useAppDispatch(); const instance = useInstance(); const theme = useTheme(); @@ -65,4 +102,4 @@ const LandingTimeline = () => { ); }; -export { LandingTimeline as default }; +export { LandingTimelinePage as default }; diff --git a/packages/pl-fe/src/features/link-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/link-timeline.tsx similarity index 91% rename from packages/pl-fe/src/features/link-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/link-timeline.tsx index fbc45b5a7..3bd6c69c0 100644 --- a/packages/pl-fe/src/features/link-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/link-timeline.tsx @@ -12,13 +12,13 @@ const messages = defineMessages({ header: { id: 'column.link_timeline', defaultMessage: 'Posts linking to {url}' }, }); -interface ILinkTimeline { +interface ILinkTimelinePage { params?: { url?: string; }; } -const HashtagTimeline: React.FC = ({ params }) => { +const LinkTimelinePage: React.FC = ({ params }) => { const url = decodeURIComponent(params?.url || ''); const intl = useIntl(); @@ -53,4 +53,4 @@ const HashtagTimeline: React.FC = ({ params }) => { ); }; -export { HashtagTimeline as default }; +export { LinkTimelinePage as default }; diff --git a/packages/pl-fe/src/features/list-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/list-timeline.tsx similarity index 96% rename from packages/pl-fe/src/features/list-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/list-timeline.tsx index eddea4fea..3fe4e4715 100644 --- a/packages/pl-fe/src/features/list-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/list-timeline.tsx @@ -15,7 +15,7 @@ import { useTheme } from 'pl-fe/hooks/use-theme'; import { useDeleteList, useList } from 'pl-fe/queries/accounts/use-lists'; import { useModalsStore } from 'pl-fe/stores/modals'; -import Timeline from '../ui/components/timeline'; +import Timeline from '../../features/ui/components/timeline'; const messages = defineMessages({ deleteHeading: { id: 'confirmations.delete_list.heading', defaultMessage: 'Delete list' }, @@ -25,7 +25,7 @@ const messages = defineMessages({ deleteList: { id: 'lists.delete', defaultMessage: 'Delete list' }, }); -const ListTimeline: React.FC = () => { +const ListTimelinePage: React.FC = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const { id } = useParams<{ id: string }>(); @@ -119,4 +119,4 @@ const ListTimeline: React.FC = () => { ); }; -export { ListTimeline as default }; +export { ListTimelinePage as default }; diff --git a/packages/pl-fe/src/features/public-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/public-timeline.tsx similarity index 94% rename from packages/pl-fe/src/features/public-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/public-timeline.tsx index 9f64cbebd..6bab9a0f7 100644 --- a/packages/pl-fe/src/features/public-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/public-timeline.tsx @@ -8,21 +8,21 @@ import { usePublicStream } from 'pl-fe/api/hooks/streaming/use-public-stream'; import PullToRefresh from 'pl-fe/components/pull-to-refresh'; import Accordion from 'pl-fe/components/ui/accordion'; import Column from 'pl-fe/components/ui/column'; +import PinnedHostsPicker from 'pl-fe/features/remote-timeline/components/pinned-hosts-picker'; +import Timeline from 'pl-fe/features/ui/components/timeline'; import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch'; import { useInstance } from 'pl-fe/hooks/use-instance'; import { useIsMobile } from 'pl-fe/hooks/use-is-mobile'; import { useSettings } from 'pl-fe/hooks/use-settings'; import { useTheme } from 'pl-fe/hooks/use-theme'; -import PinnedHostsPicker from '../remote-timeline/components/pinned-hosts-picker'; -import Timeline from '../ui/components/timeline'; const messages = defineMessages({ title: { id: 'column.public', defaultMessage: 'Fediverse timeline' }, dismiss: { id: 'fediverse_tab.explanation_box.dismiss', defaultMessage: 'Don\'t show again' }, }); -const CommunityTimeline = () => { +const PublicTimelinePage = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const theme = useTheme(); @@ -104,4 +104,4 @@ const CommunityTimeline = () => { ); }; -export { CommunityTimeline as default }; +export { PublicTimelinePage as default }; diff --git a/packages/pl-fe/src/features/test-timeline/index.tsx b/packages/pl-fe/src/pages/timelines/test-timeline.tsx similarity index 95% rename from packages/pl-fe/src/features/test-timeline/index.tsx rename to packages/pl-fe/src/pages/timelines/test-timeline.tsx index 7cbcb354a..b223e65ad 100644 --- a/packages/pl-fe/src/features/test-timeline/index.tsx +++ b/packages/pl-fe/src/pages/timelines/test-timeline.tsx @@ -28,7 +28,7 @@ const MOCK_STATUSES: any[] = [ const timelineId = 'test'; const onlyMedia = false; -const TestTimeline: React.FC = () => { +const TestTimelinePage: React.FC = () => { const intl = useIntl(); const dispatch = useAppDispatch(); const theme = useTheme(); @@ -51,4 +51,4 @@ const TestTimeline: React.FC = () => { ); }; -export { TestTimeline as default }; +export { TestTimelinePage as default };