From 47492bac9aed9c68178aac5df153ded606eae1b8 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 25 Mar 2024 11:19:23 -0500 Subject: [PATCH 01/24] EditProfile: use instance.domain in nip05 placeholder --- src/features/edit-profile/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/features/edit-profile/index.tsx b/src/features/edit-profile/index.tsx index 03fe961aa..a01fbe816 100644 --- a/src/features/edit-profile/index.tsx +++ b/src/features/edit-profile/index.tsx @@ -325,7 +325,7 @@ const EditProfile: React.FC = () => { type='text' value={data.nip05} onChange={handleTextChange('nip05')} - placeholder={intl.formatMessage(messages.nip05Placeholder, { domain: location.host })} + placeholder={intl.formatMessage(messages.nip05Placeholder, { domain: instance.domain })} /> )} From bd552ab084f2c42f02072691fb16016797ffa7a5 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 25 Mar 2024 11:20:02 -0500 Subject: [PATCH 02/24] Add EditIdentity page (wip) --- src/features/edit-identity/index.tsx | 64 ++++++++++++++++++++++++ src/features/settings/index.tsx | 4 ++ src/features/ui/index.tsx | 2 + src/features/ui/util/async-components.ts | 1 + 4 files changed, 71 insertions(+) create mode 100644 src/features/edit-identity/index.tsx diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx new file mode 100644 index 000000000..2a8854fc8 --- /dev/null +++ b/src/features/edit-identity/index.tsx @@ -0,0 +1,64 @@ +import React from 'react'; +import { defineMessages, useIntl } from 'react-intl'; + +import List, { ListItem } from 'soapbox/components/list'; +import { Button, Column, HStack, Icon, Input } from 'soapbox/components/ui'; +import { useInstance, useOwnAccount } from 'soapbox/hooks'; + +interface IEditIdentity { +} + +const messages = defineMessages({ + title: { id: 'settings.edit_identity', defaultMessage: 'Identity' }, +}); + +const identifiers = [ + 'alex@alexgleason.me', + 'lunk@alexgleason.me', + 'yolo@alexgleason.me', +]; + +/** EditIdentity component. */ +const EditIdentity: React.FC = () => { + const intl = useIntl(); + const { account } = useOwnAccount(); + + if (!account) return null; + + return ( + + + {identifiers.map((identifier) => ( + { /* TODO */ }} + /> + ))} + }> + + + + + ); +}; + +const UsernameInput: React.FC> = (props) => { + const instance = useInstance(); + + return ( + + + {instance.domain} + + )} + {...props} + /> + ); +}; + +export default EditIdentity; \ No newline at end of file diff --git a/src/features/settings/index.tsx b/src/features/settings/index.tsx index 434445c4e..b426a0f96 100644 --- a/src/features/settings/index.tsx +++ b/src/features/settings/index.tsx @@ -20,6 +20,7 @@ const messages = defineMessages({ configureMfa: { id: 'settings.configure_mfa', defaultMessage: 'Configure MFA' }, deleteAccount: { id: 'settings.delete_account', defaultMessage: 'Delete Account' }, editProfile: { id: 'settings.edit_profile', defaultMessage: 'Edit Profile' }, + editIdentity: { id: 'settings.edit_identity', defaultMessage: 'Identity' }, exportData: { id: 'column.export_data', defaultMessage: 'Export data' }, importData: { id: 'navigation_bar.import_data', defaultMessage: 'Import data' }, mfaDisabled: { id: 'mfa.disabled', defaultMessage: 'Disabled' }, @@ -65,6 +66,9 @@ const Settings = () => { {displayName} + + {account?.source?.nostr?.nip05} + diff --git a/src/features/ui/index.tsx b/src/features/ui/index.tsx index 4d7fdf793..8cae1fce5 100644 --- a/src/features/ui/index.tsx +++ b/src/features/ui/index.tsx @@ -137,6 +137,7 @@ import { ExternalLogin, LandingTimeline, BookmarkFolders, + EditIdentity, } from './util/async-components'; import GlobalHotkeys from './util/global-hotkeys'; import { WrappedRoute } from './util/react-router-helpers'; @@ -305,6 +306,7 @@ const SwitchingColumnsArea: React.FC = ({ children }) => {features.scheduledStatuses && } + {features.exportData && } {features.importData && } {features.accountAliases && } diff --git a/src/features/ui/util/async-components.ts b/src/features/ui/util/async-components.ts index 4660eb047..e5de03050 100644 --- a/src/features/ui/util/async-components.ts +++ b/src/features/ui/util/async-components.ts @@ -167,3 +167,4 @@ export const NostrLoginModal = lazy(() => import('soapbox/features/ui/components export const BookmarkFolders = lazy(() => import('soapbox/features/bookmark-folders')); export const EditBookmarkFolderModal = lazy(() => import('soapbox/features/ui/components/modals/edit-bookmark-folder-modal')); export const SelectBookmarkFolderModal = lazy(() => import('soapbox/features/ui/components/modals/select-bookmark-folder-modal')); +export const EditIdentity = lazy(() => import('soapbox/features/edit-identity')); \ No newline at end of file From fb3af2f74b40e2780e2667e058444097289b593f Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 25 Mar 2024 11:57:27 -0500 Subject: [PATCH 03/24] UsernameInput: reuse i18n message from nip05 profile field --- src/features/edit-identity/index.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx index 2a8854fc8..0b26631d2 100644 --- a/src/features/edit-identity/index.tsx +++ b/src/features/edit-identity/index.tsx @@ -10,6 +10,7 @@ interface IEditIdentity { const messages = defineMessages({ title: { id: 'settings.edit_identity', defaultMessage: 'Identity' }, + username: { id: 'edit_profile.fields.nip05_label', defaultMessage: 'Username' }, }); const identifiers = [ @@ -36,7 +37,7 @@ const EditIdentity: React.FC = () => { onSelect={() => { /* TODO */ }} /> ))} - }> + }> @@ -45,11 +46,12 @@ const EditIdentity: React.FC = () => { }; const UsernameInput: React.FC> = (props) => { + const intl = useIntl(); const instance = useInstance(); return ( From 51978c83f089813f45f5a9a48f9e547a862fd5b1 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 25 Mar 2024 12:43:36 -0500 Subject: [PATCH 04/24] EditIdentity: save nip05 to profile --- src/features/edit-identity/index.tsx | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx index 0b26631d2..8efcdd1fd 100644 --- a/src/features/edit-identity/index.tsx +++ b/src/features/edit-identity/index.tsx @@ -1,9 +1,11 @@ import React from 'react'; import { defineMessages, useIntl } from 'react-intl'; +import { patchMe } from 'soapbox/actions/me'; import List, { ListItem } from 'soapbox/components/list'; import { Button, Column, HStack, Icon, Input } from 'soapbox/components/ui'; -import { useInstance, useOwnAccount } from 'soapbox/hooks'; +import { useAppDispatch, useInstance, useOwnAccount } from 'soapbox/hooks'; +import toast from 'soapbox/toast'; interface IEditIdentity { } @@ -11,6 +13,8 @@ interface IEditIdentity { const messages = defineMessages({ title: { id: 'settings.edit_identity', defaultMessage: 'Identity' }, username: { id: 'edit_profile.fields.nip05_label', defaultMessage: 'Username' }, + success: { id: 'edit_profile.success', defaultMessage: 'Your profile has been successfully saved!' }, + error: { id: 'edit_profile.error', defaultMessage: 'Profile update failed' }, }); const identifiers = [ @@ -22,10 +26,20 @@ const identifiers = [ /** EditIdentity component. */ const EditIdentity: React.FC = () => { const intl = useIntl(); + const dispatch = useAppDispatch(); const { account } = useOwnAccount(); if (!account) return null; + const updateNip05 = async (nip05: string): Promise => { + try { + await dispatch(patchMe({ nip05 })); + toast.success(intl.formatMessage(messages.success)); + } catch (e) { + toast.error(intl.formatMessage(messages.error)); + } + }; + return ( @@ -33,8 +47,8 @@ const EditIdentity: React.FC = () => { { /* TODO */ }} + isSelected={account.source?.nostr?.nip05 === identifier} + onSelect={() => updateNip05(identifier)} /> ))} }> From 4370a772a6ee0f92eab916681f7b0987be6d2247 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 25 Mar 2024 13:10:48 -0500 Subject: [PATCH 05/24] EditIdentity: add exclamation emoji for unverified name --- src/features/edit-identity/index.tsx | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx index 8efcdd1fd..8263e0ca9 100644 --- a/src/features/edit-identity/index.tsx +++ b/src/features/edit-identity/index.tsx @@ -3,7 +3,7 @@ import { defineMessages, useIntl } from 'react-intl'; import { patchMe } from 'soapbox/actions/me'; import List, { ListItem } from 'soapbox/components/list'; -import { Button, Column, HStack, Icon, Input } from 'soapbox/components/ui'; +import { Button, Column, Emoji, HStack, Icon, Input, Tooltip } from 'soapbox/components/ui'; import { useAppDispatch, useInstance, useOwnAccount } from 'soapbox/hooks'; import toast from 'soapbox/toast'; @@ -13,6 +13,7 @@ interface IEditIdentity { const messages = defineMessages({ title: { id: 'settings.edit_identity', defaultMessage: 'Identity' }, username: { id: 'edit_profile.fields.nip05_label', defaultMessage: 'Username' }, + unverified: { id: 'edit_profile.fields.nip05_unverified', defaultMessage: 'Name could not be verified and won\'t be used.' }, success: { id: 'edit_profile.success', defaultMessage: 'Your profile has been successfully saved!' }, error: { id: 'edit_profile.error', defaultMessage: 'Profile update failed' }, }); @@ -32,6 +33,7 @@ const EditIdentity: React.FC = () => { if (!account) return null; const updateNip05 = async (nip05: string): Promise => { + if (account.source?.nostr?.nip05 === nip05) return; try { await dispatch(patchMe({ nip05 })); toast.success(intl.formatMessage(messages.success)); @@ -46,7 +48,18 @@ const EditIdentity: React.FC = () => { {identifiers.map((identifier) => ( + {identifier} + {(account.source?.nostr?.nip05 === identifier && account.acct !== identifier) && ( + +
+ +
+ + )} + + } isSelected={account.source?.nostr?.nip05 === identifier} onSelect={() => updateNip05(identifier)} /> From c02f23c322c1dafd0ecc34d226a59f6b2d9622fc Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Wed, 27 Mar 2024 09:52:07 -0500 Subject: [PATCH 06/24] EditIdentity: pull identifiers from Nostr --- src/features/edit-identity/index.tsx | 84 ++++++++++++++++++---------- 1 file changed, 56 insertions(+), 28 deletions(-) diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx index 8263e0ca9..8cd48db22 100644 --- a/src/features/edit-identity/index.tsx +++ b/src/features/edit-identity/index.tsx @@ -1,9 +1,11 @@ -import React from 'react'; +import React, { useState } from 'react'; import { defineMessages, useIntl } from 'react-intl'; import { patchMe } from 'soapbox/actions/me'; import List, { ListItem } from 'soapbox/components/list'; import { Button, Column, Emoji, HStack, Icon, Input, Tooltip } from 'soapbox/components/ui'; +import { useNostr } from 'soapbox/contexts/nostr-context'; +import { useNostrReq } from 'soapbox/features/nostr/hooks/useNostrReq'; import { useAppDispatch, useInstance, useOwnAccount } from 'soapbox/hooks'; import toast from 'soapbox/toast'; @@ -18,17 +20,22 @@ const messages = defineMessages({ error: { id: 'edit_profile.error', defaultMessage: 'Profile update failed' }, }); -const identifiers = [ - 'alex@alexgleason.me', - 'lunk@alexgleason.me', - 'yolo@alexgleason.me', -]; - /** EditIdentity component. */ const EditIdentity: React.FC = () => { const intl = useIntl(); + const instance = useInstance(); const dispatch = useAppDispatch(); const { account } = useOwnAccount(); + const { relay, signer } = useNostr(); + + const admin = instance.nostr?.pubkey; + const [username, setUsername] = useState(''); + + const { events: labels } = useNostrReq( + admin + ? [{ kinds: [1985], authors: [admin], '#L': ['nip05'] }] + : [], + ); if (!account) return null; @@ -42,30 +49,51 @@ const EditIdentity: React.FC = () => { } }; + const submit = async () => { + if (!admin || !signer || !relay) return; + + const event = await signer.signEvent({ + kind: 5950, + content: '', + tags: [ + ['i', `${username}@${instance.domain}`, 'text'], + ['p', admin], + ], + created_at: Math.floor(Date.now() / 1000), + }); + + await relay.event(event); + }; + return ( - {identifiers.map((identifier) => ( - - {identifier} - {(account.source?.nostr?.nip05 === identifier && account.acct !== identifier) && ( - -
- -
- - )} - - } - isSelected={account.source?.nostr?.nip05 === identifier} - onSelect={() => updateNip05(identifier)} - /> - ))} - }> - + {labels.map((label) => { + const identifier = label.tags.find(([name]) => name === 'l')?.[1]; + if (!identifier) return null; + + return ( + + {identifier} + {(account.source?.nostr?.nip05 === identifier && account.acct !== identifier) && ( + +
+ +
+ + )} + + } + isSelected={account.source?.nostr?.nip05 === identifier} + onSelect={() => updateNip05(identifier)} + /> + ); + })} + setUsername(e.target.value)} />}> + From 37816b0a8c8d57c09b8b6761378e4568ee8dfe28 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Wed, 27 Mar 2024 09:53:45 -0500 Subject: [PATCH 07/24] EditIdentity: only pull current user's pubkey --- src/features/edit-identity/index.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx index 8cd48db22..c5dc68ab3 100644 --- a/src/features/edit-identity/index.tsx +++ b/src/features/edit-identity/index.tsx @@ -29,11 +29,12 @@ const EditIdentity: React.FC = () => { const { relay, signer } = useNostr(); const admin = instance.nostr?.pubkey; + const pubkey = account?.nostr?.pubkey; const [username, setUsername] = useState(''); const { events: labels } = useNostrReq( - admin - ? [{ kinds: [1985], authors: [admin], '#L': ['nip05'] }] + (admin && pubkey) + ? [{ kinds: [1985], authors: [admin], '#L': ['nip05'], '#p': [pubkey] }] : [], ); From bd46f1230b7c813efebc64e6c3685b0e19240c82 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Wed, 27 Mar 2024 15:19:00 -0500 Subject: [PATCH 08/24] useNostrReq: deduplicate events with NSet --- src/features/nostr/hooks/useNostrReq.ts | 12 ++++++++---- src/hooks/useForceUpdate.ts | 11 +++++++++++ 2 files changed, 19 insertions(+), 4 deletions(-) create mode 100644 src/hooks/useForceUpdate.ts diff --git a/src/features/nostr/hooks/useNostrReq.ts b/src/features/nostr/hooks/useNostrReq.ts index 654c814f3..72e1187ac 100644 --- a/src/features/nostr/hooks/useNostrReq.ts +++ b/src/features/nostr/hooks/useNostrReq.ts @@ -1,14 +1,17 @@ -import { NostrEvent, NostrFilter } from '@soapbox/nspec'; +import { NSet, NostrEvent, NostrFilter } from '@soapbox/nspec'; import isEqual from 'lodash/isEqual'; import { useEffect, useRef, useState } from 'react'; import { useNostr } from 'soapbox/contexts/nostr-context'; +import { useForceUpdate } from 'soapbox/hooks/useForceUpdate'; /** Streams events from the relay for the given filters. */ export function useNostrReq(filters: NostrFilter[]): { events: NostrEvent[]; eose: boolean; closed: boolean } { const { relay } = useNostr(); - const [events, setEvents] = useState([]); + const nset = useRef(new NSet()); + const forceUpdate = useForceUpdate(); + const [closed, setClosed] = useState(false); const [eose, setEose] = useState(false); @@ -21,7 +24,8 @@ export function useNostrReq(filters: NostrFilter[]): { events: NostrEvent[]; eos (async () => { for await (const msg of relay.req(value, { signal })) { if (msg[0] === 'EVENT') { - setEvents((prev) => [msg[2], ...prev]); + nset.current.add(msg[2]); + forceUpdate(); } else if (msg[0] === 'EOSE') { setEose(true); } else if (msg[0] === 'CLOSED') { @@ -41,7 +45,7 @@ export function useNostrReq(filters: NostrFilter[]): { events: NostrEvent[]; eos }, [relay, value]); return { - events, + events: [...nset.current], eose, closed, }; diff --git a/src/hooks/useForceUpdate.ts b/src/hooks/useForceUpdate.ts new file mode 100644 index 000000000..50a84a468 --- /dev/null +++ b/src/hooks/useForceUpdate.ts @@ -0,0 +1,11 @@ +import { useState, useCallback } from 'react'; + +export function useForceUpdate(): () => void { + const [, setState] = useState(false); + + const forceUpdate = useCallback(() => { + setState(prevState => !prevState); + }, []); + + return forceUpdate; +} From aea4c216896feefed85a8b7f4e33e84d97926ece Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Wed, 27 Mar 2024 17:52:34 -0500 Subject: [PATCH 09/24] Feature-gate EditIdentity screen --- src/features/settings/index.tsx | 8 +++++--- src/features/ui/index.tsx | 2 +- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/features/settings/index.tsx b/src/features/settings/index.tsx index b426a0f96..f04f311a8 100644 --- a/src/features/settings/index.tsx +++ b/src/features/settings/index.tsx @@ -66,9 +66,11 @@ const Settings = () => { {displayName} - - {account?.source?.nostr?.nip05} - + {features.nip05 && ( + + {account?.source?.nostr?.nip05} + + )} diff --git a/src/features/ui/index.tsx b/src/features/ui/index.tsx index 527b3d915..b206a647b 100644 --- a/src/features/ui/index.tsx +++ b/src/features/ui/index.tsx @@ -307,7 +307,7 @@ const SwitchingColumnsArea: React.FC = ({ children }) => {features.scheduledStatuses && } - + {features.nip05 && } {features.exportData && } {features.importData && } {features.accountAliases && } From 06beaa54de9d1a3dc68c6c2d9307f9340928088b Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Thu, 28 Mar 2024 13:48:38 -0500 Subject: [PATCH 10/24] yarn i18n --- src/locales/en.json | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/locales/en.json b/src/locales/en.json index 3bd8d6740..f1189955b 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -634,6 +634,7 @@ "edit_profile.fields.meta_fields_label": "Profile fields", "edit_profile.fields.nip05_label": "Username", "edit_profile.fields.nip05_placeholder": "user@{domain}", + "edit_profile.fields.nip05_unverified": "Name could not be verified and won't be used.", "edit_profile.fields.stranger_notifications_label": "Block notifications from strangers", "edit_profile.fields.website_label": "Website", "edit_profile.fields.website_placeholder": "Display a Link", @@ -1376,6 +1377,7 @@ "settings.change_password": "Change Password", "settings.configure_mfa": "Configure MFA", "settings.delete_account": "Delete Account", + "settings.edit_identity": "Identity", "settings.edit_profile": "Edit Profile", "settings.messages.label": "Allow users to start a new chat with you", "settings.mutes": "Mutes", From 77c41728e60f8cb387cba1aca1802196ce7b1b49 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Mon, 1 Apr 2024 15:20:54 +0200 Subject: [PATCH 11/24] Fix: Cannot Pin/Unpin Instances MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- src/actions/remote-timeline.ts | 8 ++++---- src/actions/settings.ts | 4 ++-- .../remote-timeline/components/pinned-hosts-picker.tsx | 2 +- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/actions/remote-timeline.ts b/src/actions/remote-timeline.ts index cb21126b9..ac1277aec 100644 --- a/src/actions/remote-timeline.ts +++ b/src/actions/remote-timeline.ts @@ -1,11 +1,11 @@ import { getSettings, changeSetting } from 'soapbox/actions/settings'; -import type { OrderedSet as ImmutableOrderedSet } from 'immutable'; +import type { List as ImmutableList, OrderedSet as ImmutableOrderedSet } from 'immutable'; import type { AppDispatch, RootState } from 'soapbox/store'; const getPinnedHosts = (state: RootState) => { const settings = getSettings(state); - return settings.getIn(['remote_timeline', 'pinnedHosts']) as ImmutableOrderedSet; + return settings.getIn(['remote_timeline', 'pinnedHosts']) as ImmutableList | ImmutableOrderedSet; }; const pinHost = (host: string) => @@ -13,7 +13,7 @@ const pinHost = (host: string) => const state = getState(); const pinnedHosts = getPinnedHosts(state); - return dispatch(changeSetting(['remote_timeline', 'pinnedHosts'], pinnedHosts.add(host))); + return dispatch(changeSetting(['remote_timeline', 'pinnedHosts'], pinnedHosts.toOrderedSet().add(host))); }; const unpinHost = (host: string) => @@ -21,7 +21,7 @@ const unpinHost = (host: string) => const state = getState(); const pinnedHosts = getPinnedHosts(state); - return dispatch(changeSetting(['remote_timeline', 'pinnedHosts'], pinnedHosts.remove(host))); + return dispatch(changeSetting(['remote_timeline', 'pinnedHosts'], pinnedHosts.toOrderedSet().remove(host))); }; export { diff --git a/src/actions/settings.ts b/src/actions/settings.ts index ae6a3ec35..ae26af50a 100644 --- a/src/actions/settings.ts +++ b/src/actions/settings.ts @@ -1,4 +1,4 @@ -import { Map as ImmutableMap, List as ImmutableList, OrderedSet as ImmutableOrderedSet } from 'immutable'; +import { Map as ImmutableMap, List as ImmutableList } from 'immutable'; import { defineMessage } from 'react-intl'; import { createSelector } from 'reselect'; import { v4 as uuid } from 'uuid'; @@ -169,7 +169,7 @@ const defaultSettings = ImmutableMap({ ]), remote_timeline: ImmutableMap({ - pinnedHosts: ImmutableOrderedSet(), + pinnedHosts: ImmutableList(), }), }); diff --git a/src/features/remote-timeline/components/pinned-hosts-picker.tsx b/src/features/remote-timeline/components/pinned-hosts-picker.tsx index 2777aa6e3..16cd45481 100644 --- a/src/features/remote-timeline/components/pinned-hosts-picker.tsx +++ b/src/features/remote-timeline/components/pinned-hosts-picker.tsx @@ -16,7 +16,7 @@ const PinnedHostsPicker: React.FC = ({ host: activeHost }) = return ( - {pinnedHosts.map((host: any) => ( + {pinnedHosts.map((host) => ( + + + + + + + ); +}; + +export default NostrRelays; diff --git a/src/features/ui/index.tsx b/src/features/ui/index.tsx index b206a647b..5574196ab 100644 --- a/src/features/ui/index.tsx +++ b/src/features/ui/index.tsx @@ -139,6 +139,7 @@ import { BookmarkFolders, EditIdentity, Domains, + NostrRelays, } from './util/async-components'; import GlobalHotkeys from './util/global-hotkeys'; import { WrappedRoute } from './util/react-router-helpers'; @@ -313,6 +314,7 @@ const SwitchingColumnsArea: React.FC = ({ children }) => {features.accountAliases && } {features.accountMoving && } {features.backups && } + diff --git a/src/features/ui/util/async-components.ts b/src/features/ui/util/async-components.ts index b6dff63f3..c9fae695d 100644 --- a/src/features/ui/util/async-components.ts +++ b/src/features/ui/util/async-components.ts @@ -170,3 +170,4 @@ export const SelectBookmarkFolderModal = lazy(() => import('soapbox/features/ui/ export const EditIdentity = lazy(() => import('soapbox/features/edit-identity')); export const Domains = lazy(() => import('soapbox/features/admin/domains')); export const EditDomainModal = lazy(() => import('soapbox/features/ui/components/modals/edit-domain-modal')); +export const NostrRelays = lazy(() => import('soapbox/features/nostr-relays')); \ No newline at end of file From bc6082d3f213abe77cc288b5b64a722eb30a40a2 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 1 Apr 2024 13:19:19 -0500 Subject: [PATCH 13/24] RelayEditor: allow setting the marker --- src/components/ui/select/select.tsx | 8 +++++-- .../nostr-relays/components/relay-editor.tsx | 21 +++++++++++++++++-- 2 files changed, 25 insertions(+), 4 deletions(-) diff --git a/src/components/ui/select/select.tsx b/src/components/ui/select/select.tsx index b67ebe975..b74f8195e 100644 --- a/src/components/ui/select/select.tsx +++ b/src/components/ui/select/select.tsx @@ -3,18 +3,22 @@ import React from 'react'; interface ISelect extends React.SelectHTMLAttributes { children: Iterable; + full?: boolean; } /** Multiple-select dropdown. */ const Select = React.forwardRef((props, ref) => { - const { children, className, ...filteredProps } = props; + const { children, className, full = true, ...filteredProps } = props; return ( + + ); }; From 20f60e763c17a57c463e947412b13b2bcd13b494 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 2 Apr 2024 01:54:55 -0500 Subject: [PATCH 14/24] edit relays: hook up data --- src/features/nostr-relays/index.tsx | 35 ++++++++++++++++++++++++++--- src/features/settings/index.tsx | 2 ++ src/utils/features.ts | 3 +++ 3 files changed, 37 insertions(+), 3 deletions(-) diff --git a/src/features/nostr-relays/index.tsx b/src/features/nostr-relays/index.tsx index 2921390e7..e92f2dabe 100644 --- a/src/features/nostr-relays/index.tsx +++ b/src/features/nostr-relays/index.tsx @@ -1,7 +1,10 @@ -import React, { useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { FormattedMessage, defineMessages, useIntl } from 'react-intl'; import { Button, Column, Form, FormActions, Stack } from 'soapbox/components/ui'; +import { useNostr } from 'soapbox/contexts/nostr-context'; +import { useNostrReq } from 'soapbox/features/nostr/hooks/useNostrReq'; +import { useOwnAccount } from 'soapbox/hooks'; import RelayEditor, { RelayData } from './components/relay-editor'; @@ -11,13 +14,39 @@ const messages = defineMessages({ const NostrRelays = () => { const intl = useIntl(); + const { account } = useOwnAccount(); + const { relay, signer } = useNostr(); + + const { events } = useNostrReq( + account?.nostr + ? [{ kinds: [10002], authors: [account?.nostr.pubkey], limit: 1 }] + : [], + ); const [relays, setRelays] = useState([]); const [isLoading, setIsLoading] = useState(false); - const handleSubmit = (): void => { + useEffect(() => { + const tags = events[0]?.tags ?? []; + const data = tags.map(tag => ({ url: tag[1], marker: tag[2] as 'read' | 'write' | undefined })); + setRelays(data); + }, [events]); + + const handleSubmit = async (): Promise => { + if (!signer || !relay) return; + setIsLoading(true); - // Save relays + + const event = await signer.signEvent({ + kind: 10002, + tags: relays.map(relay => relay.marker ? ['r', relay.url, relay.marker] : ['r', relay.url]), + content: '', + created_at: Math.floor(Date.now() / 1000), + }); + + // eslint-disable-next-line compat/compat + await relay.event(event, { signal: AbortSignal.timeout(1000) }); + setIsLoading(false); }; diff --git a/src/features/settings/index.tsx b/src/features/settings/index.tsx index f04f311a8..f2e53b867 100644 --- a/src/features/settings/index.tsx +++ b/src/features/settings/index.tsx @@ -21,6 +21,7 @@ const messages = defineMessages({ deleteAccount: { id: 'settings.delete_account', defaultMessage: 'Delete Account' }, editProfile: { id: 'settings.edit_profile', defaultMessage: 'Edit Profile' }, editIdentity: { id: 'settings.edit_identity', defaultMessage: 'Identity' }, + editRelays: { id: 'nostr_relays.title', defaultMessage: 'Relays' }, exportData: { id: 'column.export_data', defaultMessage: 'Export data' }, importData: { id: 'navigation_bar.import_data', defaultMessage: 'Import data' }, mfaDisabled: { id: 'mfa.disabled', defaultMessage: 'Disabled' }, @@ -71,6 +72,7 @@ const Settings = () => { {account?.source?.nostr?.nip05} )} + {features.nostr && } diff --git a/src/utils/features.ts b/src/utils/features.ts index 37c7af53b..8c42da8f4 100644 --- a/src/utils/features.ts +++ b/src/utils/features.ts @@ -757,6 +757,9 @@ const getInstanceFeatures = (instance: Instance) => { */ nip05: v.software === DITTO, + /** Has a Nostr relay. */ + nostr: !!instance.nostr?.relay, + /** * Ability to sign Nostr events over websocket. * @see GET /api/v1/streaming?stream=nostr From 569f7e5b3621de3215cfab1f9d2768a40fd6a527 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 2 Apr 2024 01:56:29 -0500 Subject: [PATCH 15/24] yarn i18n --- src/locales/en.json | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/locales/en.json b/src/locales/en.json index f1189955b..83851b3bc 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -1115,6 +1115,10 @@ "new_group_panel.title": "Create Group", "nostr_extension.found": "Sign in with browser extension.", "nostr_extension.not_found": "Browser extension not found.", + "nostr_relays.read_only": "Read-only", + "nostr_relays.read_write": "Read & write", + "nostr_relays.title": "Relays", + "nostr_relays.write_only": "Write-only", "nostr_signup.key-add.title": "Import Key", "nostr_signup.key.title": "You need a key to continue", "nostr_signup.keygen.title": "Your new key", From a17128c268439da0f44c39f057c4b26c584e567f Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 2 Apr 2024 14:41:59 -0500 Subject: [PATCH 16/24] edit relays: fix useEffect --- src/features/nostr-relays/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/features/nostr-relays/index.tsx b/src/features/nostr-relays/index.tsx index e92f2dabe..e3842f2dc 100644 --- a/src/features/nostr-relays/index.tsx +++ b/src/features/nostr-relays/index.tsx @@ -30,7 +30,7 @@ const NostrRelays = () => { const tags = events[0]?.tags ?? []; const data = tags.map(tag => ({ url: tag[1], marker: tag[2] as 'read' | 'write' | undefined })); setRelays(data); - }, [events]); + }, [events[0]]); const handleSubmit = async (): Promise => { if (!signer || !relay) return; From 1505f96258df279f6002d7351e608177f3749552 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Wed, 3 Apr 2024 13:28:30 +0200 Subject: [PATCH 17/24] Update to @tabler/icons 3.1.0, use filled for active state MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- package.json | 2 +- src/actions/moderation.tsx | 8 +- src/components/account-search.tsx | 4 +- src/components/account.tsx | 2 +- src/components/authorize-reject-buttons.tsx | 6 +- src/components/autosuggest-location.tsx | 8 +- src/components/birthday-input.tsx | 8 +- src/components/domain.tsx | 4 +- .../dropdown-menu/dropdown-menu.tsx | 2 +- src/components/event-preview.tsx | 4 +- src/components/gameboy.tsx | 8 +- src/components/list.tsx | 4 +- src/components/load-gap.tsx | 2 +- src/components/location-search.tsx | 4 +- src/components/media-gallery.tsx | 4 +- src/components/modal-root.tsx | 4 +- src/components/pending-items-row.tsx | 4 +- src/components/polls/poll-option.tsx | 4 +- src/components/preview-card.tsx | 8 +- src/components/profile-hover-card.tsx | 2 +- src/components/quoted-status.tsx | 2 +- src/components/scroll-top-button.tsx | 2 +- src/components/sidebar-menu.tsx | 40 +++++----- src/components/sidebar-navigation-link.tsx | 6 +- src/components/sidebar-navigation.tsx | 40 ++++++---- src/components/status-action-bar.tsx | 78 +++++++++---------- src/components/status-content.tsx | 2 +- src/components/status.tsx | 8 +- .../statuses/sensitive-content-overlay.tsx | 12 +-- src/components/thumb-navigation-link.tsx | 9 ++- src/components/thumb-navigation.tsx | 18 +++-- src/components/translate-button.tsx | 4 +- src/components/ui/accordion/accordion.tsx | 4 +- src/components/ui/avatar/avatar.tsx | 2 +- src/components/ui/card/card.tsx | 2 +- src/components/ui/carousel/carousel.tsx | 4 +- .../ui/emoji-selector/emoji-selector.tsx | 2 +- src/components/ui/icon/svg-icon.test.tsx | 2 +- src/components/ui/input/input.tsx | 2 +- src/components/ui/modal/modal.tsx | 4 +- src/components/ui/streamfield/streamfield.tsx | 2 +- src/components/ui/tag-input/tag.tsx | 2 +- src/components/ui/toast/toast.tsx | 8 +- src/components/ui/widget/widget.tsx | 2 +- src/components/upload-progress.tsx | 2 +- src/components/upload.tsx | 18 ++--- src/components/validation-checkmark.tsx | 2 +- .../account-gallery/components/media-item.tsx | 4 +- .../components/moved-note.tsx | 2 +- src/features/account/components/header.tsx | 62 +++++++-------- src/features/admin/announcements.tsx | 2 +- .../admin/components/report-status.tsx | 6 +- src/features/admin/components/report.tsx | 6 +- src/features/admin/domains.tsx | 2 +- src/features/admin/tabs/dashboard.tsx | 8 +- src/features/aliases/components/account.tsx | 2 +- src/features/aliases/components/search.tsx | 2 +- src/features/aliases/index.tsx | 2 +- src/features/audio/index.tsx | 6 +- .../auth-login/components/consumer-button.tsx | 14 ++-- .../components/registration-form.tsx | 4 +- src/features/auth-token-list/index.tsx | 2 +- src/features/birthdays/account.tsx | 2 +- src/features/bookmark-folders/index.tsx | 4 +- src/features/bookmarks/index.tsx | 6 +- .../chats/components/chat-composer.tsx | 2 +- .../chats/components/chat-list-item.tsx | 4 +- .../components/chat-message-list-intro.tsx | 2 +- .../chats/components/chat-message.tsx | 16 ++-- .../chat-page/components/chat-page-main.tsx | 8 +- .../chat-page/components/chat-page-new.tsx | 2 +- .../components/chat-page-settings.tsx | 2 +- .../components/chat-page-sidebar.tsx | 4 +- .../chats/components/chat-pane/chat-pane.tsx | 2 +- .../chats/components/chat-search-input.tsx | 2 +- .../components/chat-search/chat-search.tsx | 2 +- .../chats/components/chat-upload-preview.tsx | 2 +- src/features/chats/components/chat-upload.tsx | 2 +- .../chat-widget/chat-pane-header.tsx | 2 +- .../components/chat-widget/chat-settings.tsx | 6 +- .../components/chat-widget/chat-window.tsx | 4 +- .../headers/chat-search-header.tsx | 2 +- .../compose/components/compose-form.tsx | 4 +- .../compose/components/markdown-button.tsx | 2 +- .../compose/components/poll-button.tsx | 2 +- .../compose/components/privacy-dropdown.tsx | 8 +- .../compose/components/reply-indicator.tsx | 2 +- .../compose/components/schedule-button.tsx | 2 +- .../compose/components/schedule-form.tsx | 2 +- .../compose/components/search-results.tsx | 2 +- src/features/compose/components/search.tsx | 6 +- .../compose/components/spoiler-button.tsx | 2 +- .../compose/components/upload-button.tsx | 4 +- .../components/crypto-address.tsx | 4 +- .../components/detailed-crypto-address.tsx | 2 +- src/features/developers/developers-menu.tsx | 16 ++-- .../developers/service-worker-info.tsx | 2 +- src/features/edit-identity/index.tsx | 2 +- .../edit-profile/components/avatar-picker.tsx | 2 +- .../edit-profile/components/header-picker.tsx | 4 +- .../emoji-picker-dropdown-container.tsx | 2 +- .../event/components/event-action-button.tsx | 4 +- src/features/event/components/event-date.tsx | 2 +- .../event/components/event-header.tsx | 48 ++++++------ src/features/event/event-information.tsx | 6 +- .../events/components/event-carousel.tsx | 4 +- .../components/instance-restrictions.tsx | 16 ++-- .../components/restricted-instance.tsx | 2 +- .../group/components/group-header-image.tsx | 2 +- .../group/components/group-header.tsx | 2 +- .../components/group-member-list-item.tsx | 8 +- .../group/components/group-options-button.tsx | 10 +-- .../group/components/group-privacy.tsx | 8 +- .../group/components/group-relationship.tsx | 4 +- .../group/components/group-tag-list-item.tsx | 12 +-- src/features/group/edit-group.tsx | 2 +- src/features/group/group-tag-timeline.tsx | 2 +- src/features/group/group-tags.tsx | 2 +- src/features/group/group-timeline.tsx | 2 +- src/features/group/manage-group.tsx | 2 +- .../components/discover/group-list-item.tsx | 2 +- .../components/discover/layout-buttons.tsx | 4 +- .../discover/search/recent-searches.tsx | 2 +- src/features/groups/discover.tsx | 4 +- src/features/groups/index.tsx | 2 +- src/features/groups/tag.tsx | 4 +- src/features/list-adder/components/list.tsx | 6 +- .../list-editor/components/account.tsx | 4 +- .../list-editor/components/search.tsx | 2 +- src/features/lists/index.tsx | 6 +- .../notifications/components/filter-bar.tsx | 14 ++-- .../notifications/components/notification.tsx | 34 ++++---- .../steps/avatar-selection-step.tsx | 2 +- .../onboarding/steps/completed-step.tsx | 2 +- .../steps/cover-photo-selection-step.tsx | 2 +- .../onboarding/steps/fediverse-step.tsx | 2 +- src/features/public-timeline/index.tsx | 2 +- src/features/remote-timeline/index.tsx | 2 +- src/features/reply-mentions/account.tsx | 4 +- .../scheduled-status-action-bar.tsx | 4 +- .../status/components/detailed-status.tsx | 6 +- src/features/theme-editor/index.tsx | 6 +- src/features/ui/components/action-button.tsx | 4 +- src/features/ui/components/error-column.tsx | 2 +- .../ui/components/floating-action-button.tsx | 4 +- .../ui/components/instance-info-panel.tsx | 2 +- .../components/instance-moderation-panel.tsx | 4 +- .../account-moderation-modal.tsx | 2 +- .../ui/components/modals/boost-modal.tsx | 2 +- .../compose-event-modal.tsx | 8 +- .../compose-event-modal/upload-button.tsx | 2 +- .../ui/components/modals/compose-modal.tsx | 2 +- .../modals/edit-bookmark-folder-modal.tsx | 2 +- .../ui/components/modals/event-map-modal.tsx | 2 +- .../components/modals/landing-page-modal.tsx | 2 +- .../steps/confirmation-step.tsx | 4 +- .../ui/components/modals/media-modal.tsx | 10 +-- .../nostr-signup-modal/steps/keygen-step.tsx | 2 +- .../modals/reply-mentions-modal.tsx | 2 +- .../modals/report-modal/report-modal.tsx | 2 +- .../report-modal/steps/other-actions-step.tsx | 4 +- .../modals/select-bookmark-folder-modal.tsx | 4 +- src/features/ui/components/navbar.tsx | 2 +- .../ui/components/panels/new-event-panel.tsx | 2 +- .../ui/components/profile-dropdown.tsx | 4 +- src/features/ui/components/profile-field.tsx | 2 +- .../ui/components/profile-info-panel.tsx | 10 +-- .../ui/components/subscription-button.tsx | 2 +- src/features/ui/components/theme-selector.tsx | 10 +-- .../ui/components/who-to-follow-panel.tsx | 2 +- src/features/video/index.tsx | 6 +- src/pages/group-page.tsx | 6 +- yarn.lock | 8 +- 173 files changed, 515 insertions(+), 500 deletions(-) diff --git a/package.json b/package.json index 2ffe7dfce..ebbeaa9b9 100644 --- a/package.json +++ b/package.json @@ -75,7 +75,7 @@ "@soapbox.pub/wasmboy": "^0.8.0", "@soapbox/nspec": "npm:@jsr/soapbox__nspec", "@soapbox/weblock": "npm:@jsr/soapbox__weblock", - "@tabler/icons": "^2.0.0", + "@tabler/icons": "^3.1.0", "@tailwindcss/aspect-ratio": "^0.4.2", "@tailwindcss/forms": "^0.5.7", "@tailwindcss/typography": "^0.5.10", diff --git a/src/actions/moderation.tsx b/src/actions/moderation.tsx index 52b418b11..35ad6a4d7 100644 --- a/src/actions/moderation.tsx +++ b/src/actions/moderation.tsx @@ -58,7 +58,7 @@ const deactivateUserModal = (intl: IntlShape, accountId: string, afterConfirm = ); dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/user-off.svg'), + icon: require('@tabler/icons/outline/user-off.svg'), heading: intl.formatMessage(messages.deactivateUserHeading, { acct }), message, confirm: intl.formatMessage(messages.deactivateUserConfirm, { name }), @@ -96,7 +96,7 @@ const deleteUserModal = (intl: IntlShape, accountId: string, afterConfirm = () = const checkbox = local ? intl.formatMessage(messages.deleteLocalUserCheckbox) : false; dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/user-minus.svg'), + icon: require('@tabler/icons/outline/user-minus.svg'), heading: intl.formatMessage(messages.deleteUserHeading, { acct }), message, confirm, @@ -118,7 +118,7 @@ const toggleStatusSensitivityModal = (intl: IntlShape, statusId: string, sensiti const acct = state.statuses.get(statusId)!.account.acct; dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/alert-triangle.svg'), + icon: require('@tabler/icons/outline/alert-triangle.svg'), heading: intl.formatMessage(sensitive === false ? messages.markStatusSensitiveHeading : messages.markStatusNotSensitiveHeading), message: intl.formatMessage(sensitive === false ? messages.markStatusSensitivePrompt : messages.markStatusNotSensitivePrompt, { acct }), confirm: intl.formatMessage(sensitive === false ? messages.markStatusSensitiveConfirm : messages.markStatusNotSensitiveConfirm), @@ -138,7 +138,7 @@ const deleteStatusModal = (intl: IntlShape, statusId: string, afterConfirm = () const acct = state.statuses.get(statusId)!.account.acct; dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: intl.formatMessage(messages.deleteStatusHeading), message: intl.formatMessage(messages.deleteStatusPrompt, { acct: {acct} }), confirm: intl.formatMessage(messages.deleteStatusConfirm), diff --git a/src/components/account-search.tsx b/src/components/account-search.tsx index 50e6e8ee7..dec244674 100644 --- a/src/components/account-search.tsx +++ b/src/components/account-search.tsx @@ -76,12 +76,12 @@ const AccountSearch: React.FC = ({ onSelected, ...rest }) => { onClick={handleClear} > diff --git a/src/components/account.tsx b/src/components/account.tsx index d4c252654..5751b2c3a 100644 --- a/src/components/account.tsx +++ b/src/components/account.tsx @@ -264,7 +264,7 @@ const Account = ({ <> · - + ) : null} diff --git a/src/components/authorize-reject-buttons.tsx b/src/components/authorize-reject-buttons.tsx index aa6a39ab7..aa1bd9d74 100644 --- a/src/components/authorize-reject-buttons.tsx +++ b/src/components/authorize-reject-buttons.tsx @@ -106,7 +106,7 @@ const AuthorizeRejectButtons: React.FC = ({ onAuthorize = ({ onAuthorize /> = ({ theme, icon, } > = { house: homeIcon, diff --git a/src/components/birthday-input.tsx b/src/components/birthday-input.tsx index 62043bd51..53fbed409 100644 --- a/src/components/birthday-input.tsx +++ b/src/components/birthday-input.tsx @@ -70,7 +70,7 @@ const BirthdayInput: React.FC = ({ value, onChange, required })
= ({ value, onChange, required }) {intl.formatDate(date, { month: 'long' })} = ({ value, onChange, required })
= ({ value, onChange, required }) {intl.formatDate(date, { year: 'numeric' })} = ({ domain }) => { // const onBlockDomain = () => { // dispatch(openModal('CONFIRM', { - // icon: require('@tabler/icons/ban.svg'), + // icon: require('@tabler/icons/outline/ban.svg'), // heading: , // message: {domain} }} />, // confirm: intl.formatMessage(messages.blockDomainConfirm), @@ -38,7 +38,7 @@ const Domain: React.FC = ({ domain }) => { {domain} - + ); }; diff --git a/src/components/dropdown-menu/dropdown-menu.tsx b/src/components/dropdown-menu/dropdown-menu.tsx index 2c94f9be0..7bdaff994 100644 --- a/src/components/dropdown-menu/dropdown-menu.tsx +++ b/src/components/dropdown-menu/dropdown-menu.tsx @@ -41,7 +41,7 @@ const DropdownMenu = (props: IDropdownMenu) => { onOpen, onShiftClick, placement: initialPlacement = 'top', - src = require('@tabler/icons/dots.svg'), + src = require('@tabler/icons/outline/dots.svg'), title = 'Menu', ...filteredProps } = props; diff --git a/src/components/event-preview.tsx b/src/components/event-preview.tsx index 710075764..5ef36a4d5 100644 --- a/src/components/event-preview.tsx +++ b/src/components/event-preview.tsx @@ -67,7 +67,7 @@ const EventPreview: React.FC = ({ status, className, hideAction,
- + {account.verified && } @@ -78,7 +78,7 @@ const EventPreview: React.FC = ({ status, className, hideAction, {event.location && ( - + {event.location.get('name')} diff --git a/src/components/gameboy.tsx b/src/components/gameboy.tsx index 234b62097..fca9ab16b 100644 --- a/src/components/gameboy.tsx +++ b/src/components/gameboy.tsx @@ -138,13 +138,13 @@ const Gameboy: React.FC = ({ className, src, aspect = 'normal', onFocu theme='transparent' className='text-white' onClick={togglePaused} - src={paused ? require('@tabler/icons/player-play.svg') : require('@tabler/icons/player-pause.svg')} + src={paused ? require('@tabler/icons/outline/player-play.svg') : require('@tabler/icons/outline/player-pause.svg')} /> @@ -152,14 +152,14 @@ const Gameboy: React.FC = ({ className, src, aspect = 'normal', onFocu diff --git a/src/components/list.tsx b/src/components/list.tsx index 303690593..b26eea116 100644 --- a/src/components/list.tsx +++ b/src/components/list.tsx @@ -73,7 +73,7 @@ const ListItem: React.FC = ({ label, hint, children, to, onClick, onS {children} - + ) : null} @@ -91,7 +91,7 @@ const ListItem: React.FC = ({ label, hint, children, to, onClick, onS } > = ({ disabled, maxId, onClick }) => { return ( ); }; diff --git a/src/components/location-search.tsx b/src/components/location-search.tsx index d2d8d4f29..b3c9430b6 100644 --- a/src/components/location-search.tsx +++ b/src/components/location-search.tsx @@ -100,8 +100,8 @@ const LocationSearch: React.FC = ({ onSelected }) => { renderSuggestion={AutosuggestLocation} />
- - + +
); diff --git a/src/components/media-gallery.tsx b/src/components/media-gallery.tsx index eb4f1988a..5eef12bcc 100644 --- a/src/components/media-gallery.tsx +++ b/src/components/media-gallery.tsx @@ -164,7 +164,7 @@ const Item: React.FC = ({ const attachmentIcon = ( ); @@ -240,7 +240,7 @@ const Item: React.FC = ({ target='_blank' title={attachment.description} > - + {ext} ); diff --git a/src/components/modal-root.tsx b/src/components/modal-root.tsx index 1c755b995..4216431b8 100644 --- a/src/components/modal-root.tsx +++ b/src/components/modal-root.tsx @@ -75,7 +75,7 @@ const ModalRoot: React.FC = ({ children, onCancel, onClose, type }) if (hasComposeContent && type === 'COMPOSE') { const isEditing = compose!.id !== null; dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: isEditing ? : , @@ -94,7 +94,7 @@ const ModalRoot: React.FC = ({ children, onCancel, onClose, type }) } else if (hasEventComposeContent && type === 'COMPOSE_EVENT') { const isEditing = getState().compose_event.id !== null; dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: isEditing ? : , diff --git a/src/components/pending-items-row.tsx b/src/components/pending-items-row.tsx index f86be15d3..e37714b76 100644 --- a/src/components/pending-items-row.tsx +++ b/src/components/pending-items-row.tsx @@ -25,7 +25,7 @@ const PendingItemsRow: React.FC = ({ to, count, size = 'md' }) })} > = ({ to, count, size = 'md' }) diff --git a/src/components/polls/poll-option.tsx b/src/components/polls/poll-option.tsx index 7fb7a64d8..83b12a1e3 100644 --- a/src/components/polls/poll-option.tsx +++ b/src/components/polls/poll-option.tsx @@ -86,7 +86,7 @@ const PollOptionText: React.FC = ({ poll, option, index, active aria-label={option.title} > {active && ( - + )}
@@ -143,7 +143,7 @@ const PollOption: React.FC = (props): JSX.Element | null => { {voted ? ( diff --git a/src/components/preview-card.tsx b/src/components/preview-card.tsx index 16a1a467c..9fbbb70b8 100644 --- a/src/components/preview-card.tsx +++ b/src/components/preview-card.tsx @@ -135,7 +135,7 @@ const PreviewCard: React.FC = ({ )} - + {card.provider_name} @@ -168,10 +168,10 @@ const PreviewCard: React.FC = ({ if (embedded) { embed = renderVideo(); } else { - let iconVariant = require('@tabler/icons/player-play.svg'); + let iconVariant = require('@tabler/icons/outline/player-play.svg'); if (card.type === 'photo') { - iconVariant = require('@tabler/icons/zoom-in.svg'); + iconVariant = require('@tabler/icons/outline/zoom-in.svg'); } embed = ( @@ -198,7 +198,7 @@ const PreviewCard: React.FC = ({ className='text-gray-700 hover:text-gray-900 dark:text-gray-500 dark:hover:text-gray-100' > diff --git a/src/components/profile-hover-card.tsx b/src/components/profile-hover-card.tsx index 0def77693..db555e226 100644 --- a/src/components/profile-hover-card.tsx +++ b/src/components/profile-hover-card.tsx @@ -119,7 +119,7 @@ export const ProfileHoverCard: React.FC = ({ visible = true } {account.local ? ( diff --git a/src/components/quoted-status.tsx b/src/components/quoted-status.tsx index 4470cd453..edbca1457 100644 --- a/src/components/quoted-status.tsx +++ b/src/components/quoted-status.tsx @@ -84,7 +84,7 @@ const QuotedStatus: React.FC = ({ status, onCancel, compose }) => if (onCancel) { actions = { onActionClick: handleClose, - actionIcon: require('@tabler/icons/x.svg'), + actionIcon: require('@tabler/icons/outline/x.svg'), actionAlignment: 'top', actionTitle: intl.formatMessage(messages.cancel), }; diff --git a/src/components/scroll-top-button.tsx b/src/components/scroll-top-button.tsx index 6c9f06c44..9e2dfafe4 100644 --- a/src/components/scroll-top-button.tsx +++ b/src/components/scroll-top-button.tsx @@ -92,7 +92,7 @@ const ScrollTopButton: React.FC = ({ > diff --git a/src/components/sidebar-menu.tsx b/src/components/sidebar-menu.tsx index e79853adc..f8d091b20 100644 --- a/src/components/sidebar-menu.tsx +++ b/src/components/sidebar-menu.tsx @@ -161,7 +161,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { { @@ -192,7 +192,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {(account.locked || followRequestsCount > 0) && ( @@ -201,7 +201,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.bookmarks && ( @@ -210,7 +210,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.groups && ( @@ -219,7 +219,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.lists && ( @@ -228,7 +228,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.events && ( @@ -237,7 +237,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {settings.get('isDeveloper') && ( @@ -248,7 +248,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { : } onClick={onClose} /> @@ -256,7 +256,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.federating && ( } onClick={onClose} /> @@ -267,21 +267,21 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { @@ -289,7 +289,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.federating && ( @@ -298,7 +298,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {(features.filters || features.filtersV2) && ( @@ -307,7 +307,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {features.followedHashtagsList && ( @@ -316,7 +316,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {account.admin && ( @@ -326,7 +326,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { @@ -341,7 +341,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { { {otherAccounts.map(account => renderAccount(account))} - + {intl.formatMessage(messages.addAccount)}
diff --git a/src/components/sidebar-navigation-link.tsx b/src/components/sidebar-navigation-link.tsx index 906fabc42..d1b7465bf 100644 --- a/src/components/sidebar-navigation-link.tsx +++ b/src/components/sidebar-navigation-link.tsx @@ -11,6 +11,8 @@ interface ISidebarNavigationLink { countMax?: number; /** URL to an SVG icon. */ icon: string; + /** URL to an SVG icon for active state. */ + activeIcon?: string; /** Link label. */ text: React.ReactNode; /** Route to an internal page. */ @@ -21,7 +23,7 @@ interface ISidebarNavigationLink { /** Desktop sidebar navigation link. */ const SidebarNavigationLink = React.forwardRef((props: ISidebarNavigationLink, ref: React.ForwardedRef): JSX.Element => { - const { icon, text, to = '', count, countMax, onClick } = props; + const { icon, activeIcon, text, to = '', count, countMax, onClick } = props; const isActive = location.pathname === to; const handleClick: React.EventHandler = (e) => { @@ -45,7 +47,7 @@ const SidebarNavigationLink = React.forwardRef((props: ISidebarNavigationLink, r > { menu.push({ to: '/follow_requests', text: intl.formatMessage(messages.follow_requests), - icon: require('@tabler/icons/user-plus.svg'), + icon: require('@tabler/icons/outline/user-plus.svg'), count: followRequestsCount, }); } @@ -51,7 +51,7 @@ const SidebarNavigation = () => { menu.push({ to: '/bookmarks', text: intl.formatMessage(messages.bookmarks), - icon: require('@tabler/icons/bookmark.svg'), + icon: require('@tabler/icons/outline/bookmark.svg'), }); } @@ -59,7 +59,7 @@ const SidebarNavigation = () => { menu.push({ to: '/lists', text: intl.formatMessage(messages.lists), - icon: require('@tabler/icons/list.svg'), + icon: require('@tabler/icons/outline/list.svg'), }); } @@ -67,14 +67,14 @@ const SidebarNavigation = () => { menu.push({ to: '/events', text: intl.formatMessage(messages.events), - icon: require('@tabler/icons/calendar-event.svg'), + icon: require('@tabler/icons/outline/calendar-event.svg'), }); } if (isDeveloper) { menu.push({ to: '/developers', - icon: require('@tabler/icons/code.svg'), + icon: require('@tabler/icons/outline/code.svg'), text: intl.formatMessage(messages.developers), }); } @@ -91,7 +91,7 @@ const SidebarNavigation = () => { return ( } @@ -103,7 +103,7 @@ const SidebarNavigation = () => { return ( } /> ); @@ -117,13 +117,14 @@ const SidebarNavigation = () => { } /> } /> @@ -131,7 +132,8 @@ const SidebarNavigation = () => { <> } /> @@ -141,27 +143,30 @@ const SidebarNavigation = () => { {features.groups && ( } /> )} } /> } /> {account.staff && ( } /> @@ -174,7 +179,8 @@ const SidebarNavigation = () => { {(account || !restrictUnauth.timelines.local) && ( : } /> )} @@ -182,7 +188,7 @@ const SidebarNavigation = () => { {(features.federating && (account || !restrictUnauth.timelines.federated)) && ( } /> )} @@ -192,7 +198,7 @@ const SidebarNavigation = () => { {menu.length > 0 && ( } /> diff --git a/src/components/status-action-bar.tsx b/src/components/status-action-bar.tsx index 0d0de6a1f..2d7628fd3 100644 --- a/src/components/status-action-bar.tsx +++ b/src/components/status-action-bar.tsx @@ -232,7 +232,7 @@ const StatusActionBar: React.FC = ({ dispatch(deleteStatus(status.id, withRedraft)); } else { dispatch(openModal('CONFIRM', { - icon: withRedraft ? require('@tabler/icons/edit.svg') : require('@tabler/icons/trash.svg'), + icon: withRedraft ? require('@tabler/icons/outline/edit.svg') : require('@tabler/icons/outline/trash.svg'), heading: intl.formatMessage(withRedraft ? messages.redraftHeading : messages.deleteHeading), message: intl.formatMessage(withRedraft ? messages.redraftMessage : messages.deleteMessage), confirm: intl.formatMessage(withRedraft ? messages.redraftConfirm : messages.deleteConfirm), @@ -313,7 +313,7 @@ const StatusActionBar: React.FC = ({ const account = status.account; dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), heading: , message: @{account.acct} }} />, confirm: intl.formatMessage(messages.blockConfirm), @@ -409,7 +409,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.open), action: handleOpen, - icon: require('@tabler/icons/arrows-vertical.svg'), + icon: require('@tabler/icons/outline/arrows-vertical.svg'), }); } @@ -417,14 +417,14 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.copy), action: handleCopy, - icon: require('@tabler/icons/clipboard-copy.svg'), + icon: require('@tabler/icons/outline/clipboard-copy.svg'), }); if (features.embeds && account.local) { menu.push({ text: intl.formatMessage(messages.embed), action: handleEmbed, - icon: require('@tabler/icons/share.svg'), + icon: require('@tabler/icons/outline/share.svg'), }); } } @@ -441,7 +441,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(status.pinned ? messages.unpinFromGroup : messages.pinToGroup), action: handleGroupPinClick, - icon: status.pinned ? require('@tabler/icons/pinned-off.svg') : require('@tabler/icons/pin.svg'), + icon: status.pinned ? require('@tabler/icons/outline/pinned-off.svg') : require('@tabler/icons/outline/pin.svg'), }); } } @@ -450,7 +450,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(status.bookmarked ? messages.unbookmark : messages.bookmark), action: handleBookmarkClick, - icon: status.bookmarked ? require('@tabler/icons/bookmark-off.svg') : require('@tabler/icons/bookmark.svg'), + icon: status.bookmarked ? require('@tabler/icons/outline/bookmark-off.svg') : require('@tabler/icons/outline/bookmark.svg'), }); } @@ -458,7 +458,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.external, { domain }), action: handleExternalClick, - icon: require('@tabler/icons/external-link.svg'), + icon: require('@tabler/icons/outline/external-link.svg'), }); } @@ -467,7 +467,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(mutingConversation ? messages.unmuteConversation : messages.muteConversation), action: handleConversationMuteClick, - icon: mutingConversation ? require('@tabler/icons/bell.svg') : require('@tabler/icons/bell-off.svg'), + icon: mutingConversation ? require('@tabler/icons/outline/bell.svg') : require('@tabler/icons/outline/bell-off.svg'), }); menu.push(null); @@ -477,14 +477,14 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(status.pinned ? messages.unpin : messages.pin), action: handlePinClick, - icon: status.pinned ? require('@tabler/icons/pinned-off.svg') : require('@tabler/icons/pin.svg'), + icon: status.pinned ? require('@tabler/icons/outline/pinned-off.svg') : require('@tabler/icons/outline/pin.svg'), }); } else { if (status.visibility === 'private') { menu.push({ text: intl.formatMessage(status.reblogged ? messages.cancel_reblog_private : messages.reblog_private), action: handleReblogClick, - icon: require('@tabler/icons/repeat.svg'), + icon: require('@tabler/icons/outline/repeat.svg'), }); } } @@ -492,20 +492,20 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.delete), action: handleDeleteClick, - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); if (features.editStatuses) { menu.push({ text: intl.formatMessage(messages.edit), action: handleEditClick, - icon: require('@tabler/icons/edit.svg'), + icon: require('@tabler/icons/outline/edit.svg'), }); } else { menu.push({ text: intl.formatMessage(messages.redraft), action: handleRedraftClick, - icon: require('@tabler/icons/edit.svg'), + icon: require('@tabler/icons/outline/edit.svg'), destructive: true, }); } @@ -513,20 +513,20 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.mention, { name: username }), action: handleMentionClick, - icon: require('@tabler/icons/at.svg'), + icon: require('@tabler/icons/outline/at.svg'), }); if (status.account.pleroma?.accepts_chat_messages === true) { menu.push({ text: intl.formatMessage(messages.chat, { name: username }), action: handleChatClick, - icon: require('@tabler/icons/messages.svg'), + icon: require('@tabler/icons/outline/messages.svg'), }); } else if (features.privacyScopes) { menu.push({ text: intl.formatMessage(messages.direct, { name: username }), action: handleDirectClick, - icon: require('@tabler/icons/mail.svg'), + icon: require('@tabler/icons/outline/mail.svg'), }); } @@ -534,7 +534,7 @@ const StatusActionBar: React.FC = ({ if (features.groupsMuting && status.group) { menu.push({ text: isMutingGroup ? intl.formatMessage(messages.unmuteGroup) : intl.formatMessage(messages.muteGroup), - icon: require('@tabler/icons/volume-3.svg'), + icon: require('@tabler/icons/outline/volume-3.svg'), action: isMutingGroup ? handleUnmuteGroupClick : handleMuteGroupClick, }); menu.push(null); @@ -543,17 +543,17 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.mute, { name: username }), action: handleMuteClick, - icon: require('@tabler/icons/volume-3.svg'), + icon: require('@tabler/icons/outline/volume-3.svg'), }); menu.push({ text: intl.formatMessage(messages.block, { name: username }), action: handleBlockClick, - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); menu.push({ text: intl.formatMessage(messages.report, { name: username }), action: handleReport, - icon: require('@tabler/icons/flag.svg'), + icon: require('@tabler/icons/outline/flag.svg'), }); } @@ -575,7 +575,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: 'Ban from Group', action: handleBlockFromGroup, - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), destructive: true, }); } @@ -584,7 +584,7 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.groupModDelete), action: handleDeleteFromGroup, - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); } @@ -596,28 +596,28 @@ const StatusActionBar: React.FC = ({ menu.push({ text: intl.formatMessage(messages.adminAccount, { name: username }), action: onModerate, - icon: require('@tabler/icons/gavel.svg'), + icon: require('@tabler/icons/outline/gavel.svg'), }); if (isAdmin) { menu.push({ text: intl.formatMessage(messages.admin_status), href: `/pleroma/admin/#/statuses/${status.id}/`, - icon: require('@tabler/icons/pencil.svg'), + icon: require('@tabler/icons/outline/pencil.svg'), }); } menu.push({ text: intl.formatMessage(status.sensitive === false ? messages.markStatusSensitive : messages.markStatusNotSensitive), action: handleToggleStatusSensitivity, - icon: require('@tabler/icons/alert-triangle.svg'), + icon: require('@tabler/icons/outline/alert-triangle.svg'), }); if (!ownAccount) { menu.push({ text: intl.formatMessage(messages.deleteStatus), action: handleDeleteStatus, - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); } @@ -655,14 +655,14 @@ const StatusActionBar: React.FC = ({ const meEmojiTitle = intl.formatMessage(reactMessages[meEmojiName || ''] || messages.favourite); const menu = _makeMenu(publicStatus); - let reblogIcon = require('@tabler/icons/repeat.svg'); + let reblogIcon = require('@tabler/icons/outline/repeat.svg'); let replyTitle; let replyDisabled = false; if (status.visibility === 'direct') { - reblogIcon = require('@tabler/icons/mail.svg'); + reblogIcon = require('@tabler/icons/outline/mail.svg'); } else if (status.visibility === 'private') { - reblogIcon = require('@tabler/icons/lock.svg'); + reblogIcon = require('@tabler/icons/outline/lock.svg'); } if ((status.group as Group)?.membership_required && !groupRelationship?.member) { @@ -673,11 +673,11 @@ const StatusActionBar: React.FC = ({ const reblogMenu = [{ text: intl.formatMessage(status.reblogged ? messages.cancel_reblog_private : messages.reblog), action: handleReblogClick, - icon: require('@tabler/icons/repeat.svg'), + icon: require('@tabler/icons/outline/repeat.svg'), }, { text: intl.formatMessage(messages.quotePost), action: handleQuoteClick, - icon: require('@tabler/icons/quote.svg'), + icon: require('@tabler/icons/outline/quote.svg'), }]; const reblogButton = ( @@ -726,7 +726,7 @@ const StatusActionBar: React.FC = ({ > = ({ = ({ ) : ( = ({ {features.dislikes && ( = ({ {(acceptsZaps && window.webln) && ( = ({ {canShare && ( @@ -814,7 +814,7 @@ const StatusActionBar: React.FC = ({ diff --git a/src/components/status-content.tsx b/src/components/status-content.tsx index c69459106..3302239f4 100644 --- a/src/components/status-content.tsx +++ b/src/components/status-content.tsx @@ -27,7 +27,7 @@ interface IReadMoreButton { const ReadMoreButton: React.FC = ({ onClick }) => ( ); diff --git a/src/components/status.tsx b/src/components/status.tsx index e94755262..507e499f5 100644 --- a/src/components/status.tsx +++ b/src/components/status.tsx @@ -210,7 +210,7 @@ const Status: React.FC = (props) => { return ( } + icon={} text={ = (props) => { return ( } + icon={} text={ = (props) => { return ( } + icon={} text={ } @@ -287,7 +287,7 @@ const Status: React.FC = (props) => { return ( } + icon={} text={ {intl.formatMessage(messages.contact)} @@ -151,7 +151,7 @@ const SensitiveContentOverlay = React.forwardRef {intl.formatMessage(messages.show)} @@ -160,7 +160,7 @@ const SensitiveContentOverlay = React.forwardRef ) : null} diff --git a/src/components/thumb-navigation-link.tsx b/src/components/thumb-navigation-link.tsx index a8176fb1d..f824392e5 100644 --- a/src/components/thumb-navigation-link.tsx +++ b/src/components/thumb-navigation-link.tsx @@ -9,13 +9,14 @@ interface IThumbNavigationLink { count?: number; countMax?: number; src: string; + activeSrc?: string; text: string | React.ReactElement; to: string; exact?: boolean; paths?: Array; } -const ThumbNavigationLink: React.FC = ({ count, countMax, src, text, to, exact, paths }): JSX.Element => { +const ThumbNavigationLink: React.FC = ({ count, countMax, src, activeSrc, text, to, exact, paths }): JSX.Element => { const { pathname } = useLocation(); const isActive = (): boolean => { @@ -28,11 +29,13 @@ const ThumbNavigationLink: React.FC = ({ count, countMax, const active = isActive(); + const icon = (active && activeSrc) || src; + return ( {count !== undefined ? ( = ({ count, countMax, /> ) : ( { if (features.chats) { return ( } to='/chats' exact @@ -33,7 +33,8 @@ const ThumbNavigation: React.FC = (): JSX.Element => { if (features.directTimeline || features.conversations) { return ( } to='/messages' paths={['/messages', '/conversations']} @@ -47,7 +48,8 @@ const ThumbNavigation: React.FC = (): JSX.Element => { return (
} to='/' exact @@ -55,7 +57,8 @@ const ThumbNavigation: React.FC = (): JSX.Element => { {features.groups && ( } to={groupsPath} exact @@ -63,7 +66,7 @@ const ThumbNavigation: React.FC = (): JSX.Element => { )} } to='/search' exact @@ -71,7 +74,8 @@ const ThumbNavigation: React.FC = (): JSX.Element => { {account && ( } to='/notifications' exact @@ -83,7 +87,7 @@ const ThumbNavigation: React.FC = (): JSX.Element => { {(account && account.staff) && ( } to='/soapbox/admin' count={dashboardCount} diff --git a/src/components/translate-button.tsx b/src/components/translate-button.tsx index 7a9c31976..57752ec28 100644 --- a/src/components/translate-button.tsx +++ b/src/components/translate-button.tsx @@ -53,7 +53,7 @@ const TranslateButton: React.FC = ({ status }) => {
diff --git a/src/components/ui/accordion/accordion.tsx b/src/components/ui/accordion/accordion.tsx index 7e959c227..efaa02a69 100644 --- a/src/components/ui/accordion/accordion.tsx +++ b/src/components/ui/accordion/accordion.tsx @@ -60,7 +60,7 @@ const Accordion: React.FC = ({ headline, children, menu, expanded = {menu && ( )} {action && actionIcon && ( @@ -72,7 +72,7 @@ const Accordion: React.FC = ({ headline, children, menu, expanded = )} diff --git a/src/components/ui/avatar/avatar.tsx b/src/components/ui/avatar/avatar.tsx index d00f8ebf2..448ab7e52 100644 --- a/src/components/ui/avatar/avatar.tsx +++ b/src/components/ui/avatar/avatar.tsx @@ -35,7 +35,7 @@ const Avatar = (props: IAvatar) => { className={clsx('flex items-center justify-center rounded-full bg-gray-200 dark:bg-gray-900', className)} > diff --git a/src/components/ui/card/card.tsx b/src/components/ui/card/card.tsx index 7da58e758..a4bb389a1 100644 --- a/src/components/ui/card/card.tsx +++ b/src/components/ui/card/card.tsx @@ -72,7 +72,7 @@ const CardHeader: React.FC = ({ className, children, backHref, onBa return ( - + {intl.formatMessage(messages.back)} ); diff --git a/src/components/ui/carousel/carousel.tsx b/src/components/ui/carousel/carousel.tsx index da94f30d9..0bece264c 100644 --- a/src/components/ui/carousel/carousel.tsx +++ b/src/components/ui/carousel/carousel.tsx @@ -68,7 +68,7 @@ const Carousel: React.FC = (props): JSX.Element => { disabled={!hasPrevPage || isDisabled} > @@ -100,7 +100,7 @@ const Carousel: React.FC = (props): JSX.Element => { disabled={!hasNextPage || isDisabled} > diff --git a/src/components/ui/emoji-selector/emoji-selector.tsx b/src/components/ui/emoji-selector/emoji-selector.tsx index 2876aa0a4..114f94d96 100644 --- a/src/components/ui/emoji-selector/emoji-selector.tsx +++ b/src/components/ui/emoji-selector/emoji-selector.tsx @@ -134,7 +134,7 @@ const EmojiSelector: React.FC = ({ {all && ( )} diff --git a/src/components/ui/icon/svg-icon.test.tsx b/src/components/ui/icon/svg-icon.test.tsx index 8dc01be21..bd8c0a81b 100644 --- a/src/components/ui/icon/svg-icon.test.tsx +++ b/src/components/ui/icon/svg-icon.test.tsx @@ -1,4 +1,4 @@ -import IconCode from '@tabler/icons/code.svg'; +import IconCode from '@tabler/icons/outline/code.svg'; import React from 'react'; import { render, screen } from 'soapbox/jest/test-helpers'; diff --git a/src/components/ui/input/input.tsx b/src/components/ui/input/input.tsx index e1a069dd0..9d23b62a2 100644 --- a/src/components/ui/input/input.tsx +++ b/src/components/ui/input/input.tsx @@ -123,7 +123,7 @@ const Input = React.forwardRef( className='h-full px-2 text-gray-700 hover:text-gray-500 focus:ring-2 focus:ring-primary-500 dark:text-gray-600 dark:hover:text-gray-400' > diff --git a/src/components/ui/modal/modal.tsx b/src/components/ui/modal/modal.tsx index 5d17d6f67..8747cc4f0 100644 --- a/src/components/ui/modal/modal.tsx +++ b/src/components/ui/modal/modal.tsx @@ -65,7 +65,7 @@ const Modal = React.forwardRef(({ cancelAction, cancelText, children, - closeIcon = require('@tabler/icons/x.svg'), + closeIcon = require('@tabler/icons/outline/x.svg'), closePosition = 'right', confirmationAction, confirmationDisabled, @@ -107,7 +107,7 @@ const Modal = React.forwardRef(({ > {onBack && ( = ({ onRemoveItem(i)} title={intl.formatMessage(messages.remove)} /> diff --git a/src/components/ui/tag-input/tag.tsx b/src/components/ui/tag-input/tag.tsx index df4fb82fa..d6bf05c75 100644 --- a/src/components/ui/tag-input/tag.tsx +++ b/src/components/ui/tag-input/tag.tsx @@ -18,7 +18,7 @@ const Tag: React.FC = ({ tag, onDelete }) => { onDelete(tag)} /> diff --git a/src/components/ui/toast/toast.tsx b/src/components/ui/toast/toast.tsx index af6509b9c..bd6412da9 100644 --- a/src/components/ui/toast/toast.tsx +++ b/src/components/ui/toast/toast.tsx @@ -42,7 +42,7 @@ const Toast = (props: IToast) => { case 'success': return ( @@ -50,7 +50,7 @@ const Toast = (props: IToast) => { case 'info': return ( @@ -58,7 +58,7 @@ const Toast = (props: IToast) => { case 'error': return ( @@ -143,7 +143,7 @@ const Toast = (props: IToast) => { data-testid='toast-dismiss' > - + diff --git a/src/components/ui/widget/widget.tsx b/src/components/ui/widget/widget.tsx index 79c001674..3bd8d03ed 100644 --- a/src/components/ui/widget/widget.tsx +++ b/src/components/ui/widget/widget.tsx @@ -42,7 +42,7 @@ const Widget: React.FC = ({ title, children, onActionClick, - actionIcon = require('@tabler/icons/arrow-right.svg'), + actionIcon = require('@tabler/icons/outline/arrow-right.svg'), actionTitle, action, }): JSX.Element => { diff --git a/src/components/upload-progress.tsx b/src/components/upload-progress.tsx index 1b2e90e33..9260a8083 100644 --- a/src/components/upload-progress.tsx +++ b/src/components/upload-progress.tsx @@ -13,7 +13,7 @@ const UploadProgress: React.FC = ({ progress }) => { return ( diff --git a/src/components/upload.tsx b/src/components/upload.tsx index 4a7a85ee2..8308950cc 100644 --- a/src/components/upload.tsx +++ b/src/components/upload.tsx @@ -1,12 +1,12 @@ -import bookIcon from '@tabler/icons/book.svg'; -import fileCodeIcon from '@tabler/icons/file-code.svg'; -import fileSpreadsheetIcon from '@tabler/icons/file-spreadsheet.svg'; -import fileTextIcon from '@tabler/icons/file-text.svg'; -import fileZipIcon from '@tabler/icons/file-zip.svg'; -import defaultIcon from '@tabler/icons/paperclip.svg'; -import presentationIcon from '@tabler/icons/presentation.svg'; -import xIcon from '@tabler/icons/x.svg'; -import zoomInIcon from '@tabler/icons/zoom-in.svg'; +import bookIcon from '@tabler/icons/outline/book.svg'; +import fileCodeIcon from '@tabler/icons/outline/file-code.svg'; +import fileSpreadsheetIcon from '@tabler/icons/outline/file-spreadsheet.svg'; +import fileTextIcon from '@tabler/icons/outline/file-text.svg'; +import fileZipIcon from '@tabler/icons/outline/file-zip.svg'; +import defaultIcon from '@tabler/icons/outline/paperclip.svg'; +import presentationIcon from '@tabler/icons/outline/presentation.svg'; +import xIcon from '@tabler/icons/outline/x.svg'; +import zoomInIcon from '@tabler/icons/outline/zoom-in.svg'; import clsx from 'clsx'; import { List as ImmutableList } from 'immutable'; import React, { useState } from 'react'; diff --git a/src/components/validation-checkmark.tsx b/src/components/validation-checkmark.tsx index 36069157c..cb4e06816 100644 --- a/src/components/validation-checkmark.tsx +++ b/src/components/validation-checkmark.tsx @@ -12,7 +12,7 @@ const ValidationCheckmark = ({ isValid, text }: IValidationCheckmark) => { return ( = ({ attachment, onOpenMedia }) => { const fileExtension = remoteURL.slice(fileExtensionLastIndex + 1).toUpperCase(); thumbnail = (
- + {fileExtension}
); @@ -112,7 +112,7 @@ const MediaItem: React.FC = ({ attachment, onOpenMedia }) => { if (!visible) { icon = ( - + ); } diff --git a/src/features/account-timeline/components/moved-note.tsx b/src/features/account-timeline/components/moved-note.tsx index 73de8875a..c8924cdbe 100644 --- a/src/features/account-timeline/components/moved-note.tsx +++ b/src/features/account-timeline/components/moved-note.tsx @@ -16,7 +16,7 @@ const MovedNote: React.FC = ({ from, to }) => (
diff --git a/src/features/account/components/header.tsx b/src/features/account/components/header.tsx index c9cae466c..acf474e4c 100644 --- a/src/features/account/components/header.tsx +++ b/src/features/account/components/header.tsx @@ -131,7 +131,7 @@ const Header: React.FC = ({ account }) => { dispatch(unblockAccount(account.id)); } else { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), heading: , message: @{account.acct} }} />, confirm: intl.formatMessage(messages.blockConfirm), @@ -187,7 +187,7 @@ const Header: React.FC = ({ account }) => { const onBlockDomain = (domain: string) => { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), heading: , message: {domain} }} />, confirm: intl.formatMessage(messages.blockDomainConfirm), @@ -291,7 +291,7 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.subscribeFeed), action: handleRssFeedClick, - icon: require('@tabler/icons/rss.svg'), + icon: require('@tabler/icons/outline/rss.svg'), }); } @@ -299,7 +299,7 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.share, { name: account.username }), action: handleShare, - icon: require('@tabler/icons/upload.svg'), + icon: require('@tabler/icons/outline/upload.svg'), }); } @@ -309,14 +309,14 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.profileExternal, { domain }), action: () => onProfileExternal(account.url), - icon: require('@tabler/icons/external-link.svg'), + icon: require('@tabler/icons/outline/external-link.svg'), }); } menu.push({ text: intl.formatMessage(messages.copy), action: handleCopy, - icon: require('@tabler/icons/clipboard-copy.svg'), + icon: require('@tabler/icons/outline/clipboard-copy.svg'), }); if (!ownAccount) return menu; @@ -325,7 +325,7 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(account.id === ownAccount.id ? messages.searchSelf : messages.search, { name: account.username }), action: onSearch, - icon: require('@tabler/icons/search.svg'), + icon: require('@tabler/icons/outline/search.svg'), }); } @@ -337,36 +337,36 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.edit_profile), to: '/settings/profile', - icon: require('@tabler/icons/user.svg'), + icon: require('@tabler/icons/outline/user.svg'), }); menu.push({ text: intl.formatMessage(messages.preferences), to: '/settings', - icon: require('@tabler/icons/settings.svg'), + icon: require('@tabler/icons/outline/settings.svg'), }); menu.push(null); menu.push({ text: intl.formatMessage(messages.mutes), to: '/mutes', - icon: require('@tabler/icons/circle-x.svg'), + icon: require('@tabler/icons/outline/circle-x.svg'), }); menu.push({ text: intl.formatMessage(messages.blocks), to: '/blocks', - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); } else { menu.push({ text: intl.formatMessage(messages.mention, { name: account.username }), action: onMention, - icon: require('@tabler/icons/at.svg'), + icon: require('@tabler/icons/outline/at.svg'), }); if (features.privacyScopes) { menu.push({ text: intl.formatMessage(messages.direct, { name: account.username }), action: onDirect, - icon: require('@tabler/icons/mail.svg'), + icon: require('@tabler/icons/outline/mail.svg'), }); } @@ -375,13 +375,13 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.hideReblogs, { name: account.username }), action: onReblogToggle, - icon: require('@tabler/icons/repeat.svg'), + icon: require('@tabler/icons/outline/repeat.svg'), }); } else { menu.push({ text: intl.formatMessage(messages.showReblogs, { name: account.username }), action: onReblogToggle, - icon: require('@tabler/icons/repeat.svg'), + icon: require('@tabler/icons/outline/repeat.svg'), }); } @@ -389,7 +389,7 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.add_or_remove_from_list), action: onAddToList, - icon: require('@tabler/icons/list.svg'), + icon: require('@tabler/icons/outline/list.svg'), }); } @@ -397,14 +397,14 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(account.relationship?.endorsed ? messages.unendorse : messages.endorse), action: onEndorseToggle, - icon: require('@tabler/icons/user-check.svg'), + icon: require('@tabler/icons/outline/user-check.svg'), }); } } else if (features.lists && features.unrestrictedLists) { menu.push({ text: intl.formatMessage(messages.add_or_remove_from_list), action: onAddToList, - icon: require('@tabler/icons/list.svg'), + icon: require('@tabler/icons/outline/list.svg'), }); } @@ -414,7 +414,7 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.removeFromFollowers), action: onRemoveFromFollowers, - icon: require('@tabler/icons/user-x.svg'), + icon: require('@tabler/icons/outline/user-x.svg'), }); } @@ -422,13 +422,13 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.unmute, { name: account.username }), action: onMute, - icon: require('@tabler/icons/circle-x.svg'), + icon: require('@tabler/icons/outline/circle-x.svg'), }); } else { menu.push({ text: intl.formatMessage(messages.mute, { name: account.username }), action: onMute, - icon: require('@tabler/icons/circle-x.svg'), + icon: require('@tabler/icons/outline/circle-x.svg'), }); } @@ -436,20 +436,20 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.unblock, { name: account.username }), action: onBlock, - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); } else { menu.push({ text: intl.formatMessage(messages.block, { name: account.username }), action: onBlock, - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); } menu.push({ text: intl.formatMessage(messages.report, { name: account.username }), action: onReport, - icon: require('@tabler/icons/flag.svg'), + icon: require('@tabler/icons/outline/flag.svg'), }); } @@ -462,13 +462,13 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.unblockDomain, { domain }), action: () => onUnblockDomain(domain), - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); } else { menu.push({ text: intl.formatMessage(messages.blockDomain, { domain }), action: () => onBlockDomain(domain), - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); } } @@ -479,7 +479,7 @@ const Header: React.FC = ({ account }) => { menu.push({ text: intl.formatMessage(messages.adminAccount, { name: account.username }), action: onModerate, - icon: require('@tabler/icons/gavel.svg'), + icon: require('@tabler/icons/outline/gavel.svg'), }); } @@ -566,7 +566,7 @@ const Header: React.FC = ({ account }) => { return ( createAndNavigateToChat.mutate(account.id)} title={intl.formatMessage(messages.chat, { name: account.username })} theme='outlined' @@ -578,7 +578,7 @@ const Header: React.FC = ({ account }) => { } else if (account.pleroma?.accepts_chat_messages) { return ( createAndNavigateToChat.mutate(account.id)} title={intl.formatMessage(messages.chat, { name: account.username })} theme='outlined' @@ -600,7 +600,7 @@ const Header: React.FC = ({ account }) => { return ( = ({ account }) => { {menu.length > 0 && ( { - + ); diff --git a/src/features/admin/domains.tsx b/src/features/admin/domains.tsx index 024cf750c..28f360e81 100644 --- a/src/features/admin/domains.tsx +++ b/src/features/admin/domains.tsx @@ -116,7 +116,7 @@ const Domains: React.FC = () => { diff --git a/src/features/aliases/index.tsx b/src/features/aliases/index.tsx index d77975360..1b6caab8b 100644 --- a/src/features/aliases/index.tsx +++ b/src/features/aliases/index.tsx @@ -79,7 +79,7 @@ const Aliases = () => { {alias}
- +
diff --git a/src/features/audio/index.tsx b/src/features/audio/index.tsx index 2885dea5b..62903f125 100644 --- a/src/features/audio/index.tsx +++ b/src/features/audio/index.tsx @@ -518,7 +518,7 @@ const Audio: React.FC = (props) => { className='player-button' onClick={togglePlay} > - +
= (props) => { download target='_blank' > - +
diff --git a/src/features/auth-login/components/consumer-button.tsx b/src/features/auth-login/components/consumer-button.tsx index 02003b8ca..feac5f75b 100644 --- a/src/features/auth-login/components/consumer-button.tsx +++ b/src/features/auth-login/components/consumer-button.tsx @@ -12,12 +12,12 @@ const messages = defineMessages({ /** Map between OAuth providers and brand icons. */ const BRAND_ICONS: Record = { - twitter: require('@tabler/icons/brand-twitter.svg'), - facebook: require('@tabler/icons/brand-facebook.svg'), - google: require('@tabler/icons/brand-google.svg'), - microsoft: require('@tabler/icons/brand-windows.svg'), - slack: require('@tabler/icons/brand-slack.svg'), - github: require('@tabler/icons/brand-github.svg'), + twitter: require('@tabler/icons/outline/brand-twitter.svg'), + facebook: require('@tabler/icons/outline/brand-facebook.svg'), + google: require('@tabler/icons/outline/brand-google.svg'), + microsoft: require('@tabler/icons/outline/brand-windows.svg'), + slack: require('@tabler/icons/outline/brand-slack.svg'), + github: require('@tabler/icons/outline/brand-github.svg'), }; interface IConsumerButton { @@ -29,7 +29,7 @@ const ConsumerButton: React.FC = ({ provider }) => { const intl = useIntl(); const dispatch = useAppDispatch(); - const icon = BRAND_ICONS[provider] || require('@tabler/icons/key.svg'); + const icon = BRAND_ICONS[provider] || require('@tabler/icons/outline/key.svg'); const handleClick = () => { dispatch(prepareRequest(provider)); diff --git a/src/features/auth-login/components/registration-form.tsx b/src/features/auth-login/components/registration-form.tsx index 92c0ff52a..781e2cdbf 100644 --- a/src/features/auth-login/components/registration-form.tsx +++ b/src/features/auth-login/components/registration-form.tsx @@ -143,7 +143,7 @@ const RegistrationForm: React.FC = ({ inviteToken }) => { ); dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/check.svg'), + icon: require('@tabler/icons/outline/check.svg'), heading: needsConfirmation ? intl.formatMessage(messages.needsConfirmationHeader) : needsApproval @@ -250,7 +250,7 @@ const RegistrationForm: React.FC = ({ inviteToken }) => { autoCorrect='off' autoCapitalize='off' pattern='^[a-zA-Z\d_-]+' - icon={require('@tabler/icons/at.svg')} + icon={require('@tabler/icons/outline/at.svg')} onChange={onUsernameChange} value={params.get('username', '')} required diff --git a/src/features/auth-token-list/index.tsx b/src/features/auth-token-list/index.tsx index abad1c23a..40ca864c5 100644 --- a/src/features/auth-token-list/index.tsx +++ b/src/features/auth-token-list/index.tsx @@ -27,7 +27,7 @@ const AuthToken: React.FC = ({ token, isCurrent }) => { const handleRevoke = () => { if (isCurrent) dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/alert-triangle.svg'), + icon: require('@tabler/icons/outline/alert-triangle.svg'), heading: intl.formatMessage(messages.revokeSessionHeading), message: intl.formatMessage(messages.revokeSessionMessage), confirm: intl.formatMessage(messages.revokeSessionConfirm), diff --git a/src/features/birthdays/account.tsx b/src/features/birthdays/account.tsx index 7d6aa32c7..33d14cf1b 100644 --- a/src/features/birthdays/account.tsx +++ b/src/features/birthdays/account.tsx @@ -36,7 +36,7 @@ const Account: React.FC = ({ accountId }) => { date: formattedBirthday, })} > - + {formattedBirthday} diff --git a/src/features/bookmark-folders/index.tsx b/src/features/bookmark-folders/index.tsx index 8ebed7b5c..0e3427bc7 100644 --- a/src/features/bookmark-folders/index.tsx +++ b/src/features/bookmark-folders/index.tsx @@ -40,7 +40,7 @@ const BookmarkFolders: React.FC = () => { to='/bookmarks/all' label={ - + } @@ -57,7 +57,7 @@ const BookmarkFolders: React.FC = () => { src={folder.emoji_url || undefined} className='h-5 w-5 flex-none' /> - ) : } + ) : } {folder.name} } diff --git a/src/features/bookmarks/index.tsx b/src/features/bookmarks/index.tsx index caedb5d0b..3522ede0a 100644 --- a/src/features/bookmarks/index.tsx +++ b/src/features/bookmarks/index.tsx @@ -91,12 +91,12 @@ const Bookmarks: React.FC = ({ params }) => { { text: intl.formatMessage(messages.editFolder), action: handleEditFolder, - icon: require('@tabler/icons/edit.svg'), + icon: require('@tabler/icons/outline/edit.svg'), }, { text: intl.formatMessage(messages.deleteFolder), action: handleDeleteFolder, - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), }, ] : []; @@ -104,7 +104,7 @@ const Bookmarks: React.FC = ({ params }) => { + } transparent > diff --git a/src/features/chats/components/chat-composer.tsx b/src/features/chats/components/chat-composer.tsx index bcacf9ccf..5ba1a76e9 100644 --- a/src/features/chats/components/chat-composer.tsx +++ b/src/features/chats/components/chat-composer.tsx @@ -230,7 +230,7 @@ const ChatComposer = React.forwardRef ) : null} = ({ chat, onClick }) => { }, })); }, - icon: require('@tabler/icons/logout.svg'), + icon: require('@tabler/icons/outline/logout.svg'), }], []); const handleKeyDown: React.KeyboardEventHandler = (event) => { @@ -124,7 +124,7 @@ const ChatListItem: React.FC = ({ chat, onClick }) => {
{ ) : ( - + {chat.message_expiration && ( {intl.formatMessage(messages.messageLifespan, { day: secondsToDays(chat.message_expiration) })} diff --git a/src/features/chats/components/chat-message.tsx b/src/features/chats/components/chat-message.tsx index d065e79a5..3498ecddf 100644 --- a/src/features/chats/components/chat-message.tsx +++ b/src/features/chats/components/chat-message.tsx @@ -159,7 +159,7 @@ const ChatMessage = (props: IChatMessage) => { menu.push({ text: intl.formatMessage(messages.copy), action: () => handleCopyText(chatMessage), - icon: require('@tabler/icons/copy.svg'), + icon: require('@tabler/icons/outline/copy.svg'), }); } @@ -167,7 +167,7 @@ const ChatMessage = (props: IChatMessage) => { menu.push({ text: intl.formatMessage(messages.delete), action: () => handleDeleteMessage.mutate(chatMessage.id), - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); } else { @@ -175,13 +175,13 @@ const ChatMessage = (props: IChatMessage) => { menu.push({ text: intl.formatMessage(messages.report), action: () => dispatch(initReport(ReportableEntities.CHAT_MESSAGE, chat.account, { chatMessage })), - icon: require('@tabler/icons/flag.svg'), + icon: require('@tabler/icons/outline/flag.svg'), }); } menu.push({ text: intl.formatMessage(messages.deleteForMe), action: () => handleDeleteMessage.mutate(chatMessage.id), - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); } @@ -222,7 +222,7 @@ const ChatMessage = (props: IChatMessage) => { })} > @@ -244,7 +244,7 @@ const ChatMessage = (props: IChatMessage) => { data-testid='chat-message-menu' > @@ -362,7 +362,7 @@ const ChatMessage = (props: IChatMessage) => { {isRead ? ( @@ -370,7 +370,7 @@ const ChatMessage = (props: IChatMessage) => { ) : ( diff --git a/src/features/chats/components/chat-page/components/chat-page-main.tsx b/src/features/chats/components/chat-page/components/chat-page-main.tsx index 6a9acd1e2..15178e0c7 100644 --- a/src/features/chats/components/chat-page/components/chat-page-main.tsx +++ b/src/features/chats/components/chat-page/components/chat-page-main.tsx @@ -120,7 +120,7 @@ const ChatPageMain = () => { history.push('/chats')} /> @@ -162,7 +162,7 @@ const ChatPageMain = () => { @@ -213,7 +213,7 @@ const ChatPageMain = () => { className='!px-0 hover:!bg-transparent' >
- + {intl.formatMessage(isBlocking ? messages.unblockUser : messages.blockUser, { acct: chat.account.acct })}
@@ -225,7 +225,7 @@ const ChatPageMain = () => { className='!px-0 hover:!bg-transparent' >
- + {intl.formatMessage(messages.leaveChat)}
diff --git a/src/features/chats/components/chat-page/components/chat-page-new.tsx b/src/features/chats/components/chat-page/components/chat-page-new.tsx index ed9535efd..0c7fa0a60 100644 --- a/src/features/chats/components/chat-page/components/chat-page-new.tsx +++ b/src/features/chats/components/chat-page/components/chat-page-new.tsx @@ -23,7 +23,7 @@ const ChatPageNew: React.FC = () => { history.push('/chats')} /> diff --git a/src/features/chats/components/chat-page/components/chat-page-settings.tsx b/src/features/chats/components/chat-page/components/chat-page-settings.tsx index d042b75ac..12f665420 100644 --- a/src/features/chats/components/chat-page/components/chat-page-settings.tsx +++ b/src/features/chats/components/chat-page/components/chat-page-settings.tsx @@ -50,7 +50,7 @@ const ChatPageSettings = () => { history.push('/chats')} /> diff --git a/src/features/chats/components/chat-page/components/chat-page-sidebar.tsx b/src/features/chats/components/chat-page/components/chat-page-sidebar.tsx index 6691acf5f..3f08e1a6b 100644 --- a/src/features/chats/components/chat-page/components/chat-page-sidebar.tsx +++ b/src/features/chats/components/chat-page/components/chat-page-sidebar.tsx @@ -42,13 +42,13 @@ const ChatPageSidebar = () => { diff --git a/src/features/chats/components/chat-pane/chat-pane.tsx b/src/features/chats/components/chat-pane/chat-pane.tsx index 81d1f0ad6..1f0dde8f8 100644 --- a/src/features/chats/components/chat-pane/chat-pane.tsx +++ b/src/features/chats/components/chat-pane/chat-pane.tsx @@ -111,7 +111,7 @@ const ChatPane = () => { toggleChatPane(); } }} - secondaryActionIcon={require('@tabler/icons/edit.svg')} + secondaryActionIcon={require('@tabler/icons/outline/edit.svg')} /> {isOpen ? renderBody() : null} diff --git a/src/features/chats/components/chat-search-input.tsx b/src/features/chats/components/chat-search-input.tsx index 23fbddf3a..703202ee1 100644 --- a/src/features/chats/components/chat-search-input.tsx +++ b/src/features/chats/components/chat-search-input.tsx @@ -34,7 +34,7 @@ const ChatSearchInput: React.FC = ({ value, onChange, onClear append={ ); diff --git a/src/features/chats/components/chat-widget/chat-pane-header.tsx b/src/features/chats/components/chat-widget/chat-pane-header.tsx index aa59cbc76..c338c481a 100644 --- a/src/features/chats/components/chat-widget/chat-pane-header.tsx +++ b/src/features/chats/components/chat-widget/chat-pane-header.tsx @@ -63,7 +63,7 @@ const ChatPaneHeader = (props: IChatPaneHeader) => { diff --git a/src/features/chats/components/chat-widget/chat-settings.tsx b/src/features/chats/components/chat-widget/chat-settings.tsx index 0e62f3cfd..e1b1cabf6 100644 --- a/src/features/chats/components/chat-widget/chat-settings.tsx +++ b/src/features/chats/components/chat-widget/chat-settings.tsx @@ -95,7 +95,7 @@ const ChatSettings = () => { @@ -136,13 +136,13 @@ const ChatSettings = () => { {features.chatsDelete && ( )} diff --git a/src/features/chats/components/chat-widget/chat-window.tsx b/src/features/chats/components/chat-widget/chat-window.tsx index 66c02397f..72b7d81e6 100644 --- a/src/features/chats/components/chat-widget/chat-window.tsx +++ b/src/features/chats/components/chat-widget/chat-window.tsx @@ -72,7 +72,7 @@ const ChatWindow = () => { {isOpen && ( @@ -107,7 +107,7 @@ const ChatWindow = () => { } secondaryAction={secondaryAction()} - secondaryActionIcon={isOpen ? require('@tabler/icons/info-circle.svg') : require('@tabler/icons/edit.svg')} + secondaryActionIcon={isOpen ? require('@tabler/icons/outline/info-circle.svg') : require('@tabler/icons/outline/edit.svg')} isToggleable={!isOpen} isOpen={isOpen} onToggle={toggleChatPane} diff --git a/src/features/chats/components/chat-widget/headers/chat-search-header.tsx b/src/features/chats/components/chat-widget/headers/chat-search-header.tsx index 15b0c6a4b..791dced52 100644 --- a/src/features/chats/components/chat-widget/headers/chat-search-header.tsx +++ b/src/features/chats/components/chat-widget/headers/chat-search-header.tsx @@ -26,7 +26,7 @@ const ChatSearchHeader = () => { }} > diff --git a/src/features/compose/components/compose-form.tsx b/src/features/compose/components/compose-form.tsx index 45771dd94..79946dcf6 100644 --- a/src/features/compose/components/compose-form.tsx +++ b/src/features/compose/components/compose-form.tsx @@ -231,10 +231,10 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab if (isEditing) { publishText = intl.formatMessage(messages.saveChanges); } else if (privacy === 'direct') { - publishIcon = require('@tabler/icons/mail.svg'); + publishIcon = require('@tabler/icons/outline/mail.svg'); publishText = intl.formatMessage(messages.message); } else if (privacy === 'private') { - publishIcon = require('@tabler/icons/lock.svg'); + publishIcon = require('@tabler/icons/outline/lock.svg'); publishText = intl.formatMessage(messages.publish); } else { publishText = privacy !== 'unlisted' ? intl.formatMessage(messages.publishLoud, { publish: intl.formatMessage(messages.publish) }) : intl.formatMessage(messages.publish); diff --git a/src/features/compose/components/markdown-button.tsx b/src/features/compose/components/markdown-button.tsx index e5267fc74..daedd132b 100644 --- a/src/features/compose/components/markdown-button.tsx +++ b/src/features/compose/components/markdown-button.tsx @@ -25,7 +25,7 @@ const MarkdownButton: React.FC = ({ composeId }) => { return ( = ({ composeId, disabled }) => { return ( = ({ const [placement, setPlacement] = useState('bottom'); const options = [ - { icon: require('@tabler/icons/world.svg'), value: 'public', text: intl.formatMessage(messages.public_short), meta: intl.formatMessage(messages.public_long) }, - { icon: require('@tabler/icons/lock-open.svg'), value: 'unlisted', text: intl.formatMessage(messages.unlisted_short), meta: intl.formatMessage(messages.unlisted_long) }, - { icon: require('@tabler/icons/lock.svg'), value: 'private', text: intl.formatMessage(messages.private_short), meta: intl.formatMessage(messages.private_long) }, - { icon: require('@tabler/icons/mail.svg'), value: 'direct', text: intl.formatMessage(messages.direct_short), meta: intl.formatMessage(messages.direct_long) }, + { icon: require('@tabler/icons/outline/world.svg'), value: 'public', text: intl.formatMessage(messages.public_short), meta: intl.formatMessage(messages.public_long) }, + { icon: require('@tabler/icons/outline/lock-open.svg'), value: 'unlisted', text: intl.formatMessage(messages.unlisted_short), meta: intl.formatMessage(messages.unlisted_long) }, + { icon: require('@tabler/icons/outline/lock.svg'), value: 'private', text: intl.formatMessage(messages.private_short), meta: intl.formatMessage(messages.private_long) }, + { icon: require('@tabler/icons/outline/mail.svg'), value: 'direct', text: intl.formatMessage(messages.direct_short), meta: intl.formatMessage(messages.direct_long) }, ]; const onChange = (value: string | null) => value && dispatch(changeComposeVisibility(composeId, value)); diff --git a/src/features/compose/components/reply-indicator.tsx b/src/features/compose/components/reply-indicator.tsx index b5153c674..4ed3db70e 100644 --- a/src/features/compose/components/reply-indicator.tsx +++ b/src/features/compose/components/reply-indicator.tsx @@ -29,7 +29,7 @@ const ReplyIndicator: React.FC = ({ className, status, hideActi if (!hideActions && onCancel) { actions = { onActionClick: handleClick, - actionIcon: require('@tabler/icons/x.svg'), + actionIcon: require('@tabler/icons/outline/x.svg'), actionAlignment: 'top', actionTitle: 'Dismiss', }; diff --git a/src/features/compose/components/schedule-button.tsx b/src/features/compose/components/schedule-button.tsx index fcc7f17a3..cf4e8bbbf 100644 --- a/src/features/compose/components/schedule-button.tsx +++ b/src/features/compose/components/schedule-button.tsx @@ -39,7 +39,7 @@ const ScheduleButton: React.FC = ({ composeId, disabled }) => { return ( = ({ composeId }) => { diff --git a/src/features/compose/components/search-results.tsx b/src/features/compose/components/search-results.tsx index 096f24a93..362e4abe7 100644 --- a/src/features/compose/components/search-results.tsx +++ b/src/features/compose/components/search-results.tsx @@ -201,7 +201,7 @@ const SearchResults = () => { <> {filterByAccount ? ( - + { const makeMenu = () => [ { text: intl.formatMessage(messages.action, { query: value }), - icon: require('@tabler/icons/search.svg'), + icon: require('@tabler/icons/outline/search.svg'), action: handleSubmit, }, ]; @@ -166,12 +166,12 @@ const Search = (props: ISearch) => { onClick={handleClear} > diff --git a/src/features/compose/components/spoiler-button.tsx b/src/features/compose/components/spoiler-button.tsx index da15689a0..235209a83 100644 --- a/src/features/compose/components/spoiler-button.tsx +++ b/src/features/compose/components/spoiler-button.tsx @@ -26,7 +26,7 @@ const SpoilerButton: React.FC = ({ composeId }) => { return ( = ({ const src = icon || ( onlyImages(attachmentTypes) - ? require('@tabler/icons/photo.svg') - : require('@tabler/icons/paperclip.svg') + ? require('@tabler/icons/outline/photo.svg') + : require('@tabler/icons/outline/paperclip.svg') ); return ( diff --git a/src/features/crypto-donate/components/crypto-address.tsx b/src/features/crypto-donate/components/crypto-address.tsx index 953ca5989..0c07387eb 100644 --- a/src/features/crypto-donate/components/crypto-address.tsx +++ b/src/features/crypto-donate/components/crypto-address.tsx @@ -42,12 +42,12 @@ const CryptoAddress: React.FC = (props): JSX.Element => { - + {explorerUrl && ( - + )} diff --git a/src/features/crypto-donate/components/detailed-crypto-address.tsx b/src/features/crypto-donate/components/detailed-crypto-address.tsx index b0634f07a..554c05ade 100644 --- a/src/features/crypto-donate/components/detailed-crypto-address.tsx +++ b/src/features/crypto-donate/components/detailed-crypto-address.tsx @@ -30,7 +30,7 @@ const DetailedCryptoAddress: React.FC = ({ address, tick
{title || ticker.toUpperCase()}
{explorerUrl && - + }
diff --git a/src/features/developers/developers-menu.tsx b/src/features/developers/developers-menu.tsx index 62744aa09..185f289b2 100644 --- a/src/features/developers/developers-menu.tsx +++ b/src/features/developers/developers-menu.tsx @@ -57,7 +57,7 @@ const Developers: React.FC = () => {
- + @@ -65,7 +65,7 @@ const Developers: React.FC = () => { - + @@ -73,7 +73,7 @@ const Developers: React.FC = () => { - + @@ -81,7 +81,7 @@ const Developers: React.FC = () => { - + @@ -89,7 +89,7 @@ const Developers: React.FC = () => { - + @@ -97,7 +97,7 @@ const Developers: React.FC = () => { - + @@ -105,7 +105,7 @@ const Developers: React.FC = () => { - + @@ -113,7 +113,7 @@ const Developers: React.FC = () => { - + diff --git a/src/features/developers/service-worker-info.tsx b/src/features/developers/service-worker-info.tsx index d5c8e22da..362189c3e 100644 --- a/src/features/developers/service-worker-info.tsx +++ b/src/features/developers/service-worker-info.tsx @@ -120,7 +120,7 @@ const ServiceWorkerInfo: React.FC = () => { {url} diff --git a/src/features/edit-identity/index.tsx b/src/features/edit-identity/index.tsx index c5dc68ab3..2d65bd205 100644 --- a/src/features/edit-identity/index.tsx +++ b/src/features/edit-identity/index.tsx @@ -110,7 +110,7 @@ const UsernameInput: React.FC> = (props) => { placeholder={intl.formatMessage(messages.username)} append={( - + {instance.domain} )} diff --git a/src/features/edit-profile/components/avatar-picker.tsx b/src/features/edit-profile/components/avatar-picker.tsx index ab06c522c..a973ec302 100644 --- a/src/features/edit-profile/components/avatar-picker.tsx +++ b/src/features/edit-profile/components/avatar-picker.tsx @@ -43,7 +43,7 @@ const AvatarPicker = React.forwardRef(({ classNam })} > diff --git a/src/features/edit-profile/components/header-picker.tsx b/src/features/edit-profile/components/header-picker.tsx index 3176876c6..fd60e79c6 100644 --- a/src/features/edit-profile/components/header-picker.tsx +++ b/src/features/edit-profile/components/header-picker.tsx @@ -55,7 +55,7 @@ const HeaderPicker = React.forwardRef(({ src, onC justifyContent='center' > @@ -76,7 +76,7 @@ const HeaderPicker = React.forwardRef(({ src, onC {onClear && src && ( = ({ status, theme = 'secondary' switch (event.join_state) { case 'accept': buttonLabel = ; - buttonIcon = require('@tabler/icons/check.svg'); + buttonIcon = require('@tabler/icons/outline/check.svg'); break; case 'pending': buttonLabel = ; break; case 'reject': buttonLabel = ; - buttonIcon = require('@tabler/icons/ban.svg'); + buttonIcon = require('@tabler/icons/outline/ban.svg'); buttonDisabled = true; break; default: diff --git a/src/features/event/components/event-date.tsx b/src/features/event/components/event-date.tsx index 081b79c9a..978f49213 100644 --- a/src/features/event/components/event-date.tsx +++ b/src/features/event/components/event-date.tsx @@ -50,7 +50,7 @@ const EventDate: React.FC = ({ status }) => { return ( - + {date} ); diff --git a/src/features/event/components/event-header.tsx b/src/features/event/components/event-header.tsx index 78aad74eb..6d09147fb 100644 --- a/src/features/event/components/event-header.tsx +++ b/src/features/event/components/event-header.tsx @@ -140,7 +140,7 @@ const EventHeader: React.FC = ({ status }) => { const handleDeleteClick = () => { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: intl.formatMessage(messages.deleteHeading), message: intl.formatMessage(messages.deleteMessage), confirm: intl.formatMessage(messages.deleteConfirm), @@ -166,7 +166,7 @@ const EventHeader: React.FC = ({ status }) => { const handleBlockClick = () => { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), heading: , message: @{account.acct} }} />, confirm: intl.formatMessage(messages.blockConfirm), @@ -206,12 +206,12 @@ const EventHeader: React.FC = ({ status }) => { { text: intl.formatMessage(messages.exportIcs), action: handleExportClick, - icon: require('@tabler/icons/calendar-plus.svg'), + icon: require('@tabler/icons/outline/calendar-plus.svg'), }, { text: intl.formatMessage(messages.copy), action: handleCopy, - icon: require('@tabler/icons/link.svg'), + icon: require('@tabler/icons/outline/link.svg'), }, ]; @@ -219,7 +219,7 @@ const EventHeader: React.FC = ({ status }) => { menu.push({ text: intl.formatMessage(messages.external, { domain }), action: handleExternalClick, - icon: require('@tabler/icons/external-link.svg'), + icon: require('@tabler/icons/outline/external-link.svg'), }); } @@ -229,7 +229,7 @@ const EventHeader: React.FC = ({ status }) => { menu.push({ text: intl.formatMessage(status.bookmarked ? messages.unbookmark : messages.bookmark), action: handleBookmarkClick, - icon: status.bookmarked ? require('@tabler/icons/bookmark-off.svg') : require('@tabler/icons/bookmark.svg'), + icon: status.bookmarked ? require('@tabler/icons/outline/bookmark-off.svg') : require('@tabler/icons/outline/bookmark.svg'), }); } @@ -237,14 +237,14 @@ const EventHeader: React.FC = ({ status }) => { menu.push({ text: intl.formatMessage(status.reblogged ? messages.unreblog : messages.reblog), action: handleReblogClick, - icon: require('@tabler/icons/repeat.svg'), + icon: require('@tabler/icons/outline/repeat.svg'), }); if (features.quotePosts) { menu.push({ text: intl.formatMessage(messages.quotePost), action: handleQuoteClick, - icon: require('@tabler/icons/quote.svg'), + icon: require('@tabler/icons/outline/quote.svg'), }); } } @@ -256,34 +256,34 @@ const EventHeader: React.FC = ({ status }) => { menu.push({ text: intl.formatMessage(status.pinned ? messages.unpin : messages.pin), action: handlePinClick, - icon: status.pinned ? require('@tabler/icons/pinned-off.svg') : require('@tabler/icons/pin.svg'), + icon: status.pinned ? require('@tabler/icons/outline/pinned-off.svg') : require('@tabler/icons/outline/pin.svg'), }); } menu.push({ text: intl.formatMessage(messages.delete), action: handleDeleteClick, - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); } else { menu.push({ text: intl.formatMessage(messages.mention, { name: username }), action: handleMentionClick, - icon: require('@tabler/icons/at.svg'), + icon: require('@tabler/icons/outline/at.svg'), }); if (status.getIn(['account', 'pleroma', 'accepts_chat_messages']) === true) { menu.push({ text: intl.formatMessage(messages.chat, { name: username }), action: handleChatClick, - icon: require('@tabler/icons/messages.svg'), + icon: require('@tabler/icons/outline/messages.svg'), }); } else if (features.privacyScopes) { menu.push({ text: intl.formatMessage(messages.direct, { name: username }), action: handleDirectClick, - icon: require('@tabler/icons/mail.svg'), + icon: require('@tabler/icons/outline/mail.svg'), }); } @@ -291,17 +291,17 @@ const EventHeader: React.FC = ({ status }) => { menu.push({ text: intl.formatMessage(messages.mute, { name: username }), action: handleMuteClick, - icon: require('@tabler/icons/circle-x.svg'), + icon: require('@tabler/icons/outline/circle-x.svg'), }); menu.push({ text: intl.formatMessage(messages.block, { name: username }), action: handleBlockClick, - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), }); menu.push({ text: intl.formatMessage(messages.report, { name: username }), action: handleReport, - icon: require('@tabler/icons/flag.svg'), + icon: require('@tabler/icons/outline/flag.svg'), }); } @@ -311,28 +311,28 @@ const EventHeader: React.FC = ({ status }) => { menu.push({ text: intl.formatMessage(messages.adminAccount, { name: account.username }), action: handleModerate, - icon: require('@tabler/icons/gavel.svg'), + icon: require('@tabler/icons/outline/gavel.svg'), }); if (isAdmin) { menu.push({ text: intl.formatMessage(messages.adminStatus), action: handleModerateStatus, - icon: require('@tabler/icons/pencil.svg'), + icon: require('@tabler/icons/outline/pencil.svg'), }); } menu.push({ text: intl.formatMessage(status.sensitive === false ? messages.markStatusSensitive : messages.markStatusNotSensitive), action: handleToggleStatusSensitivity, - icon: require('@tabler/icons/alert-triangle.svg'), + icon: require('@tabler/icons/outline/alert-triangle.svg'), }); if (account.id !== ownAccount?.id) { menu.push({ text: intl.formatMessage(messages.deleteStatus), action: handleDeleteStatus, - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), destructive: true, }); } @@ -381,7 +381,7 @@ const EventHeader: React.FC = ({ status }) => { = ({ status }) => { - + = ({ status }) => { - + = ({ status }) => { {event.location && ( - + {event.location.get('name')} diff --git a/src/features/event/event-information.tsx b/src/features/event/event-information.tsx index 11f6b9cb1..d84d6096b 100644 --- a/src/features/event/event-information.tsx +++ b/src/features/event/event-information.tsx @@ -102,7 +102,7 @@ const EventInformation: React.FC = ({ params }) => { - + {text} @@ -125,7 +125,7 @@ const EventInformation: React.FC = ({ params }) => { - + = ({ params }) => { {status.event.links.map(link => ( - + {(link.remote_url || link.url).replace(/^https?:\/\//, '')} diff --git a/src/features/events/components/event-carousel.tsx b/src/features/events/components/event-carousel.tsx index fe8225115..e6e25f604 100644 --- a/src/features/events/components/event-carousel.tsx +++ b/src/features/events/components/event-carousel.tsx @@ -59,7 +59,7 @@ const EventCarousel: React.FC = ({ statusIds, isLoading, emptyMe onClick={() => handleChangeIndex(index - 1)} className='flex h-8 w-8 items-center justify-center rounded-full bg-white/50 backdrop-blur dark:bg-gray-900/50' > - +
)} @@ -72,7 +72,7 @@ const EventCarousel: React.FC = ({ statusIds, isLoading, emptyMe onClick={() => handleChangeIndex(index + 1)} className='flex h-8 w-8 items-center justify-center rounded-full bg-white/50 backdrop-blur dark:bg-gray-900/50' > - + )} diff --git a/src/features/federation-restrictions/components/instance-restrictions.tsx b/src/features/federation-restrictions/components/instance-restrictions.tsx index 344dc766d..d33aa5a85 100644 --- a/src/features/federation-restrictions/components/instance-restrictions.tsx +++ b/src/features/federation-restrictions/components/instance-restrictions.tsx @@ -53,7 +53,7 @@ const InstanceRestrictions: React.FC = ({ remoteInstance if (followers_only) { items.push(( - + = ({ remoteInstance )); } else if (federated_timeline_removal) { items.push(( - + = ({ remoteInstance if (fullMediaRemoval) { items.push(( - + = ({ remoteInstance )); } else if (partialMediaRemoval) { items.push(( - + = ({ remoteInstance if (!fullMediaRemoval && media_nsfw) { items.push(( - + = ({ remoteInstance if (remoteInstance.federation.reject === true) { return ( - + = ({ remoteInstance } else if (hasRestrictions(remoteInstance)) { return ( <> - + = ({ remoteInstance ); } else { return ( - + = ({ host }) => { return ( diff --git a/src/features/group/components/group-header.tsx b/src/features/group/components/group-header.tsx index 21eb7e5dd..de70bc237 100644 --- a/src/features/group/components/group-header.tsx +++ b/src/features/group/components/group-header.tsx @@ -112,7 +112,7 @@ const GroupHeader: React.FC = ({ group }) => { className='flex h-32 w-full items-center justify-center bg-gray-200 md:rounded-t-xl lg:h-52 dark:bg-gray-800/30' > {isHeaderMissing ? ( - + ) : header} ); diff --git a/src/features/group/components/group-member-list-item.tsx b/src/features/group/components/group-member-list-item.tsx index 79be5ef50..eea6514f8 100644 --- a/src/features/group/components/group-member-list-item.tsx +++ b/src/features/group/components/group-member-list-item.tsx @@ -138,13 +138,13 @@ const GroupMemberListItem = (props: IGroupMemberListItem) => { if (isMemberUser) { items.push({ text: intl.formatMessage(messages.groupModPromoteMod, { role: GroupRoles.ADMIN }), - icon: require('@tabler/icons/briefcase.svg'), + icon: require('@tabler/icons/outline/briefcase.svg'), action: handleAdminAssignment, }); } else if (isMemberAdmin) { items.push({ text: intl.formatMessage(messages.groupModDemote, { role: GroupRoles.ADMIN, name: account.username }), - icon: require('@tabler/icons/briefcase.svg'), + icon: require('@tabler/icons/outline/briefcase.svg'), action: handleUserAssignment, destructive: true, }); @@ -159,14 +159,14 @@ const GroupMemberListItem = (props: IGroupMemberListItem) => { if (features.groupsKick) { items.push({ text: intl.formatMessage(messages.groupModKick, { name: account.username }), - icon: require('@tabler/icons/user-minus.svg'), + icon: require('@tabler/icons/outline/user-minus.svg'), action: handleKickFromGroup, }); } items.push({ text: intl.formatMessage(messages.groupModBlock, { name: account.username }), - icon: require('@tabler/icons/ban.svg'), + icon: require('@tabler/icons/outline/ban.svg'), action: handleBlockFromGroup, destructive: true, }); diff --git a/src/features/group/components/group-options-button.tsx b/src/features/group/components/group-options-button.tsx index 6b35d03d7..c52bc1eaa 100644 --- a/src/features/group/components/group-options-button.tsx +++ b/src/features/group/components/group-options-button.tsx @@ -98,7 +98,7 @@ const GroupOptionsButton = ({ group }: IGroupActionButton) => { if (canShare) { items.push({ text: intl.formatMessage(messages.share), - icon: require('@tabler/icons/share.svg'), + icon: require('@tabler/icons/outline/share.svg'), action: handleShare, }); } @@ -106,7 +106,7 @@ const GroupOptionsButton = ({ group }: IGroupActionButton) => { if (isInGroup) { items.push({ text: isMuting ? intl.formatMessage(messages.unmute) : intl.formatMessage(messages.mute), - icon: require('@tabler/icons/volume-3.svg'), + icon: require('@tabler/icons/outline/volume-3.svg'), action: isMuting ? handleUnmute : handleMute, }); } @@ -114,7 +114,7 @@ const GroupOptionsButton = ({ group }: IGroupActionButton) => { if (isMember || isAdmin) { items.push({ text: intl.formatMessage(messages.report), - icon: require('@tabler/icons/flag.svg'), + icon: require('@tabler/icons/outline/flag.svg'), action: () => dispatch(initReport(ReportableEntities.GROUP, account as Account, { group })), }); } @@ -123,7 +123,7 @@ const GroupOptionsButton = ({ group }: IGroupActionButton) => { items.push(null); items.push({ text: intl.formatMessage(messages.leave), - icon: require('@tabler/icons/logout.svg'), + icon: require('@tabler/icons/outline/logout.svg'), action: handleLeave, }); } @@ -138,7 +138,7 @@ const GroupOptionsButton = ({ group }: IGroupActionButton) => { return ( ( @@ -49,8 +49,8 @@ const GroupPrivacy = ({ group }: IGroupPolicy) => ( className='h-4 w-4' src={ group.locked - ? require('@tabler/icons/lock.svg') - : require('@tabler/icons/world.svg') + ? require('@tabler/icons/outline/lock.svg') + : require('@tabler/icons/outline/world.svg') } /> diff --git a/src/features/group/components/group-relationship.tsx b/src/features/group/components/group-relationship.tsx index 51782f46b..ff6e5ee5c 100644 --- a/src/features/group/components/group-relationship.tsx +++ b/src/features/group/components/group-relationship.tsx @@ -28,8 +28,8 @@ const GroupRelationship = ({ group }: IGroupRelationship) => { className='h-4 w-4' src={ isOwner - ? require('@tabler/icons/users.svg') - : require('@tabler/icons/gavel.svg') + ? require('@tabler/icons/outline/users.svg') + : require('@tabler/icons/outline/gavel.svg') } /> diff --git a/src/features/group/components/group-tag-list-item.tsx b/src/features/group/components/group-tag-list-item.tsx index 38db498b9..45a5dc82f 100644 --- a/src/features/group/components/group-tag-list-item.tsx +++ b/src/features/group/components/group-tag-list-item.tsx @@ -87,7 +87,7 @@ const GroupTagListItem = (props: IGroupMemberListItem) => { if (!isOwner && tag.pinned) { return ( @@ -112,8 +112,8 @@ const GroupTagListItem = (props: IGroupMemberListItem) => { theme='transparent' src={ tag.pinned ? - require('@tabler/icons/pin-filled.svg') : - require('@tabler/icons/pin.svg') + require('@tabler/icons/filled/pin.svg') : + require('@tabler/icons/outline/pin.svg') } iconClassName='h-5 w-5 text-primary-500 dark:text-accent-blue' data-testid='pin-icon' @@ -128,7 +128,7 @@ const GroupTagListItem = (props: IGroupMemberListItem) => { @@ -181,8 +181,8 @@ const GroupTagListItem = (props: IGroupMemberListItem) => { theme='transparent' src={ tag.visible ? - require('@tabler/icons/eye.svg') : - require('@tabler/icons/eye-off.svg') + require('@tabler/icons/outline/eye.svg') : + require('@tabler/icons/outline/eye-off.svg') } iconClassName='h-5 w-5 text-primary-500 dark:text-accent-blue' /> diff --git a/src/features/group/edit-group.tsx b/src/features/group/edit-group.tsx index b34eca26e..aa80d7ce5 100644 --- a/src/features/group/edit-group.tsx +++ b/src/features/group/edit-group.tsx @@ -115,7 +115,7 @@ const EditGroup: React.FC = ({ params: { groupId } }) => { placeholder={intl.formatMessage(messages.groupNamePlaceholder)} maxLength={maxName} {...displayName} - append={} + append={} disabled /> diff --git a/src/features/group/group-tag-timeline.tsx b/src/features/group/group-tag-timeline.tsx index 02b7d9aca..085302b66 100644 --- a/src/features/group/group-tag-timeline.tsx +++ b/src/features/group/group-tag-timeline.tsx @@ -50,7 +50,7 @@ const GroupTagTimeline: React.FC = (props) => {
diff --git a/src/features/group/group-tags.tsx b/src/features/group/group-tags.tsx index e3b65b5f4..fcc37798f 100644 --- a/src/features/group/group-tags.tsx +++ b/src/features/group/group-tags.tsx @@ -41,7 +41,7 @@ const GroupTopics: React.FC = (props) => {
diff --git a/src/features/group/group-timeline.tsx b/src/features/group/group-timeline.tsx index e1d11f0e3..d30506b6a 100644 --- a/src/features/group/group-timeline.tsx +++ b/src/features/group/group-timeline.tsx @@ -110,7 +110,7 @@ const GroupTimeline: React.FC = (props) => {
diff --git a/src/features/group/manage-group.tsx b/src/features/group/manage-group.tsx index c669c026f..1fa02f174 100644 --- a/src/features/group/manage-group.tsx +++ b/src/features/group/manage-group.tsx @@ -62,7 +62,7 @@ const ManageGroup: React.FC = ({ params }) => { const onDeleteGroup = () => dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: intl.formatMessage(messages.deleteHeading), message: intl.formatMessage(messages.deleteMessage), confirm: intl.formatMessage(messages.deleteConfirm), diff --git a/src/features/groups/components/discover/group-list-item.tsx b/src/features/groups/components/discover/group-list-item.tsx index f092c3a20..a101a45cd 100644 --- a/src/features/groups/components/discover/group-list-item.tsx +++ b/src/features/groups/components/discover/group-list-item.tsx @@ -39,7 +39,7 @@ const GroupListItem = (props: IGroupListItem) => { diff --git a/src/features/groups/components/discover/layout-buttons.tsx b/src/features/groups/components/discover/layout-buttons.tsx index 7e116408f..fce0ad711 100644 --- a/src/features/groups/components/discover/layout-buttons.tsx +++ b/src/features/groups/components/discover/layout-buttons.tsx @@ -20,7 +20,7 @@ const LayoutButtons = ({ layout, onSelect }: ILayoutButtons) => ( onClick={() => onSelect(GroupLayout.LIST)} > ( onClick={() => onSelect(GroupLayout.GRID)} > {
diff --git a/src/features/groups/discover.tsx b/src/features/groups/discover.tsx index f91c3ca48..0bb5af179 100644 --- a/src/features/groups/discover.tsx +++ b/src/features/groups/discover.tsx @@ -36,7 +36,7 @@ const Discover: React.FC = () => { {isSearching ? ( { append={ diff --git a/src/features/onboarding/steps/completed-step.tsx b/src/features/onboarding/steps/completed-step.tsx index 082defb4d..813eff22a 100644 --- a/src/features/onboarding/steps/completed-step.tsx +++ b/src/features/onboarding/steps/completed-step.tsx @@ -7,7 +7,7 @@ const CompletedStep = ({ onComplete }: { onComplete: () => void }) => ( - + diff --git a/src/features/onboarding/steps/cover-photo-selection-step.tsx b/src/features/onboarding/steps/cover-photo-selection-step.tsx index 1e1c0107b..b09b89f6a 100644 --- a/src/features/onboarding/steps/cover-photo-selection-step.tsx +++ b/src/features/onboarding/steps/cover-photo-selection-step.tsx @@ -103,7 +103,7 @@ const CoverPhotoSelectionStep = ({ onNext }: { onNext: () => void }) => { })} disabled={isSubmitting} > - + diff --git a/src/features/onboarding/steps/fediverse-step.tsx b/src/features/onboarding/steps/fediverse-step.tsx index 87afc3680..c66f34eb7 100644 --- a/src/features/onboarding/steps/fediverse-step.tsx +++ b/src/features/onboarding/steps/fediverse-step.tsx @@ -13,7 +13,7 @@ const FediverseStep = ({ onNext }: { onNext: () => void }) => { - + { } action={dismissExplanationBox} - actionIcon={require('@tabler/icons/x.svg')} + actionIcon={require('@tabler/icons/outline/x.svg')} actionLabel={intl.formatMessage(messages.dismiss)} expanded={explanationBoxExpanded} onToggle={toggleExplanationBox} diff --git a/src/features/remote-timeline/index.tsx b/src/features/remote-timeline/index.tsx index a50875531..ca996bb13 100644 --- a/src/features/remote-timeline/index.tsx +++ b/src/features/remote-timeline/index.tsx @@ -53,7 +53,7 @@ const RemoteTimeline: React.FC = ({ params }) => { {!pinned && ( - + = ({ composeId, accountId, author }) => { let button; if (added) { - button = ; + button = ; } else { - button = ; + button = ; } return ( diff --git a/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx b/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx index c4ea472ba..9b32f8330 100644 --- a/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx +++ b/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx @@ -34,7 +34,7 @@ const ScheduledStatusActionBar: React.FC = ({ status dispatch(cancelScheduledStatus(status.id)); } else { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/calendar-stats.svg'), + icon: require('@tabler/icons/outline/calendar-stats.svg'), heading: intl.formatMessage(messages.deleteHeading), message: intl.formatMessage(messages.deleteMessage), confirm: intl.formatMessage(messages.deleteConfirm), @@ -49,7 +49,7 @@ const ScheduledStatusActionBar: React.FC = ({ status diff --git a/src/features/status/components/detailed-status.tsx b/src/features/status/components/detailed-status.tsx index 73948580f..e421ee35b 100644 --- a/src/features/status/components/detailed-status.tsx +++ b/src/features/status/components/detailed-status.tsx @@ -57,7 +57,7 @@ const DetailedStatus: React.FC = ({ avatarSize={42} icon={ } @@ -109,9 +109,9 @@ const DetailedStatus: React.FC = ({ } if (actualStatus.visibility === 'direct') { - statusTypeIcon = ; + statusTypeIcon = ; } else if (actualStatus.visibility === 'private') { - statusTypeIcon = ; + statusTypeIcon = ; } return ( diff --git a/src/features/theme-editor/index.tsx b/src/features/theme-editor/index.tsx index e6c624b35..66604a109 100644 --- a/src/features/theme-editor/index.tsx +++ b/src/features/theme-editor/index.tsx @@ -208,15 +208,15 @@ const ThemeEditor: React.FC = () => { items={[{ text: intl.formatMessage(messages.restore), action: restoreDefaultTheme, - icon: require('@tabler/icons/refresh.svg'), + icon: require('@tabler/icons/outline/refresh.svg'), }, { text: intl.formatMessage(messages.import), action: importTheme, - icon: require('@tabler/icons/upload.svg'), + icon: require('@tabler/icons/outline/upload.svg'), }, { text: intl.formatMessage(messages.export), action: exportTheme, - icon: require('@tabler/icons/download.svg'), + icon: require('@tabler/icons/outline/download.svg'), }]} /> @@ -74,7 +74,7 @@ const GroupFAB: React.FC = () => { diff --git a/src/features/ui/components/instance-info-panel.tsx b/src/features/ui/components/instance-info-panel.tsx index 16093516f..26a52df84 100644 --- a/src/features/ui/components/instance-info-panel.tsx +++ b/src/features/ui/components/instance-info-panel.tsx @@ -41,7 +41,7 @@ const InstanceInfoPanel: React.FC = ({ host }) => { ); diff --git a/src/features/ui/components/instance-moderation-panel.tsx b/src/features/ui/components/instance-moderation-panel.tsx index cd9055a21..75cb34b05 100644 --- a/src/features/ui/components/instance-moderation-panel.tsx +++ b/src/features/ui/components/instance-moderation-panel.tsx @@ -35,7 +35,7 @@ const InstanceModerationPanel: React.FC = ({ host }) = return [{ text: intl.formatMessage(messages.editFederation), action: handleEditFederation, - icon: require('@tabler/icons/edit.svg'), + icon: require('@tabler/icons/outline/edit.svg'), }]; }; @@ -45,7 +45,7 @@ const InstanceModerationPanel: React.FC = ({ host }) = } action={account?.admin ? ( - + ) : undefined} > diff --git a/src/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx b/src/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx index 2e7bcdb7e..76ea614d9 100644 --- a/src/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx +++ b/src/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx @@ -172,7 +172,7 @@ const AccountModerationModal: React.FC = ({ onClose, ac {features.adminFE && ( - diff --git a/src/features/ui/components/modals/boost-modal.tsx b/src/features/ui/components/modals/boost-modal.tsx index df7d530e4..bc4d73177 100644 --- a/src/features/ui/components/modals/boost-modal.tsx +++ b/src/features/ui/components/modals/boost-modal.tsx @@ -38,7 +38,7 @@ const BoostModal: React.FC = ({ status, onReblog, onClose }) => { - Shift + }} /> + Shift + }} /> diff --git a/src/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx b/src/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx index 0e25d4119..8f20ce69c 100644 --- a/src/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx +++ b/src/features/ui/components/modals/compose-event-modal/compose-event-modal.tsx @@ -137,7 +137,7 @@ const ComposeEventModal: React.FC = ({ onClose }) => { dispatch((dispatch, getState) => { if (checkEventComposeContent(getState().compose_event)) { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: id ? : , @@ -177,12 +177,12 @@ const ComposeEventModal: React.FC = ({ onClose }) => { const renderLocation = () => location && ( - + {location.description} {[location.street, location.locality, location.country].filter(val => val?.trim()).join(' · ')} - onChangeLocation(null)} /> + onChangeLocation(null)} /> ); @@ -213,7 +213,7 @@ const ComposeEventModal: React.FC = ({ onClose }) => { {banner ? ( <> - + ) : ( diff --git a/src/features/ui/components/modals/compose-event-modal/upload-button.tsx b/src/features/ui/components/modals/compose-event-modal/upload-button.tsx index be9f59818..ab377d62f 100644 --- a/src/features/ui/components/modals/compose-event-modal/upload-button.tsx +++ b/src/features/ui/components/modals/compose-event-modal/upload-button.tsx @@ -28,7 +28,7 @@ const UploadButton: React.FC = ({ disabled, onSelectFile }) => { return ( diff --git a/src/features/ui/components/modals/compose-modal.tsx b/src/features/ui/components/modals/compose-modal.tsx index 83e471475..b5fc73c33 100644 --- a/src/features/ui/components/modals/compose-modal.tsx +++ b/src/features/ui/components/modals/compose-modal.tsx @@ -36,7 +36,7 @@ const ComposeModal: React.FC = ({ onClose, composeId = 'compose-m const onClickClose = () => { if (checkComposeContent(compose)) { dispatch(openModal('CONFIRM', { - icon: require('@tabler/icons/trash.svg'), + icon: require('@tabler/icons/outline/trash.svg'), heading: statusId ? : , diff --git a/src/features/ui/components/modals/edit-bookmark-folder-modal.tsx b/src/features/ui/components/modals/edit-bookmark-folder-modal.tsx index 0acb130d5..e2a407829 100644 --- a/src/features/ui/components/modals/edit-bookmark-folder-modal.tsx +++ b/src/features/ui/components/modals/edit-bookmark-folder-modal.tsx @@ -58,7 +58,7 @@ const EmojiPicker: React.FC = ({ emoji, emojiUrl, ...props }) => { > {emoji ? - : } + : } {createPortal( diff --git a/src/features/ui/components/modals/event-map-modal.tsx b/src/features/ui/components/modals/event-map-modal.tsx index 5000c8fa7..2a16a84f3 100644 --- a/src/features/ui/components/modals/event-map-modal.tsx +++ b/src/features/ui/components/modals/event-map-modal.tsx @@ -64,7 +64,7 @@ const EventMapModal: React.FC = ({ onClose, statusId }) => { >
- diff --git a/src/features/ui/components/modals/landing-page-modal.tsx b/src/features/ui/components/modals/landing-page-modal.tsx index 8b451257d..cdb3c9bb8 100644 --- a/src/features/ui/components/modals/landing-page-modal.tsx +++ b/src/features/ui/components/modals/landing-page-modal.tsx @@ -38,7 +38,7 @@ const LandingPageModal: React.FC = ({ onClose }) => { target='_blank' className='flex items-center space-x-3 rounded-md p-3 hover:bg-gray-50 dark:hover:bg-gray-900/50' > - + {intl.formatMessage(messages.helpCenter)} diff --git a/src/features/ui/components/modals/manage-group-modal/steps/confirmation-step.tsx b/src/features/ui/components/modals/manage-group-modal/steps/confirmation-step.tsx index f9a032398..86972b83a 100644 --- a/src/features/ui/components/modals/manage-group-modal/steps/confirmation-step.tsx +++ b/src/features/ui/components/modals/manage-group-modal/steps/confirmation-step.tsx @@ -101,12 +101,12 @@ const ConfirmationStep: React.FC = ({ group }) => { {('share' in navigator) && ( - )} - diff --git a/src/features/ui/components/modals/media-modal.tsx b/src/features/ui/components/modals/media-modal.tsx index 6f78a8ed5..fe30f7247 100644 --- a/src/features/ui/components/modals/media-modal.tsx +++ b/src/features/ui/components/modals/media-modal.tsx @@ -255,7 +255,7 @@ const MediaModal: React.FC = (props) => { > = (props) => { = (props) => { {status && ( = (props) => { onClick={handlePrevClick} aria-label={intl.formatMessage(messages.previous)} > - +
)} @@ -318,7 +318,7 @@ const MediaModal: React.FC = (props) => { onClick={handleNextClick} aria-label={intl.formatMessage(messages.next)} > - + )} diff --git a/src/features/ui/components/modals/nostr-signup-modal/steps/keygen-step.tsx b/src/features/ui/components/modals/nostr-signup-modal/steps/keygen-step.tsx index 4fe7869c2..83d604fa7 100644 --- a/src/features/ui/components/modals/nostr-signup-modal/steps/keygen-step.tsx +++ b/src/features/ui/components/modals/nostr-signup-modal/steps/keygen-step.tsx @@ -53,7 +53,7 @@ const KeygenStep: React.FC = ({ onClose }) => { - diff --git a/src/features/ui/components/modals/reply-mentions-modal.tsx b/src/features/ui/components/modals/reply-mentions-modal.tsx index bb21d99ac..69ae41acd 100644 --- a/src/features/ui/components/modals/reply-mentions-modal.tsx +++ b/src/features/ui/components/modals/reply-mentions-modal.tsx @@ -33,7 +33,7 @@ const ReplyMentionsModal: React.FC = ({ composeId, onClose } onClose={onClickClose} - closeIcon={require('@tabler/icons/arrow-left.svg')} + closeIcon={require('@tabler/icons/outline/arrow-left.svg')} closePosition='left' >
diff --git a/src/features/ui/components/modals/report-modal/report-modal.tsx b/src/features/ui/components/modals/report-modal/report-modal.tsx index ea242e940..ce961d0fb 100644 --- a/src/features/ui/components/modals/report-modal/report-modal.tsx +++ b/src/features/ui/components/modals/report-modal/report-modal.tsx @@ -226,7 +226,7 @@ const ReportModal = ({ onClose }: IReportModal) => { } + label={} > {intl.formatMessage(messages.reportContext)} diff --git a/src/features/ui/components/modals/report-modal/steps/other-actions-step.tsx b/src/features/ui/components/modals/report-modal/steps/other-actions-step.tsx index 9db7a3bc1..8aaf7734c 100644 --- a/src/features/ui/components/modals/report-modal/steps/other-actions-step.tsx +++ b/src/features/ui/components/modals/report-modal/steps/other-actions-step.tsx @@ -65,7 +65,7 @@ const OtherActionsStep = ({ account }: IOtherActionsStep) => {
diff --git a/src/features/ui/components/who-to-follow-panel.tsx b/src/features/ui/components/who-to-follow-panel.tsx index c5ab68369..8b6486a08 100644 --- a/src/features/ui/components/who-to-follow-panel.tsx +++ b/src/features/ui/components/who-to-follow-panel.tsx @@ -52,7 +52,7 @@ const WhoToFollowPanel = ({ limit }: IWhoToFollowPanel) => { key={suggestion.account} // @ts-ignore: TS thinks `id` is passed to , but it isn't id={suggestion.account} - actionIcon={require('@tabler/icons/x.svg')} + actionIcon={require('@tabler/icons/outline/x.svg')} actionTitle={intl.formatMessage(messages.dismissSuggestion)} onActionClick={handleDismiss} /> diff --git a/src/features/video/index.tsx b/src/features/video/index.tsx index 1918fdef0..b9697f4ea 100644 --- a/src/features/video/index.tsx +++ b/src/features/video/index.tsx @@ -519,7 +519,7 @@ const Video: React.FC = ({ onClick={togglePlay} autoFocus={autoFocus} > - +
@@ -562,7 +562,7 @@ const Video: React.FC = ({ className='player-button' onClick={toggleFullscreen} > - +
diff --git a/src/pages/group-page.tsx b/src/pages/group-page.tsx index ab7bf6469..e2fbfccdd 100644 --- a/src/pages/group-page.tsx +++ b/src/pages/group-page.tsx @@ -34,7 +34,7 @@ const DeletedBlankslate = () => (
@@ -52,7 +52,7 @@ const PrivacyBlankslate = () => (
@@ -70,7 +70,7 @@ const BlockedBlankslate = ({ group }: { group: Group }) => (
diff --git a/yarn.lock b/yarn.lock index c4ed986bf..4d82d447b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2312,10 +2312,10 @@ dependencies: defer-to-connect "^2.0.0" -"@tabler/icons@^2.0.0": - version "2.4.0" - resolved "https://registry.yarnpkg.com/@tabler/icons/-/icons-2.4.0.tgz#34b1b0d818dc00926b956c3424bff48b89a5b439" - integrity sha512-JZY9Kk3UsQoqp7Rw/BuWw1PrkRwv5h0psjJBbj+Cn9UVyhdzr5vztg2mywXBAJ+jFBUL/pjnVcIvOzKFw4CXng== +"@tabler/icons@^3.1.0": + version "3.1.0" + resolved "https://registry.yarnpkg.com/@tabler/icons/-/icons-3.1.0.tgz#d69d184eae572db6adb452b511562442133cc26d" + integrity sha512-CpZGyS1IVJKFcv88yZ2sYZIpWWhQ6oy76BQKQ5SF0fGgOqgyqKdBGG/YGyyMW632on37MX7VqQIMTzN/uQqmFg== "@tailwindcss/aspect-ratio@^0.4.2": version "0.4.2" From 4a11d56832955689341790551d874390a4cb2c5b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Wed, 3 Apr 2024 23:34:03 +0200 Subject: [PATCH 18/24] Improve pending/scheduled statuses styles MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- .../compose/editor/nodes/emoji-node.tsx | 2 +- .../scheduled-status-action-bar.tsx | 14 ++++------ .../components/scheduled-status.tsx | 28 +++++++++---------- src/features/scheduled-statuses/index.tsx | 1 + src/features/ui/components/pending-status.tsx | 5 +++- 5 files changed, 25 insertions(+), 25 deletions(-) diff --git a/src/features/compose/editor/nodes/emoji-node.tsx b/src/features/compose/editor/nodes/emoji-node.tsx index d3f7a58bc..767731930 100644 --- a/src/features/compose/editor/nodes/emoji-node.tsx +++ b/src/features/compose/editor/nodes/emoji-node.tsx @@ -81,7 +81,7 @@ class EmojiNode extends DecoratorNode { decorate(): JSX.Element { const emoji = this.__emoji; if (isNativeEmoji(emoji)) { - return ; + return ; } else { return ; } diff --git a/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx b/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx index 9b32f8330..8462c45ff 100644 --- a/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx +++ b/src/features/scheduled-statuses/components/scheduled-status-action-bar.tsx @@ -1,11 +1,10 @@ import React from 'react'; -import { defineMessages, useIntl } from 'react-intl'; +import { FormattedMessage, defineMessages, useIntl } from 'react-intl'; import { openModal } from 'soapbox/actions/modals'; import { cancelScheduledStatus } from 'soapbox/actions/scheduled-statuses'; import { getSettings } from 'soapbox/actions/settings'; -import IconButton from 'soapbox/components/icon-button'; -import { HStack } from 'soapbox/components/ui'; +import { Button, HStack } from 'soapbox/components/ui'; import { useAppDispatch } from 'soapbox/hooks'; import type { Status as StatusEntity } from 'soapbox/types/entities'; @@ -46,12 +45,9 @@ const ScheduledStatusActionBar: React.FC = ({ status return ( - + ); }; diff --git a/src/features/scheduled-statuses/components/scheduled-status.tsx b/src/features/scheduled-statuses/components/scheduled-status.tsx index 7243bffd4..6e71f7cbe 100644 --- a/src/features/scheduled-statuses/components/scheduled-status.tsx +++ b/src/features/scheduled-statuses/components/scheduled-status.tsx @@ -5,7 +5,7 @@ import Account from 'soapbox/components/account'; import AttachmentThumbs from 'soapbox/components/attachment-thumbs'; import StatusContent from 'soapbox/components/status-content'; import StatusReplyMentions from 'soapbox/components/status-reply-mentions'; -import { HStack } from 'soapbox/components/ui'; +import { HStack, Stack } from 'soapbox/components/ui'; import PollPreview from 'soapbox/features/ui/components/poll-preview'; import { useAppSelector } from 'soapbox/hooks'; @@ -40,28 +40,28 @@ const ScheduledStatus: React.FC = ({ statusId, ...other }) => account={account} timestamp={status.created_at} futureTimestamp - hideActions + action={} /> - - - {status.media_attachments.size > 0 && ( - + - )} - {status.poll && } + {status.media_attachments.size > 0 && ( + + )} - + {status.poll && } + ); diff --git a/src/features/scheduled-statuses/index.tsx b/src/features/scheduled-statuses/index.tsx index 781a06759..0a9b3dcae 100644 --- a/src/features/scheduled-statuses/index.tsx +++ b/src/features/scheduled-statuses/index.tsx @@ -39,6 +39,7 @@ const ScheduledStatuses = () => { isLoading={typeof isLoading === 'boolean' ? isLoading : true} onLoadMore={() => handleLoadMore(dispatch)} emptyMessage={emptyMessage} + listClassName='divide-y divide-solid divide-gray-200 dark:divide-gray-800' > {statusIds.map((id: string) => )} diff --git a/src/features/ui/components/pending-status.tsx b/src/features/ui/components/pending-status.tsx index 49dd2bcd8..1ed4e5502 100644 --- a/src/features/ui/components/pending-status.tsx +++ b/src/features/ui/components/pending-status.tsx @@ -60,7 +60,10 @@ const PendingStatus: React.FC = ({ idempotencyKey, className, mu
From 6f1b64144fb4f3e54f503bfb0abd637f48d63d88 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Wed, 3 Apr 2024 23:45:58 +0200 Subject: [PATCH 19/24] AccountContainer: Pass withRelationship to Account MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- src/containers/account-container.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/containers/account-container.tsx b/src/containers/account-container.tsx index 2d7090b25..31500b739 100644 --- a/src/containers/account-container.tsx +++ b/src/containers/account-container.tsx @@ -12,7 +12,7 @@ const AccountContainer: React.FC = ({ id, withRelationship, . const { account } = useAccount(id, { withRelationship }); return ( - + ); }; From 41d8d3e2dad5bee1c859c82cac3af74ded6b7e66 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Wed, 3 Apr 2024 23:50:51 +0200 Subject: [PATCH 20/24] Fix SitePreview z-index MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- src/features/soapbox-config/components/site-preview.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/features/soapbox-config/components/site-preview.tsx b/src/features/soapbox-config/components/site-preview.tsx index 617dc3121..82e201e4f 100644 --- a/src/features/soapbox-config/components/site-preview.tsx +++ b/src/features/soapbox-config/components/site-preview.tsx @@ -39,11 +39,11 @@ const SitePreview: React.FC = ({ soapbox }) => { -
+
-
Date: Thu, 4 Apr 2024 00:30:57 +0200 Subject: [PATCH 21/24] Indicate that quoted post quotes another post MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- src/components/quoted-status-indicator.tsx | 27 ++++++++++++++++++++++ src/components/quoted-status.tsx | 3 +++ 2 files changed, 30 insertions(+) create mode 100644 src/components/quoted-status-indicator.tsx diff --git a/src/components/quoted-status-indicator.tsx b/src/components/quoted-status-indicator.tsx new file mode 100644 index 000000000..493db5f19 --- /dev/null +++ b/src/components/quoted-status-indicator.tsx @@ -0,0 +1,27 @@ +import React, { useCallback } from 'react'; + +import { HStack, Icon, Text } from 'soapbox/components/ui'; +import { useAppSelector } from 'soapbox/hooks'; +import { makeGetStatus } from 'soapbox/selectors'; + +interface IQuotedStatusIndicator { + /** The quoted status id. */ + statusId: string; +} + +const QuotedStatusIndicator: React.FC = ({ statusId }) => { + const getStatus = useCallback(makeGetStatus(), []); + + const status = useAppSelector(state => getStatus(state, { id: statusId })); + + if (!status) return null; + + return ( + + + {status.url} + + ); +}; + +export default QuotedStatusIndicator; diff --git a/src/components/quoted-status.tsx b/src/components/quoted-status.tsx index edbca1457..b90e753e6 100644 --- a/src/components/quoted-status.tsx +++ b/src/components/quoted-status.tsx @@ -11,6 +11,7 @@ import { defaultMediaVisibility } from 'soapbox/utils/status'; import EventPreview from './event-preview'; import OutlineBox from './outline-box'; +import QuotedStatusIndicator from './quoted-status-indicator'; import StatusContent from './status-content'; import StatusReplyMentions from './status-reply-mentions'; import SensitiveContentOverlay from './statuses/sensitive-content-overlay'; @@ -132,6 +133,8 @@ const QuotedStatus: React.FC = ({ status, onCancel, compose }) => collapsable /> + {status.quote && } + {status.media_attachments.size > 0 && ( Date: Wed, 3 Apr 2024 17:59:34 -0500 Subject: [PATCH 22/24] useSignerStream: fix first event signing right after logging in --- src/api/hooks/nostr/useSignerStream.ts | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/src/api/hooks/nostr/useSignerStream.ts b/src/api/hooks/nostr/useSignerStream.ts index 460cfd9d6..b163469e3 100644 --- a/src/api/hooks/nostr/useSignerStream.ts +++ b/src/api/hooks/nostr/useSignerStream.ts @@ -64,13 +64,20 @@ function useSignerStream() { useEffect(() => { if (!relay || !pubkey) return; + const controller = new AbortController(); + const signal = controller.signal; + (async() => { - for await (const msg of relay.req([{ kinds: [24133, 23194], authors: [pubkey], limit: 0 }])) { + for await (const msg of relay.req([{ kinds: [24133, 23194], authors: [pubkey], limit: 0 }], { signal })) { if (msg[0] === 'EVENT') handleEvent(msg[2]); } })(); - }, [relay, pubkey]); + return () => { + controller.abort(); + }; + + }, [relay, pubkey, signer]); } export { useSignerStream }; From d3c06045995f33c697d93b2e3719029f473c26f2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= Date: Thu, 4 Apr 2024 11:02:15 +0200 Subject: [PATCH 23/24] Add optional indicator for attachments without description MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: marcin mikołajczak --- src/components/upload.tsx | 20 ++++++++++++++++++-- src/locales/en.json | 2 ++ 2 files changed, 20 insertions(+), 2 deletions(-) diff --git a/src/components/upload.tsx b/src/components/upload.tsx index 8308950cc..e83dd4d49 100644 --- a/src/components/upload.tsx +++ b/src/components/upload.tsx @@ -10,14 +10,14 @@ import zoomInIcon from '@tabler/icons/outline/zoom-in.svg'; import clsx from 'clsx'; import { List as ImmutableList } from 'immutable'; import React, { useState } from 'react'; -import { defineMessages, useIntl } from 'react-intl'; +import { FormattedMessage, defineMessages, useIntl } from 'react-intl'; import { spring } from 'react-motion'; import { openModal } from 'soapbox/actions/modals'; import Blurhash from 'soapbox/components/blurhash'; import { HStack, Icon, IconButton } from 'soapbox/components/ui'; import Motion from 'soapbox/features/ui/util/optional-motion'; -import { useAppDispatch } from 'soapbox/hooks'; +import { useAppDispatch, useSettings } from 'soapbox/hooks'; import { Attachment } from 'soapbox/types/entities'; export const MIMETYPE_ICONS: Record = { @@ -58,6 +58,7 @@ const messages = defineMessages({ description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' }, delete: { id: 'upload_form.undo', defaultMessage: 'Delete' }, preview: { id: 'upload_form.preview', defaultMessage: 'Preview' }, + descriptionMissingTitle: { id: 'upload_form.description_missing.title', defaultMessage: 'This attachment doesn\'t have a description' }, }); interface IUpload { @@ -80,6 +81,8 @@ const Upload: React.FC = ({ const intl = useIntl(); const dispatch = useAppDispatch(); + const { missingDescriptionModal } = useSettings(); + const [hovered, setHovered] = useState(false); const [focused, setFocused] = useState(false); const [dirtyDescription, setDirtyDescription] = useState(null); @@ -200,6 +203,19 @@ const Upload: React.FC = ({
)} + {missingDescriptionModal && !description && ( + + + + + )} +
{mediaType === 'video' && (