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(settings-modal): move crypto settings under Bitsocial Account section

Browse Source
This commit is contained in:
plebeius
2026-02-19 18:37:43 +08:00
parent d1f7f92353
commit 274cb6a22c
2 changed files with 22 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/settings-modal/settings-modal.module.css
+10
View File
@@ -131,6 +131,16 @@
font-weight: 700; font-weight: 700;
} }
.subSectionHeader {
text-align: left;
font-weight: 700;
font-size: 14px;
margin: 15px 10px 10px;
padding-top: 10px;
border-top: var(--settings-modal-header-border-bottom);
text-transform: capitalize;
}
.checkForUpdatesButton { .checkForUpdatesButton {
text-transform: capitalize; text-transform: capitalize;
} }
src/components/settings-modal/settings-modal.tsx
+12 -31
View File
@@ -37,21 +37,13 @@ const SettingsModal = () => {
const [showInterfaceSettings, setShowInterfaceSettings] = useState(false); const [showInterfaceSettings, setShowInterfaceSettings] = useState(false);
const [showMediaHostingSettings, setShowMediaHostingSettings] = useState(false); const [showMediaHostingSettings, setShowMediaHostingSettings] = useState(false);
const [showAccountSettings, setShowAccountSettings] = useState(false); const [showAccountSettings, setShowAccountSettings] = useState(false);
const [showCryptoAddressSetting, setShowCryptoAddressSetting] = useState(false);
const [showCryptoWalletSettings, setShowCryptoWalletSettings] = useState(false);
const [showSubscriptionsSettings, setShowSubscriptionsSettings] = useState(false); const [showSubscriptionsSettings, setShowSubscriptionsSettings] = useState(false);
const [showAdvancedSettings, setShowAdvancedSettings] = useState(false); const [showAdvancedSettings, setShowAdvancedSettings] = useState(false);
const [expandAll, setExpandAll] = useState(false); const [expandAll, setExpandAll] = useState(false);
const getExpandedCount = () => { const getExpandedCount = () => {
return ( return (
Number(showInterfaceSettings) + Number(showInterfaceSettings) + Number(showMediaHostingSettings) + Number(showAccountSettings) + Number(showSubscriptionsSettings) + Number(showAdvancedSettings)
Number(showMediaHostingSettings) +
Number(showAccountSettings) +
Number(showCryptoAddressSetting) +
Number(showCryptoWalletSettings) +
Number(showSubscriptionsSettings) +
Number(showAdvancedSettings)
); );
}; };
@@ -59,8 +51,6 @@ const SettingsModal = () => {
if (showInterfaceSettings && 'interface-settings' !== excludeCategoryId) return 'interface-settings'; if (showInterfaceSettings && 'interface-settings' !== excludeCategoryId) return 'interface-settings';
if (showMediaHostingSettings && 'media-hosting-settings' !== excludeCategoryId) return 'media-hosting-settings'; if (showMediaHostingSettings && 'media-hosting-settings' !== excludeCategoryId) return 'media-hosting-settings';
if (showAccountSettings && 'account-settings' !== excludeCategoryId) return 'account-settings'; if (showAccountSettings && 'account-settings' !== excludeCategoryId) return 'account-settings';
if (showCryptoAddressSetting && 'crypto-address-settings' !== excludeCategoryId) return 'crypto-address-settings';
if (showCryptoWalletSettings && 'crypto-wallet-settings' !== excludeCategoryId) return 'crypto-wallet-settings';
if (showSubscriptionsSettings && 'subscriptions-settings' !== excludeCategoryId) return 'subscriptions-settings'; if (showSubscriptionsSettings && 'subscriptions-settings' !== excludeCategoryId) return 'subscriptions-settings';
if (showAdvancedSettings && 'advanced-settings' !== excludeCategoryId) return 'advanced-settings'; if (showAdvancedSettings && 'advanced-settings' !== excludeCategoryId) return 'advanced-settings';
return null; return null;
@@ -95,11 +85,10 @@ const SettingsModal = () => {
useEffect(() => { useEffect(() => {
if (hash) { if (hash) {
const expandAccount = hash === 'account-settings' || hash === 'crypto-address-settings' || hash === 'crypto-wallet-settings';
setShowInterfaceSettings(hash === 'interface-settings'); setShowInterfaceSettings(hash === 'interface-settings');
setShowMediaHostingSettings(hash === 'media-hosting-settings'); setShowMediaHostingSettings(hash === 'media-hosting-settings');
setShowAccountSettings(hash === 'account-settings'); setShowAccountSettings(expandAccount);
setShowCryptoAddressSetting(hash === 'crypto-address-settings');
setShowCryptoWalletSettings(hash === 'crypto-wallet-settings');
setShowSubscriptionsSettings(hash === 'subscriptions-settings'); setShowSubscriptionsSettings(hash === 'subscriptions-settings');
setShowAdvancedSettings(hash === 'advanced-settings'); setShowAdvancedSettings(hash === 'advanced-settings');
} }
@@ -111,8 +100,6 @@ const SettingsModal = () => {
setShowInterfaceSettings(newExpandState); setShowInterfaceSettings(newExpandState);
setShowMediaHostingSettings(newExpandState); setShowMediaHostingSettings(newExpandState);
setShowAccountSettings(newExpandState); setShowAccountSettings(newExpandState);
setShowCryptoAddressSetting(newExpandState);
setShowCryptoWalletSettings(newExpandState);
setShowSubscriptionsSettings(newExpandState); setShowSubscriptionsSettings(newExpandState);
setShowAdvancedSettings(newExpandState); setShowAdvancedSettings(newExpandState);
@@ -151,21 +138,15 @@ const SettingsModal = () => {
{t('bitsocial_account')} {t('bitsocial_account')}
</label> </label>
</div> </div>
{showAccountSettings && <AccountSettings />} {showAccountSettings && (
<div id='crypto-address-settings' className={`${styles.setting} ${styles.category}`}> <>
<label onClick={() => handleCategoryClick('crypto-address-settings', showCryptoAddressSetting, setShowCryptoAddressSetting)}> <AccountSettings />
<span className={showCryptoAddressSetting ? styles.hideButton : styles.showButton} /> <div className={styles.subSectionHeader}>{t('crypto_address')}</div>
{t('crypto_address')} <CryptoAddressSetting />
</label> <div className={styles.subSectionHeader}>{t('crypto_wallets')}</div>
</div> <CryptoWalletsSetting />
{showCryptoAddressSetting && <CryptoAddressSetting />} </>
<div id='crypto-wallet-settings' className={`${styles.setting} ${styles.category}`}> )}
<label onClick={() => handleCategoryClick('crypto-wallet-settings', showCryptoWalletSettings, setShowCryptoWalletSettings)}>
<span className={showCryptoWalletSettings ? styles.hideButton : styles.showButton} />
{t('crypto_wallets')}
</label>
</div>
{showCryptoWalletSettings && <CryptoWalletsSetting />}
<div id='subscriptions-settings' className={`${styles.setting} ${styles.category}`}> <div id='subscriptions-settings' className={`${styles.setting} ${styles.category}`}>
<label onClick={() => handleCategoryClick('subscriptions-settings', showSubscriptionsSettings, setShowSubscriptionsSettings)}> <label onClick={() => handleCategoryClick('subscriptions-settings', showSubscriptionsSettings, setShowSubscriptionsSettings)}>
<span className={showSubscriptionsSettings ? styles.hideButton : styles.showButton} /> <span className={showSubscriptionsSettings ? styles.hideButton : styles.showButton} />