Remove `=== 'black'` conditionals
This commit is contained in:
parent
f952499a33
commit
a4b041723a
|
@ -36,8 +36,6 @@ interface IPureStatusList extends Omit<IScrollableList, 'onLoadMore' | 'children
|
|||
emptyMessage: React.ReactNode;
|
||||
/** ID of the timeline in Redux. */
|
||||
timelineId?: string;
|
||||
/** Whether to display a gap or border between statuses in the list. */
|
||||
divideType?: 'space' | 'border';
|
||||
/** Whether to display ads. */
|
||||
showAds?: boolean;
|
||||
/** Whether to show group information. */
|
||||
|
@ -51,7 +49,6 @@ const PureStatusList: React.FC<IPureStatusList> = ({
|
|||
statuses,
|
||||
lastStatusId,
|
||||
featuredStatuses,
|
||||
divideType = 'border',
|
||||
onLoadMore,
|
||||
timelineId,
|
||||
isLoading,
|
||||
|
@ -133,7 +130,6 @@ const PureStatusList: React.FC<IPureStatusList> = ({
|
|||
onMoveUp={handleMoveUp}
|
||||
onMoveDown={handleMoveDown}
|
||||
showGroup={showGroup}
|
||||
variant={divideType === 'border' ? 'slim' : 'rounded'}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
@ -161,7 +157,6 @@ const PureStatusList: React.FC<IPureStatusList> = ({
|
|||
onMoveUp={handleMoveUp}
|
||||
onMoveDown={handleMoveDown}
|
||||
showGroup={showGroup}
|
||||
variant={divideType === 'border' ? 'slim' : 'default'} // shouldn't "default" be changed to "rounded" ?
|
||||
/>
|
||||
));
|
||||
};
|
||||
|
@ -236,15 +231,10 @@ const PureStatusList: React.FC<IPureStatusList> = ({
|
|||
isLoading={isLoading}
|
||||
showLoading={isLoading && statuses.length === 0}
|
||||
onLoadMore={handleLoadOlder}
|
||||
placeholderComponent={() => <PlaceholderStatus variant={divideType === 'border' ? 'slim' : 'rounded'} />}
|
||||
placeholderComponent={() => <PlaceholderStatus />}
|
||||
placeholderCount={20}
|
||||
ref={node}
|
||||
listClassName={clsx('divide-y divide-solid divide-gray-200 dark:divide-gray-800', {
|
||||
'divide-none': divideType !== 'border',
|
||||
}, className)}
|
||||
itemClassName={clsx({
|
||||
'pb-3': divideType !== 'border',
|
||||
})}
|
||||
listClassName={clsx('divide-y divide-solid divide-gray-200 dark:divide-gray-800', className)}
|
||||
{...other}
|
||||
>
|
||||
{renderScrollableContent()}
|
||||
|
|
|
@ -57,7 +57,6 @@ export interface IPureStatus {
|
|||
featured?: boolean;
|
||||
hideActionBar?: boolean;
|
||||
hoverable?: boolean;
|
||||
variant?: 'default' | 'rounded' | 'slim';
|
||||
showGroup?: boolean;
|
||||
accountAction?: React.ReactElement;
|
||||
}
|
||||
|
@ -80,7 +79,6 @@ const PureStatus: React.FC<IPureStatus> = (props) => {
|
|||
featured,
|
||||
unread,
|
||||
hideActionBar,
|
||||
variant = 'rounded',
|
||||
showGroup = true,
|
||||
} = props;
|
||||
|
||||
|
@ -420,9 +418,10 @@ const PureStatus: React.FC<IPureStatus> = (props) => {
|
|||
role='link'
|
||||
>
|
||||
<Card
|
||||
variant={variant}
|
||||
variant='slim'
|
||||
className={clsx('status--wrapper space-y-4', {
|
||||
'py-6 sm:p-5': variant === 'rounded', muted, read: unread === false,
|
||||
muted,
|
||||
read: unread === false,
|
||||
})}
|
||||
data-id={status.id}
|
||||
>
|
||||
|
|
|
@ -36,8 +36,6 @@ interface IStatusList extends Omit<IScrollableList, 'onLoadMore' | 'children'> {
|
|||
emptyMessage: React.ReactNode;
|
||||
/** ID of the timeline in Redux. */
|
||||
timelineId?: string;
|
||||
/** Whether to display a gap or border between statuses in the list. */
|
||||
divideType?: 'space' | 'border';
|
||||
/** Whether to display ads. */
|
||||
showAds?: boolean;
|
||||
/** Whether to show group information. */
|
||||
|
@ -52,7 +50,6 @@ const StatusList: React.FC<IStatusList> = ({
|
|||
statusIds,
|
||||
lastStatusId,
|
||||
featuredStatusIds,
|
||||
divideType = 'border',
|
||||
onLoadMore,
|
||||
timelineId,
|
||||
isLoading,
|
||||
|
@ -131,7 +128,6 @@ const StatusList: React.FC<IStatusList> = ({
|
|||
onMoveDown={handleMoveDown}
|
||||
contextType={timelineId}
|
||||
showGroup={showGroup}
|
||||
variant={divideType === 'border' ? 'slim' : 'rounded'}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
@ -159,7 +155,6 @@ const StatusList: React.FC<IStatusList> = ({
|
|||
onMoveDown={handleMoveDown}
|
||||
contextType={timelineId}
|
||||
showGroup={showGroup}
|
||||
variant={divideType === 'border' ? 'slim' : 'default'}
|
||||
/>
|
||||
));
|
||||
};
|
||||
|
@ -234,15 +229,10 @@ const StatusList: React.FC<IStatusList> = ({
|
|||
isLoading={isLoading}
|
||||
showLoading={isLoading && statusIds.size === 0}
|
||||
onLoadMore={handleLoadOlder}
|
||||
placeholderComponent={() => <PlaceholderStatus variant={divideType === 'border' ? 'slim' : 'rounded'} />}
|
||||
placeholderComponent={() => <PlaceholderStatus />}
|
||||
placeholderCount={20}
|
||||
ref={node}
|
||||
listClassName={clsx('divide-y divide-solid divide-gray-200 dark:divide-gray-800', {
|
||||
'divide-none': divideType !== 'border',
|
||||
}, className)}
|
||||
itemClassName={clsx({
|
||||
'pb-3': divideType !== 'border',
|
||||
})}
|
||||
listClassName={clsx('divide-y divide-solid divide-gray-200 dark:divide-gray-800', className)}
|
||||
{...other}
|
||||
>
|
||||
{renderScrollableContent()}
|
||||
|
|
|
@ -57,7 +57,7 @@ export interface IStatus {
|
|||
featured?: boolean;
|
||||
hideActionBar?: boolean;
|
||||
hoverable?: boolean;
|
||||
variant?: 'default' | 'rounded' | 'slim';
|
||||
variant?: 'default' | 'slim';
|
||||
showGroup?: boolean;
|
||||
accountAction?: React.ReactElement;
|
||||
}
|
||||
|
@ -81,7 +81,7 @@ const Status: React.FC<IStatus> = (props) => {
|
|||
featured,
|
||||
unread,
|
||||
hideActionBar,
|
||||
variant = 'rounded',
|
||||
variant = 'slim',
|
||||
showGroup = true,
|
||||
} = props;
|
||||
|
||||
|
@ -419,7 +419,8 @@ const Status: React.FC<IStatus> = (props) => {
|
|||
<Card
|
||||
variant={variant}
|
||||
className={clsx('status--wrapper space-y-4', {
|
||||
'py-6 sm:p-5': variant === 'rounded', muted, read: unread === false,
|
||||
muted,
|
||||
read: unread === false,
|
||||
})}
|
||||
data-id={status.id}
|
||||
>
|
||||
|
|
|
@ -5,8 +5,6 @@ import { useBookmarks } from 'soapbox/api/hooks/index.ts';
|
|||
import PullToRefresh from 'soapbox/components/pull-to-refresh.tsx';
|
||||
import PureStatusList from 'soapbox/components/pure-status-list.tsx';
|
||||
import { Column } from 'soapbox/components/ui/column.tsx';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
const messages = defineMessages({
|
||||
heading: { id: 'column.bookmarks', defaultMessage: 'Bookmarks' },
|
||||
|
@ -15,9 +13,6 @@ const messages = defineMessages({
|
|||
const Bookmarks: React.FC = () => {
|
||||
const intl = useIntl();
|
||||
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const handleLoadMore = debounce(() => {
|
||||
fetchNextPage();
|
||||
}, 300, { edges: ['leading'] });
|
||||
|
@ -41,7 +36,6 @@ const Bookmarks: React.FC = () => {
|
|||
isLoading={typeof isLoading === 'boolean' ? isLoading : true}
|
||||
onLoadMore={() => handleLoadMore()}
|
||||
emptyMessage={emptyMessage}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</PullToRefresh>
|
||||
</Column>
|
||||
|
|
|
@ -10,13 +10,11 @@ import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
|||
import { useInstance } from 'soapbox/hooks/useInstance.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useSettings } from 'soapbox/hooks/useSettings.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
import Timeline from '../ui/components/timeline.tsx';
|
||||
|
||||
const CommunityTimeline = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
const theme = useTheme();
|
||||
const { instance } = useInstance();
|
||||
|
||||
const settings = useSettings();
|
||||
|
@ -50,7 +48,6 @@ const CommunityTimeline = () => {
|
|||
prefix='home'
|
||||
onLoadMore={handleLoadMore}
|
||||
emptyMessage={<FormattedMessage id='empty_column.community' defaultMessage='The local timeline is empty. Write something publicly to get the ball rolling!' />}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</PullToRefresh>
|
||||
</Column>
|
||||
|
|
|
@ -47,7 +47,6 @@ const DirectTimeline = () => {
|
|||
timelineId='direct'
|
||||
onLoadMore={handleLoadMore}
|
||||
emptyMessage={<FormattedMessage id='empty_column.direct' defaultMessage="You don't have any direct messages yet. When you send or receive one, it will show up here." />}
|
||||
divideType='border'
|
||||
/>
|
||||
</Column>
|
||||
);
|
||||
|
|
|
@ -185,7 +185,7 @@ const EventDiscussion: React.FC<IEventDiscussion> = (props) => {
|
|||
ref={scroller}
|
||||
hasMore={!!next}
|
||||
onLoadMore={handleLoadMore}
|
||||
placeholderComponent={() => <PlaceholderStatus variant='slim' />}
|
||||
placeholderComponent={() => <PlaceholderStatus />}
|
||||
initialTopMostItemIndex={0}
|
||||
emptyMessage={<FormattedMessage id='event.discussion.empty' defaultMessage='No one has commented this event yet. When someone does, they will appear here.' />}
|
||||
>
|
||||
|
|
|
@ -47,7 +47,6 @@ const GroupTagTimeline: React.FC<IGroupTimeline> = (props) => {
|
|||
scrollKey='group_timeline'
|
||||
timelineId={`group:tags:${groupId}:${tag.name}`}
|
||||
onLoadMore={handleLoadMore}
|
||||
divideType='border'
|
||||
showGroup={false}
|
||||
emptyMessageCard={false}
|
||||
emptyMessage={
|
||||
|
|
|
@ -130,7 +130,6 @@ const GroupTimeline: React.FC<IGroupTimeline> = (props) => {
|
|||
</Stack>
|
||||
}
|
||||
emptyMessageCard={false}
|
||||
divideType='border'
|
||||
showGroup={false}
|
||||
featuredStatusIds={featuredStatusIds}
|
||||
/>
|
||||
|
|
|
@ -13,7 +13,6 @@ import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
|||
import { useFeatures } from 'soapbox/hooks/useFeatures.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useLoggedIn } from 'soapbox/hooks/useLoggedIn.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
interface IHashtagTimeline {
|
||||
params?: {
|
||||
|
@ -29,7 +28,6 @@ export const HashtagTimeline: React.FC<IHashtagTimeline> = ({ params }) => {
|
|||
const tag = useAppSelector((state) => state.tags.get(id));
|
||||
const next = useAppSelector(state => state.timelines.get(`hashtag:${id}`)?.next);
|
||||
const { isLoggedIn } = useLoggedIn();
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const handleLoadMore = (maxId: string) => {
|
||||
|
@ -76,7 +74,6 @@ export const HashtagTimeline: React.FC<IHashtagTimeline> = ({ params }) => {
|
|||
timelineId={`hashtag:${id}`}
|
||||
onLoadMore={handleLoadMore}
|
||||
emptyMessage={<FormattedMessage id='empty_column.hashtag' defaultMessage='There is nothing in this hashtag yet.' />}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</Column>
|
||||
);
|
||||
|
|
|
@ -13,7 +13,6 @@ import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
|||
import { useFeatures } from 'soapbox/hooks/useFeatures.ts';
|
||||
import { useInstance } from 'soapbox/hooks/useInstance.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
const messages = defineMessages({
|
||||
title: { id: 'column.home', defaultMessage: 'Home' },
|
||||
|
@ -24,7 +23,6 @@ const HomeTimeline: React.FC = () => {
|
|||
const dispatch = useAppDispatch();
|
||||
const features = useFeatures();
|
||||
const { instance } = useInstance();
|
||||
const theme = useTheme();
|
||||
|
||||
const polling = useRef<NodeJS.Timeout | null>(null);
|
||||
const isMobile = useIsMobile();
|
||||
|
@ -75,7 +73,6 @@ const HomeTimeline: React.FC = () => {
|
|||
scrollKey='home_timeline'
|
||||
onLoadMore={handleLoadMore}
|
||||
timelineId='home'
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
emptyMessage={
|
||||
<Stack space={1}>
|
||||
<Text size='xl' weight='medium' align='center'>
|
||||
|
|
|
@ -9,7 +9,6 @@ import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts';
|
|||
import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
||||
import { useInstance } from 'soapbox/hooks/useInstance.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
import AboutPage from '../about/index.tsx';
|
||||
import Timeline from '../ui/components/timeline.tsx';
|
||||
|
@ -19,7 +18,6 @@ import { SiteBanner } from './components/site-banner.tsx';
|
|||
const LandingTimeline = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
const { instance } = useInstance();
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const timelineEnabled = !instance.pleroma.metadata.restrict_unauthenticated.timelines.local;
|
||||
|
@ -62,7 +60,6 @@ const LandingTimeline = () => {
|
|||
prefix='home'
|
||||
onLoadMore={handleLoadMore}
|
||||
emptyMessage={<FormattedMessage id='empty_column.community' defaultMessage='The local timeline is empty. Write something publicly to get the ball rolling!' />}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</PullToRefresh>
|
||||
) : (
|
||||
|
|
|
@ -13,14 +13,12 @@ import Spinner from 'soapbox/components/ui/spinner.tsx';
|
|||
import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts';
|
||||
import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
import Timeline from '../ui/components/timeline.tsx';
|
||||
|
||||
const ListTimeline: React.FC = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
const { id } = useParams<{ id: string }>();
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const list = useAppSelector((state) => state.lists.get(id));
|
||||
|
@ -73,7 +71,6 @@ const ListTimeline: React.FC = () => {
|
|||
timelineId={`list:${id}`}
|
||||
onLoadMore={handleLoadMore}
|
||||
emptyMessage={emptyMessage}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</Column>
|
||||
);
|
||||
|
|
|
@ -19,9 +19,7 @@ import Portal from 'soapbox/components/ui/portal.tsx';
|
|||
import PlaceholderNotification from 'soapbox/features/placeholder/components/placeholder-notification.tsx';
|
||||
import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts';
|
||||
import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useSettings } from 'soapbox/hooks/useSettings.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
import FilterBar from './components/filter-bar.tsx';
|
||||
import Notification from './components/notification.tsx';
|
||||
|
@ -63,9 +61,6 @@ const Notifications = () => {
|
|||
const hasMore = useAppSelector(state => state.notifications.hasMore);
|
||||
const totalQueuedNotificationsCount = useAppSelector(state => state.notifications.totalQueuedNotificationsCount || 0);
|
||||
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const node = useRef<VirtuosoHandle>(null);
|
||||
const column = useRef<HTMLDivElement>(null);
|
||||
const scrollableContentRef = useRef<ImmutableList<JSX.Element> | null>(null);
|
||||
|
@ -186,7 +181,7 @@ const Notifications = () => {
|
|||
ref={column}
|
||||
label={intl.formatMessage(messages.title)}
|
||||
withHeader={false}
|
||||
className={clsx({ '!p-0': isMobile || theme === 'black' })}
|
||||
className='!p-0'
|
||||
>
|
||||
{filterBarContainer}
|
||||
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
import clsx from 'clsx';
|
||||
import { memo } from 'react';
|
||||
|
||||
import HStack from 'soapbox/components/ui/hstack.tsx';
|
||||
|
@ -7,19 +6,9 @@ import PlaceholderAvatar from './placeholder-avatar.tsx';
|
|||
import PlaceholderDisplayName from './placeholder-display-name.tsx';
|
||||
import PlaceholderStatusContent from './placeholder-status-content.tsx';
|
||||
|
||||
interface IPlaceholderStatus {
|
||||
variant?: 'rounded' | 'slim' | 'default';
|
||||
}
|
||||
|
||||
/** Fake status to display while data is loading. */
|
||||
const PlaceholderStatus: React.FC<IPlaceholderStatus> = ({ variant }) => (
|
||||
<div
|
||||
className={clsx({
|
||||
'status-placeholder bg-white black:bg-black dark:bg-primary-900': true,
|
||||
'shadow-xl dark:shadow-none sm:rounded-xl px-4 py-6 sm:p-5': variant === 'rounded',
|
||||
'py-4': variant === 'slim',
|
||||
})}
|
||||
>
|
||||
const PlaceholderStatus: React.FC = () => (
|
||||
<div className='status-placeholder bg-white py-4 black:bg-black dark:bg-primary-900'>
|
||||
<div className='w-full animate-pulse overflow-hidden'>
|
||||
<div>
|
||||
<HStack space={3} alignItems='center'>
|
||||
|
|
|
@ -16,7 +16,6 @@ import { useFeatures } from 'soapbox/hooks/useFeatures.ts';
|
|||
import { useInstance } from 'soapbox/hooks/useInstance.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useSettings } from 'soapbox/hooks/useSettings.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
import PinnedHostsPicker from '../remote-timeline/components/pinned-hosts-picker.tsx';
|
||||
import Timeline from '../ui/components/timeline.tsx';
|
||||
|
@ -30,7 +29,6 @@ const PublicTimeline = () => {
|
|||
const intl = useIntl();
|
||||
const dispatch = useAppDispatch();
|
||||
const features = useFeatures();
|
||||
const theme = useTheme();
|
||||
|
||||
const [language, setLanguage] = useState<string>(localStorage.getItem('soapbox:global:language') || '');
|
||||
|
||||
|
@ -118,7 +116,6 @@ const PublicTimeline = () => {
|
|||
prefix='home'
|
||||
onLoadMore={handleLoadMore}
|
||||
emptyMessage={<FormattedMessage id='empty_column.public' defaultMessage='There is nothing here! Write something publicly, or manually follow users from other servers to fill it up' />}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</PullToRefresh>
|
||||
</Column>
|
||||
|
|
|
@ -10,7 +10,6 @@ import { Column } from 'soapbox/components/ui/column.tsx';
|
|||
import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts';
|
||||
import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
const messages = defineMessages({
|
||||
heading: { id: 'column.quotes', defaultMessage: 'Post quotes' },
|
||||
|
@ -23,7 +22,6 @@ const Quotes: React.FC = () => {
|
|||
const dispatch = useAppDispatch();
|
||||
const intl = useIntl();
|
||||
const { statusId } = useParams<{ statusId: string }>();
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const statusIds = useAppSelector((state) => state.status_lists.getIn([`quotes:${statusId}`, 'items'], ImmutableOrderedSet<string>()));
|
||||
|
@ -51,7 +49,6 @@ const Quotes: React.FC = () => {
|
|||
onLoadMore={() => handleLoadMore(statusId, dispatch)}
|
||||
onRefresh={handleRefresh}
|
||||
emptyMessage={emptyMessage}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</Column>
|
||||
);
|
||||
|
|
|
@ -13,7 +13,6 @@ import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts';
|
|||
import { useAppSelector } from 'soapbox/hooks/useAppSelector.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useSettings } from 'soapbox/hooks/useSettings.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
import Timeline from '../ui/components/timeline.tsx';
|
||||
|
||||
|
@ -29,7 +28,6 @@ interface IRemoteTimeline {
|
|||
const RemoteTimeline: React.FC<IRemoteTimeline> = ({ params }) => {
|
||||
const history = useHistory();
|
||||
const dispatch = useAppDispatch();
|
||||
const theme = useTheme();
|
||||
|
||||
const instance = params?.instance as string;
|
||||
const settings = useSettings();
|
||||
|
@ -84,7 +82,6 @@ const RemoteTimeline: React.FC<IRemoteTimeline> = ({ params }) => {
|
|||
values={{ instance }}
|
||||
/>
|
||||
}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</Column>
|
||||
);
|
||||
|
|
|
@ -1,11 +1,8 @@
|
|||
import clsx from 'clsx';
|
||||
import { defineMessages, useIntl } from 'react-intl';
|
||||
|
||||
import { Column } from 'soapbox/components/ui/column.tsx';
|
||||
import SearchResults from 'soapbox/features/compose/components/search-results.tsx';
|
||||
import Search from 'soapbox/features/compose/components/search.tsx';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
const messages = defineMessages({
|
||||
heading: { id: 'column.search', defaultMessage: 'Discover' },
|
||||
|
@ -14,13 +11,10 @@ const messages = defineMessages({
|
|||
const SearchPage = () => {
|
||||
const intl = useIntl();
|
||||
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
return (
|
||||
<Column
|
||||
label={intl.formatMessage(messages.heading)}
|
||||
className={clsx({ '!px-0': isMobile || theme === 'black' })}
|
||||
className='!px-0'
|
||||
>
|
||||
<div className='space-y-4'>
|
||||
<div className='px-4 sm:py-0'>
|
||||
|
|
|
@ -44,7 +44,7 @@ const ThreadStatus: React.FC<IThreadStatus> = (props): JSX.Element => {
|
|||
// @ts-ignore FIXME
|
||||
<StatusContainer {...props} showGroup={false} />
|
||||
) : (
|
||||
<PlaceholderStatus variant='default' />
|
||||
<PlaceholderStatus />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -445,7 +445,7 @@ const Thread = (props: IThread) => {
|
|||
ref={scroller}
|
||||
hasMore={!!next}
|
||||
onLoadMore={handleLoadMore}
|
||||
placeholderComponent={() => <PlaceholderStatus variant='slim' />}
|
||||
placeholderComponent={() => <PlaceholderStatus />}
|
||||
initialTopMostItemIndex={initialTopMostItemIndex}
|
||||
useWindowScroll={useWindowScroll}
|
||||
itemClassName={itemClassName}
|
||||
|
|
|
@ -13,7 +13,6 @@ import { Column } from 'soapbox/components/ui/column.tsx';
|
|||
import Timeline from 'soapbox/features/ui/components/timeline.tsx';
|
||||
import { useAppDispatch } from 'soapbox/hooks/useAppDispatch.ts';
|
||||
import { useIsMobile } from 'soapbox/hooks/useIsMobile.ts';
|
||||
import { useTheme } from 'soapbox/hooks/useTheme.ts';
|
||||
|
||||
const messages = defineMessages({
|
||||
title: { id: 'column.test', defaultMessage: 'Test timeline' },
|
||||
|
@ -31,7 +30,6 @@ const onlyMedia = false;
|
|||
const TestTimeline: React.FC = () => {
|
||||
const intl = useIntl();
|
||||
const dispatch = useAppDispatch();
|
||||
const theme = useTheme();
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -45,7 +43,6 @@ const TestTimeline: React.FC = () => {
|
|||
scrollKey={`${timelineId}_timeline`}
|
||||
timelineId={`${timelineId}${onlyMedia ? ':media' : ''}`}
|
||||
emptyMessage={<FormattedMessage id='empty_column.test' defaultMessage='The test timeline is empty.' />}
|
||||
divideType={(theme === 'black' || isMobile) ? 'border' : 'space'}
|
||||
/>
|
||||
</Column>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue