External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: replace default lodash imports with named imports

Browse Source 
Replaced `import _ from 'lodash'` with specific named imports (`capitalize`, `lowerCase`, `debounce`, `startCase`) across 18 files. This reduces bundle size and improves tree-shaking efficiency.
This commit is contained in:
plebeius
2026-02-11 19:01:09 +08:00
parent d862550132
commit 18cea185e7
18 changed files with 83 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/board-buttons/board-buttons.tsx
+5 -5
View File
@@ -20,7 +20,7 @@ import CatalogSearch from '../catalog-search';
import Tooltip from '../tooltip';
import { ModQueueButton } from '../../views/mod-queue/mod-queue';
import styles from './board-buttons.module.css';
import _ from 'lodash';
import { capitalize } from 'lodash';
interface BoardButtonsProps {
address?: string | undefined;
@@ -510,13 +510,13 @@ const PostPageStats = () => {
const linkCount = useCountLinksInReplies(comment);
const displayReplyCount = replyCount !== undefined ? replyCount.toString() : '?';
const replyCountTooltip = replyCount !== undefined ? _.capitalize(t('replies')) : t('loading');
const replyCountTooltip = replyCount !== undefined ? capitalize(t('replies')) : t('loading');
return (
<span>
{pinned && `${_.capitalize(t('sticky'))} / `}
{closed && `${_.capitalize(t('closed'))} / `}
<Tooltip children={displayReplyCount} content={replyCountTooltip} /> / <Tooltip children={linkCount?.toString()} content={_.capitalize(t('links'))} />
{pinned && `${capitalize(t('sticky'))} / `}
{closed && `${capitalize(t('closed'))} / `}
<Tooltip children={displayReplyCount} content={replyCountTooltip} /> / <Tooltip children={linkCount?.toString()} content={capitalize(t('links'))} />
</span>
);
};
src/components/board-header/board-header.tsx
+2 -2
View File
@@ -14,7 +14,7 @@ import useIsMobile from '../../hooks/use-is-mobile';
import useIsSubplebbitOffline from '../../hooks/use-is-subplebbit-offline';
import { shouldShowSnow } from '../../lib/snow';
import Tooltip from '../tooltip';
import _ from 'lodash';
import { startCase } from 'lodash';
import { BANNERS } from '../../generated/asset-manifest';
const ImageBanner = () => {
@@ -78,7 +78,7 @@ const BoardHeader = () => {
: isInSubscriptionsView
? '/subs/ - Subscriptions'
: isInModView
? _.startCase(t('boards_you_moderate'))
? startCase(t('boards_you_moderate'))
: defaultSubplebbit?.title || stableSubplebbit?.title;
const subtitle = isInAllView ? '' : isInSubscriptionsView ? subscriptionsSubtitle : isInModView ? '/mod/' : `${address || subplebbitAddress || ''}`;
src/components/catalog-row/catalog-row.tsx
+3 -3
View File
@@ -22,7 +22,7 @@ import useWindowWidth from '../../hooks/use-window-width';
import { ContentPreview } from '../../views/home/popular-threads-box';
import PostMenuDesktop from '../post-desktop/post-menu-desktop';
import styles from './catalog-row.module.css';
import _ from 'lodash';
import { capitalize } from 'lodash';
import { selectPostMenuProps } from '../../lib/utils/post-menu-props';
interface CatalogPostMediaProps {
@@ -286,7 +286,7 @@ const CatalogPost = memo(
t('posted_by')
)}{' '}
<span className={`${styles.postAuthor} ${isCatalogPostAuthorMod && styles.capcode}`}>
{author?.displayName || _.capitalize(t('anonymous'))}
{author?.displayName || capitalize(t('anonymous'))}
{isCatalogPostAuthorMod && <span className='capitalize'>{` ## Board ${catalogPostAuthorRole}`}</span>}
</span>
{(isInAllView || isInSubscriptionsView) && subplebbitAddress && ` to p/${Plebbit.getShortAddress({ address: subplebbitAddress })}`}
@@ -295,7 +295,7 @@ const CatalogPost = memo(
<div className={styles.postLast}>
{t('last_reply_by')}{' '}
<span className={`${styles.postAuthor} ${isLastReplyAuthorMod && styles.capcode}`}>
{lastReply?.author?.displayName || _.capitalize(t('anonymous'))}
{lastReply?.author?.displayName || capitalize(t('anonymous'))}
{isLastReplyAuthorMod && ` ## Board ${lastReplyAuthorRole}`}
</span>
<span className={styles.postAgo}> {getFormattedTimeAgo(lastReply?.timestamp)}</span>
src/components/catalog-search/catalog-search.tsx
+2 -2
View File
@@ -4,7 +4,7 @@ import { useLocation, useNavigate } from 'react-router-dom';
import styles from './catalog-search.module.css';
import useIsMobile from '../../hooks/use-is-mobile';
import useCatalogFiltersStore from '../../stores/use-catalog-filters-store';
import _ from 'lodash';
import { debounce } from 'lodash';
const CatalogSearch = () => {
const { t } = useTranslation();
@@ -44,7 +44,7 @@ const CatalogSearch = () => {
// Create a debounced version of setSearchFilter and URL update
// eslint-disable-next-line react-hooks/exhaustive-deps
const debouncedSetSearchFilter = useCallback(
_.debounce((text: string) => {
debounce((text: string) => {
if (text.trim()) {
setSearchFilter(text);
updateURL(text);
src/components/challenge-modal/challenge-modal.tsx
+2 -2
View File
@@ -6,7 +6,7 @@ import useIsMobile from '../../hooks/use-is-mobile';
import useChallengesStore from '../../stores/use-challenges-store';
import useTheme from '../../hooks/use-theme';
import styles from './challenge-modal.module.css';
import _ from 'lodash';
import { capitalize } from 'lodash';
import { useSpring, animated } from '@react-spring/web';
import { useDrag } from '@use-gesture/react';
@@ -269,7 +269,7 @@ const Challenge = ({ challenge, closeModal }: ChallengeProps) => {
{isIframeChallenge && !showIframeConfirmation ? null : (
<>
<div className={styles.name}>
<input type='text' value={displayName || _.capitalize(t('anonymous'))} disabled />
<input type='text' value={displayName || capitalize(t('anonymous'))} disabled />
</div>
{title && (
<div className={styles.subject}>
src/components/comment-content/comment-content.tsx
+5 -5
View File
@@ -14,7 +14,7 @@ import ReplyQuotePreview from '../../components/reply-quote-preview';
import Markdown from '../../components/markdown';
import Tooltip from '../../components/tooltip';
import styles from '../../views/post/post.module.css';
import _ from 'lodash';
import { capitalize } from 'lodash';
const QuotedCidLink = ({ cid, postCid }: { cid: string; postCid: string }) => {
const commentFromStore = useSubplebbitsPagesStore((state) => state.comments[cid]);
@@ -88,16 +88,16 @@ const CommentContent = ({ comment: post }: { comment: Comment }) => {
<span className={styles.redEditMessage}>({t('this_post_was_removed')})</span>
<br />
<br />
<span className={styles.grayEditMessage}>{`${_.capitalize(t('reason'))}: "${reason}"`}</span>
<span className={styles.grayEditMessage}>{`${capitalize(t('reason'))}: "${reason}"`}</span>
</>
) : (
<span className={styles.grayEditMessage}>{_.capitalize(t('this_post_was_removed'))}.</span>
<span className={styles.grayEditMessage}>{capitalize(t('this_post_was_removed'))}.</span>
)
) : deleted ? (
reason ? (
<>
<span className={styles.grayEditMessage}>{t('user_deleted_this_post')}</span>{' '}
<span className={styles.grayEditMessage}>{`${_.capitalize(t('reason'))}: "${reason}"`}</span>
<span className={styles.grayEditMessage}>{`${capitalize(t('reason'))}: "${reason}"`}</span>
</>
) : (
<span className={styles.grayEditMessage}>{t('user_deleted_this_post')}</span>
@@ -159,7 +159,7 @@ const CommentContent = ({ comment: post }: { comment: Comment }) => {
address: subplebbitAddress && Plebbit.getShortAddress({ address: subplebbitAddress }),
timestamp: getFormattedDate(post?.author?.subplebbit?.banExpiresAt),
interpolation: { escapeValue: false },
})}${reason ? `. ${_.capitalize(t('reason'))}: "${reason}"` : ''}`}
})}${reason ? `. ${capitalize(t('reason'))}: "${reason}"` : ''}`}
/>
</span>
)}
src/components/edit-menu/edit-menu.tsx
+9 -9
View File
@@ -12,7 +12,7 @@ import {
import styles from './edit-menu.module.css';
import { alertChallengeVerificationFailed } from '../../lib/utils/challenge-utils';
import useChallengesStore from '../../stores/use-challenges-store';
import _ from 'lodash';
import { capitalize } from 'lodash';
import useIsMobile from '../../hooks/use-is-mobile';
import useAuthorPrivileges from '../../hooks/use-author-privileges';
@@ -277,14 +277,14 @@ const EditMenu = ({ post }: { post: Comment }) => {
<label>
[
<input onChange={onCheckbox} checked={publishCommentEditOptions.deleted ?? false} type='checkbox' id='deleted' />
{_.capitalize(t('delete'))}?]
{capitalize(t('delete'))}?]
</label>
</div>
<div className={styles.menuItem}>
<label>
[
<input type='checkbox' onChange={() => setIsContentEditorOpen(!isContentEditorOpen)} checked={isContentEditorOpen} />
{_.capitalize(t('edit'))}?]
{capitalize(t('edit'))}?]
</label>
</div>
{isContentEditorOpen && (
@@ -307,13 +307,13 @@ const EditMenu = ({ post }: { post: Comment }) => {
<label>
[
<input onChange={onCheckbox} checked={publishCommentEditOptions.commentModeration?.removed ?? false} type='checkbox' id='removed' />
{_.capitalize(t('remove'))}?]
{capitalize(t('remove'))}?]
</label>{' '}
<span className={styles.purgeItem}>
<label>
[
<input onChange={onPurgeCheckbox} checked={publishCommentEditOptions.commentModeration?.purged ?? false} type='checkbox' id='purged' />
{_.capitalize(t('purge'))}?]
{capitalize(t('purge'))}?]
</label>
</span>
</div>
@@ -322,7 +322,7 @@ const EditMenu = ({ post }: { post: Comment }) => {
[
<label>
<input onChange={onCheckbox} checked={publishCommentEditOptions.commentModeration?.locked ?? false} type='checkbox' id='locked' />
{_.capitalize(t('close_thread'))}?
{capitalize(t('close_thread'))}?
</label>
]
</div>
@@ -331,7 +331,7 @@ const EditMenu = ({ post }: { post: Comment }) => {
[
<label>
<input onChange={onCheckbox} checked={publishCommentEditOptions.commentModeration?.spoiler ?? false} type='checkbox' id='spoiler' />
{_.capitalize(t('spoiler'))}?
{capitalize(t('spoiler'))}?
</label>
]
</div>
@@ -339,7 +339,7 @@ const EditMenu = ({ post }: { post: Comment }) => {
[
<label>
<input onChange={onCheckbox} checked={publishCommentEditOptions.commentModeration?.pinned ?? false} type='checkbox' id='pinned' />
{_.capitalize(t('sticky'))}?
{capitalize(t('sticky'))}?
</label>
]
</div>
@@ -378,7 +378,7 @@ const EditMenu = ({ post }: { post: Comment }) => {
</>
)}
<div className={`${styles.menuItem} ${styles.menuReason}`}>
{_.capitalize(t('reason'))}? ({t('optional')})
{capitalize(t('reason'))}? ({t('optional')})
<input
type='text'
value={publishCommentEditOptions.reason || ''}
src/components/post-desktop/post-desktop.tsx
+8 -8
View File
@@ -33,7 +33,7 @@ import ReplyQuotePreview from '../reply-quote-preview';
import Tooltip from '../tooltip';
import { PostProps } from '../../views/post/post';
import { create } from 'zustand';
import _ from 'lodash';
import { capitalize, lowerCase } from 'lodash';
import { shouldShowSnow } from '../../lib/snow';
import useReplyModalStore from '../../stores/use-reply-modal-store';
import { selectPostMenuProps } from '../../lib/utils/post-menu-props';
@@ -241,9 +241,9 @@ const PostInfo = ({
<span className={styles.nameBlock}>
<span className={`${styles.name} ${authorRole && !(deleted || removed) && (authorRole === 'mod' ? styles.capcodeMod : styles.capcodeAdmin)}`}>
{deleted ? (
_.capitalize(t('deleted'))
capitalize(t('deleted'))
) : removed ? (
_.capitalize(t('removed'))
capitalize(t('removed'))
) : displayName ? (
displayName.length <= 20 ? (
displayName
@@ -254,7 +254,7 @@ const PostInfo = ({
/>
)
) : (
_.capitalize(t('anonymous'))
capitalize(t('anonymous'))
)}
{!(deleted || removed) && authorRole && (
<span className='capitalize'>
@@ -328,7 +328,7 @@ const PostInfo = ({
<>
<span>No.</span>
<span className={styles.pendingCid}>
{state === 'failed' || stateString === 'Failed' ? _.capitalize(t('failed')) : state === 'pending' ? _.capitalize(t('pending')) : ''}
{state === 'failed' || stateString === 'Failed' ? capitalize(t('failed')) : state === 'pending' ? capitalize(t('pending')) : ''}
</span>
</>
)}
@@ -346,7 +346,7 @@ const PostInfo = ({
<span className={styles.replyButton}>
[
<Link to={boardPath ? `/${boardPath}/thread/${postCid}` : `/thread/${postCid}`} onClick={(e) => !cid && e.preventDefault()}>
{_.capitalize(t('reply'))}
{capitalize(t('reply'))}
</Link>
]
</span>
@@ -507,9 +507,9 @@ const PostMedia = ({
)}
{t('link')}:{' '}
<a href={url} target='_blank' rel='noopener noreferrer'>
{spoiler ? _.capitalize(t('spoiler')) : url && url.length > 30 ? url.slice(0, 30) + '...' : url}
{spoiler ? capitalize(t('spoiler')) : url && url.length > 30 ? url.slice(0, 30) + '...' : url}
</a>{' '}
({type && _.lowerCase(getDisplayMediaInfoType(type, t))}
({type && lowerCase(getDisplayMediaInfoType(type, t))}
{mediaDimensions && `, ${mediaDimensions}`})
{!showThumbnail && (type === 'iframe' || type === 'video' || type === 'audio') && (
<span>
src/components/post-desktop/post-menu-desktop/post-menu-desktop.tsx
+2 -2
View File
@@ -12,7 +12,7 @@ import { getBoardPath } from '../../../lib/utils/route-utils';
import { useDirectories } from '../../../hooks/use-directories';
import { isAllView, isCatalogView, isPostPageView, isSubscriptionsView } from '../../../lib/utils/view-utils';
import useHide from '../../../hooks/use-hide';
import _ from 'lodash';
import { capitalize } from 'lodash';
import { PostMenuProps } from '../../../lib/utils/post-menu-props';
type CopyLinkButtonProps =
@@ -99,7 +99,7 @@ const ImageSearchButton = ({ url, onClose }: { url: string; onClose: () => void
ref={refs.setReference}
onClick={onClose}
>
{_.capitalize(t('image_search'))} »
{capitalize(t('image_search'))} »
{isImageSearchMenuOpen && (
<div ref={refs.setFloating} style={floatingStyles} className={styles.dropdownMenu}>
<a href={`https://lens.google.com/uploadbyurl?url=${url}`} target='_blank' rel='noreferrer'>
src/components/post-form/post-form.tsx
+4 -4
View File
@@ -18,7 +18,7 @@ import usePublishReply from '../../hooks/use-publish-reply';
import FileUploader from '../../plugins/file-uploader';
import styles from './post-form.module.css';
import { Capacitor } from '@capacitor/core';
import _ from 'lodash';
import { capitalize, debounce } from 'lodash';
const isAndroid = Capacitor.getPlatform() === 'android';
@@ -79,7 +79,7 @@ const PostFormTable = ({ closeForm, postCid }: { closeForm: () => void; postCid:
const [lengthError, setLengthError] = useState<string | null>(null);
const checkContentLength = useRef(
_.debounce((content: string, t: Function) => {
debounce((content: string, t: Function) => {
const length = content.trim().length;
if (length > 2000) {
setLengthError(`${t('error')}: ${t('comment_field_too_long', { length })}`);
@@ -247,7 +247,7 @@ const PostFormTable = ({ closeForm, postCid }: { closeForm: () => void; postCid:
<td>
<input
type='text'
placeholder={!displayName ? _.capitalize(t('anonymous')) : undefined}
placeholder={!displayName ? capitalize(t('anonymous')) : undefined}
defaultValue={displayName || undefined}
onChange={(e) => {
const newDisplayName = e.target.value.trim() || undefined;
@@ -326,7 +326,7 @@ const PostFormTable = ({ closeForm, postCid }: { closeForm: () => void; postCid:
type='checkbox'
onChange={(e) => (isInPostView ? setPublishReplyOptions({ spoiler: e.target.checked }) : setPublishPostOptions({ spoiler: e.target.checked }))}
/>
{_.capitalize(t('spoiler'))}?
{capitalize(t('spoiler'))}?
</label>
]
</td>
src/components/post-mobile/post-mobile.tsx
+7 -7
View File
@@ -30,7 +30,7 @@ import PostMenuMobile from './post-menu-mobile';
import ReplyQuotePreview from '../reply-quote-preview';
import Tooltip from '../tooltip';
import { PostProps } from '../../views/post/post';
import _ from 'lodash';
import { capitalize, lowerCase } from 'lodash';
import useReplyModalStore from '../../stores/use-reply-modal-store';
import { selectPostMenuProps } from '../../lib/utils/post-menu-props';
import useChallengesStore from '../../stores/use-challenges-store';
@@ -204,9 +204,9 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos
<span className={styles.nameBlock}>
<span className={`${styles.name} ${authorRole && !(deleted || removed) && (authorRole === 'mod' ? styles.capcodeMod : styles.capcodeAdmin)}`}>
{removed ? (
_.capitalize(t('removed'))
capitalize(t('removed'))
) : deleted ? (
_.capitalize(t('deleted'))
capitalize(t('deleted'))
) : displayName ? (
displayName.length <= 20 ? (
displayName
@@ -217,7 +217,7 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos
/>
)
) : (
_.capitalize(t('anonymous'))
capitalize(t('anonymous'))
)}{' '}
{!(deleted || removed) && authorRole && (
<span className='capitalize'>
@@ -242,9 +242,9 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos
<>
(ID: {''}
{removed ? (
_.lowerCase(t('removed'))
lowerCase(t('removed'))
) : deleted ? (
_.lowerCase(t('deleted'))
lowerCase(t('deleted'))
) : (
<Tooltip
children={
@@ -320,7 +320,7 @@ const PostInfoAndMedia = ({ post, postReplyCount = 0, roles, threadNumber }: Pos
<>
<span>No.</span>
<span className={styles.pendingCid}>
{state === 'failed' || stateString === 'Failed' ? _.capitalize(t('failed')) : state === 'pending' ? _.capitalize(t('pending')) : ''}
{state === 'failed' || stateString === 'Failed' ? capitalize(t('failed')) : state === 'pending' ? capitalize(t('pending')) : ''}
</span>
</>
)}
src/components/reply-modal/reply-modal.tsx
+5 -5
View File
@@ -13,7 +13,7 @@ import usePublishReply from '../../hooks/use-publish-reply';
import useIsMobile from '../../hooks/use-is-mobile';
import styles from './reply-modal.module.css';
import { LinkTypePreviewer } from '../post-form';
import _ from 'lodash';
import { capitalize, debounce } from 'lodash';
import FileUploader from '../../plugins/file-uploader';
import { Capacitor } from '@capacitor/core';
import { useSpring, animated } from '@react-spring/web';
@@ -56,7 +56,7 @@ const ReplyModal = ({ closeModal, showReplyModal, parentCid, parentNumber, threa
const [lengthError, setLengthError] = useState<string | null>(null);
const checkContentLength = useRef(
_.debounce((content: string, t: Function) => {
debounce((content: string, t: Function) => {
const length = content.trim().length;
if (length > 2000) {
setError(null);
@@ -327,7 +327,7 @@ const ReplyModal = ({ closeModal, showReplyModal, parentCid, parentNumber, threa
<input
type='text'
defaultValue={displayName}
placeholder={displayName ? undefined : _.capitalize(t('name'))}
placeholder={displayName ? undefined : capitalize(t('name'))}
onChange={(e) => {
setAccount({ ...account, author: { ...account?.author, displayName: e.target.value } });
setPublishReplyOptions({ displayName: e.target.value });
@@ -338,7 +338,7 @@ const ReplyModal = ({ closeModal, showReplyModal, parentCid, parentNumber, threa
<input
type='text'
ref={urlRef}
placeholder={_.capitalize(t('link'))}
placeholder={capitalize(t('link'))}
onChange={(e) => {
setUrl(e.target.value);
setPublishReplyOptions({ link: e.target.value });
@@ -386,7 +386,7 @@ const ReplyModal = ({ closeModal, showReplyModal, parentCid, parentNumber, threa
[
<label>
<input type='checkbox' onChange={(e) => setPublishReplyOptions({ spoiler: e.target.checked })} />
{_.capitalize(t('spoiler'))}?
{capitalize(t('spoiler'))}?
</label>
]
</span>
src/components/settings-modal/avatar-settings/avatar-settings.tsx
+4 -4
View File
@@ -5,7 +5,7 @@ import styles from './avatar-settings.module.css';
import { Trans, useTranslation } from 'react-i18next';
import LoadingEllipsis from '../../loading-ellipsis';
import ErrorDisplay from '../../error-display/error-display';
import _ from 'lodash';
import { capitalize } from 'lodash';
const AvatarPreview = ({ avatar }: any) => {
const { t } = useTranslation();
@@ -132,7 +132,7 @@ const AvatarSettings = () => {
<AvatarPreview avatar={avatar} />
<div className={styles.avatarSettingsForm}>
<div className={`${styles.settingField} ${styles.step1}`}>
<span className={styles.settingTitle}>{_.capitalize(t('chain_ticker'))}: </span>
<span className={styles.settingTitle}>{capitalize(t('chain_ticker'))}: </span>
<input
type='text'
placeholder='eth/sol/matic'
@@ -197,7 +197,7 @@ const AvatarSettings = () => {
</span>
</div>
<div className={styles.settingField}>
<span className={`${styles.settingTitle} ${styles.timestampfield}`}>{_.capitalize(t('timestamp'))}: </span>
<span className={`${styles.settingTitle} ${styles.timestampfield}`}>{capitalize(t('timestamp'))}: </span>
<input
type='text'
placeholder='1234567890'
@@ -209,7 +209,7 @@ const AvatarSettings = () => {
/>
</div>
<div className={`${styles.settingField} ${styles.step5}`}>
<span className={styles.settingTitle}>{_.capitalize(t('paste_signature'))}: </span>
<span className={styles.settingTitle}>{capitalize(t('paste_signature'))}: </span>
<input
type='text'
placeholder='0x...'
src/components/settings-modal/crypto-wallets-setting/crypto-wallets-setting.tsx
+5 -5
View File
@@ -2,7 +2,7 @@ import { useState } from 'react';
import { Account, setAccount, useAccount } from '@plebbit/plebbit-react-hooks';
import styles from './crypto-wallets-setting.module.css';
import { Trans, useTranslation } from 'react-i18next';
import _ from 'lodash';
import { capitalize } from 'lodash';
interface Wallet {
chainTicker: string;
@@ -102,7 +102,7 @@ const CryptoWalletsForm = ({ account }: { account: Account | undefined }) => {
walletsArray.length > 0 ? (
<div key={selectedWallet} className={styles.walletBox}>
<div className={`${styles.walletField} ${styles.step1}`}>
<span className={styles.walletFieldTitle}>{_.capitalize(t('chain_ticker'))}: </span>
<span className={styles.walletFieldTitle}>{capitalize(t('chain_ticker'))}: </span>
<input
type='text'
onChange={(e) => setWalletsArrayProperty(selectedWallet, 'chainTicker', e.target.value)}
@@ -111,7 +111,7 @@ const CryptoWalletsForm = ({ account }: { account: Account | undefined }) => {
/>
</div>
<div className={`${styles.walletField} ${styles.step2}`}>
<span className={styles.walletFieldTitle}>{_.capitalize(t('wallet_address'))}: </span>
<span className={styles.walletFieldTitle}>{capitalize(t('wallet_address'))}: </span>
<input
type='text'
onChange={(e) => setWalletsArrayProperty(selectedWallet, 'address', e.target.value)}
@@ -133,7 +133,7 @@ const CryptoWalletsForm = ({ account }: { account: Account | undefined }) => {
</span>
</div>
<div className={styles.walletField}>
<span className={`${styles.walletFieldTitle} ${styles.timestampfield}`}>{_.capitalize(t('timestamp'))}: </span>
<span className={`${styles.walletFieldTitle} ${styles.timestampfield}`}>{capitalize(t('timestamp'))}: </span>
<input
type='text'
onChange={(e) => setWalletsArrayProperty(selectedWallet, 'timestamp', Number(e.target.value))}
@@ -142,7 +142,7 @@ const CryptoWalletsForm = ({ account }: { account: Account | undefined }) => {
/>
</div>
<div className={`${styles.walletField} ${styles.step4}`}>
<span className={styles.walletFieldTitle}>{_.capitalize(t('paste_signature'))}: </span>
<span className={styles.walletFieldTitle}>{capitalize(t('paste_signature'))}: </span>
<input
type='text'
onChange={(e) => setWalletsArrayProperty(selectedWallet, 'signature', e.target.value)}
src/components/settings-modal/interface-settings/interface-settings.tsx
+11 -11
View File
@@ -4,7 +4,7 @@ import useAvatarVisibilityStore from '../../../stores/use-avatar-visibility-stor
import useTheme from '../../../hooks/use-theme';
import packageJson from '../../../../package.json';
import styles from './interface-settings.module.css';
import _ from 'lodash';
import { capitalize } from 'lodash';
import useInterfaceSettingsStore from '../../../stores/use-interface-settings-store';
import useCatalogFiltersStore from '../../../stores/use-catalog-filters-store';
import useExpandedMediaStore from '../../../stores/use-expanded-media-store';
@@ -138,16 +138,16 @@ const InterfaceSettings = () => {
return (
<div className={styles.interfaceSettings}>
<div className={styles.version}>
{_.capitalize(t('version'))}: <Version />
{capitalize(t('version'))}: <Version />
</div>
<div className={styles.setting}>
{_.capitalize(t('update'))}: <CheckForUpdates />
{capitalize(t('update'))}: <CheckForUpdates />
</div>
<div className={styles.setting}>
{_.capitalize(t('style'))}: <Style />
{capitalize(t('style'))}: <Style />
</div>
<div className={styles.setting}>
{_.capitalize(t('interface_language'))}: <InterfaceLanguage />
{capitalize(t('interface_language'))}: <InterfaceLanguage />
</div>
<div className={styles.setting}>
<label>
@@ -159,22 +159,22 @@ const InterfaceSettings = () => {
setShowTextOnlyThreads(!e.target.checked);
}}
/>
{_.capitalize(t('hide_threads_without_images'))}
{capitalize(t('hide_threads_without_images'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('threads_without_images_tip'))}</div>
<div className={styles.settingTip}>{capitalize(t('threads_without_images_tip'))}</div>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={fitExpandedImagesToScreen} onChange={(e) => setFitExpandedImagesToScreen(e.target.checked)} />
{_.capitalize(t('fit_expanded_images_to_screen'))}
{capitalize(t('fit_expanded_images_to_screen'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('fit_expanded_images_to_screen_tip'))}</div>
<div className={styles.settingTip}>{capitalize(t('fit_expanded_images_to_screen_tip'))}</div>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideAvatars} onChange={handleHideAvatarsChange} /> {_.capitalize(t('hide_avatars'))}
<input type='checkbox' checked={hideAvatars} onChange={handleHideAvatarsChange} /> {capitalize(t('hide_avatars'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('hide_avatars_tip'))}</div>
<div className={styles.settingTip}>{capitalize(t('hide_avatars_tip'))}</div>
</div>
</div>
);
src/components/topbar/topbar.tsx
+4 -4
View File
@@ -15,14 +15,14 @@ import useTopbarVisibilityStore from '../../stores/use-topbar-visibility-store';
import useDirectoryModalStore from '../../stores/use-directory-modal-store';
import { BOARD_CODE_GROUPS, getAllBoardCodes } from '../../constants/board-codes';
import styles from './topbar.module.css';
import _, { debounce } from 'lodash';
import { capitalize, debounce, lowerCase } from 'lodash';
const SearchBar = ({ setShowSearchBar }: { setShowSearchBar: (show: boolean) => void }) => {
const { t } = useTranslation();
const navigate = useNavigate();
const searchBarRef = useRef<HTMLDivElement>(null);
const searchInputRef = useRef<HTMLInputElement>(null);
const placeholder = _.lowerCase(t('enter_board_address'));
const placeholder = lowerCase(t('enter_board_address'));
useEffect(() => {
searchInputRef.current?.focus();
@@ -229,7 +229,7 @@ const TopBarDesktop = () => {
)}
[
<span className={styles.temporaryButton} onClick={() => openTopbarEditModal()} style={{ cursor: 'pointer' }}>
{_.capitalize(t('edit'))}
{capitalize(t('edit'))}
</span>
] [
<span className={styles.temporaryButton} onClick={() => openCreateBoardModal()} style={{ cursor: 'pointer' }}>
@@ -338,7 +338,7 @@ const TopBarMobile = ({ subplebbitAddress }: { subplebbitAddress: string }) => {
</div>
<div className={styles.pageJump}>
<Link to={useLocation().pathname.replace(/\/$/, '') + '/settings'}>{t('settings')}</Link>
<span onClick={() => setShowSearchBar(!showSearchBar)}>{_.capitalize(t('search'))}</span>
<span onClick={() => setShowSearchBar(!showSearchBar)}>{capitalize(t('search'))}</span>
<Link to='/'>{t('home')}</Link>
{showSearchBar && <SearchBar setShowSearchBar={setShowSearchBar} />}
</div>
src/views/home/home.tsx
+2 -2
View File
@@ -12,7 +12,7 @@ import useDirectoryModalStore from '../../stores/use-directory-modal-store';
import DisclaimerModal from '../../components/disclaimer-modal';
import DirectoryModal from '../../components/directory-modal';
import { getBoardPath } from '../../lib/utils/route-utils';
import _ from 'lodash';
import { lowerCase } from 'lodash';
// https://github.com/plebbit/lists/blob/master/5chan-directories.json
@@ -40,7 +40,7 @@ const SearchBar = () => {
spellCheck='false'
autoCapitalize='off'
type='text'
placeholder={_.lowerCase(t('enter_board_address'))}
placeholder={lowerCase(t('enter_board_address'))}
ref={searchInputRef}
/>
<button className={styles.searchButton}>{t('go')}</button>
src/views/mod-queue/mod-queue.tsx
+3 -3
View File
@@ -21,7 +21,7 @@ import { alertChallengeVerificationFailed } from '../../lib/utils/challenge-util
import Tooltip from '../../components/tooltip';
import useIsMobile from '../../hooks/use-is-mobile';
import { Post } from '../post/post';
import _ from 'lodash';
import { capitalize, lowerCase } from 'lodash';
const { addChallenge } = useChallengesStore.getState();
@@ -273,7 +273,7 @@ const ModQueueRow = ({ comment, isOdd = false }: ModQueueRowProps) => {
<Tooltip children={<span>{getFormattedDate(timestamp)}</span>} content={getFormattedTimeAgo(timestamp)} />
)}
</div>
<div className={styles.type}>{isReply ? _.capitalize(t('reply')) : _.capitalize(t('post'))}</div>
<div className={styles.type}>{isReply ? capitalize(t('reply')) : capitalize(t('post'))}</div>
<div className={styles.image}>{hasThumbnail ? t('yes') : t('no')}</div>
<div className={styles.actions}>{renderActions()}</div>
</div>
@@ -390,7 +390,7 @@ const ModQueueCard = ({ comment }: ModQueueCardProps) => {
) : (
<span title={excerpt}>{excerpt}</span>
)}{' '}
/ {t('type')}: {isReply ? t('reply') : t('post')} / {_.capitalize(t('image'))}: {hasThumbnail ? _.lowerCase(t('yes')) : _.lowerCase(t('no'))}
/ {t('type')}: {isReply ? t('reply') : t('post')} / {capitalize(t('image'))}: {hasThumbnail ? lowerCase(t('yes')) : lowerCase(t('no'))}
</div>
{renderActions()}
</div>