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

fix(hooks): handle pkc rebrand regressions

Browse Source
This commit is contained in:
Tommaso Casaburi
2026-04-11 16:57:00 +07:00
parent dcb3c4427c
commit 19095aefa1
19 changed files with 317 additions and 1186 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/settings-modal/advanced-settings/__tests__/advanced-settings.test.tsx
+16 -16
View File
@@ -9,20 +9,20 @@ const act = (React as { act?: (cb: () => void | Promise<void>) => void | Promise
const testState = vi.hoisted(() => ({
account: {
mediaIpfsGatewayUrl: 'https://media.old.example',
plebbitOptions: {
pkcOptions: {
chainProviders: {
eth: { chainId: 1, urls: ['https://eth.old.example'] },
sol: { chainId: 101, urls: ['https://sol.old.example'] },
},
httpRoutersOptions: ['https://router.old.example'],
ipfsGatewayUrls: ['https://ipfs.old.example'],
plebbitRpcClientsOptions: ['ws://old.example/key'],
pubsubHttpClientsOptions: ['https://pubsub.old.example'],
pkcRpcClientsOptions: ['ws://old.example/key'],
pubsubKuboRpcClientsOptions: ['https://pubsub.old.example'],
},
} as Record<string, any>,
rpcSettings: {
plebbitRpcSettings: {
plebbitOptions: {
pkcRpcSettings: {
pkcOptions: {
dataPath: '/tmp/plebbit-data',
},
},
@@ -40,7 +40,7 @@ vi.mock('react-i18next', () => ({
vi.mock('@bitsocialnet/bitsocial-react-hooks', () => ({
setAccount: (account: unknown) => testState.setAccountMock(account),
useAccount: () => testState.account,
usePlebbitRpcSettings: () => testState.rpcSettings,
usePkcRpcSettings: () => testState.rpcSettings,
}));
let alertSpy: ReturnType<typeof vi.spyOn>;
@@ -86,20 +86,20 @@ describe('AdvancedSettings', () => {
vi.clearAllMocks();
testState.account = {
mediaIpfsGatewayUrl: 'https://media.old.example',
plebbitOptions: {
pkcOptions: {
chainProviders: {
eth: { chainId: 1, urls: ['https://eth.old.example'] },
sol: { chainId: 101, urls: ['https://sol.old.example'] },
},
httpRoutersOptions: ['https://router.old.example'],
ipfsGatewayUrls: ['https://ipfs.old.example'],
plebbitRpcClientsOptions: ['ws://old.example/key'],
pubsubHttpClientsOptions: ['https://pubsub.old.example'],
pkcRpcClientsOptions: ['ws://old.example/key'],
pubsubKuboRpcClientsOptions: ['https://pubsub.old.example'],
},
};
testState.rpcSettings = {
plebbitRpcSettings: {
plebbitOptions: {
pkcRpcSettings: {
pkcOptions: {
dataPath: '/tmp/plebbit-data',
},
},
@@ -154,7 +154,7 @@ describe('AdvancedSettings', () => {
expect(testState.setAccountMock).toHaveBeenCalledWith({
mediaIpfsGatewayUrl: 'https://media.new.example',
plebbitOptions: {
pkcOptions: {
chainProviders: {
eth: { chainId: 1, urls: ['https://eth.one.example'] },
sol: { chainId: 101, urls: ['https://sol.one.example'] },
@@ -162,8 +162,8 @@ describe('AdvancedSettings', () => {
dataPath: '/tmp/next-plebbit',
httpRoutersOptions: ['https://router.one.example'],
ipfsGatewayUrls: ['https://ipfs.one.example', 'https://ipfs.two.example'],
plebbitRpcClientsOptions: ['ws://127.0.0.1:9138/secret'],
pubsubHttpClientsOptions: ['https://pubsub.one.example'],
pkcRpcClientsOptions: ['ws://127.0.0.1:9138/secret'],
pubsubKuboRpcClientsOptions: ['https://pubsub.one.example'],
},
});
expect(alertSpy).toHaveBeenCalledWith('Options saved, reloading...');
@@ -172,8 +172,8 @@ describe('AdvancedSettings', () => {
it('disables remote-managed textareas and shows the electron data path when RPC is connected', async () => {
testState.rpcSettings = {
plebbitRpcSettings: {
plebbitOptions: {
pkcRpcSettings: {
pkcOptions: {
dataPath: '/tmp/connected-node',
},
},
src/components/settings-modal/advanced-settings/advanced-settings.tsx
+72 -38
View File
@@ -1,5 +1,5 @@
import { memo, RefObject, useRef, useState } from 'react';
import { setAccount, useAccount, usePlebbitRpcSettings } from '@bitsocialnet/bitsocial-react-hooks';
import { setAccount, useAccount, usePkcRpcSettings } from '@bitsocialnet/bitsocial-react-hooks';
import { useTranslation } from 'react-i18next';
import styles from './advanced-settings.module.css';
@@ -14,12 +14,47 @@ interface SettingsProps {
p2pDataPathRef?: RefObject<HTMLInputElement>;
}
type AccountProtocolOptions = {
chainProviders?: Record<string, { urls?: string[]; chainId: number }>;
dataPath?: string;
httpRoutersOptions?: string[];
ipfsGatewayUrls?: string[];
pkcRpcClientsOptions?: string[];
plebbitRpcClientsOptions?: string[];
pubsubHttpClientsOptions?: string[];
pubsubKuboRpcClientsOptions?: string[];
};
type AccountShape = {
chainProviders?: AccountProtocolOptions['chainProviders'];
mediaIpfsGatewayUrl?: string;
pkcOptions?: AccountProtocolOptions;
plebbitOptions?: AccountProtocolOptions;
};
type RpcSettingsShape = {
pkcOptions?: { dataPath?: string };
plebbitOptions?: { dataPath?: string };
};
const getProtocolOptions = (account?: AccountShape) => account?.pkcOptions ?? account?.plebbitOptions;
const getChainProviders = (account?: AccountShape) => account?.chainProviders ?? getProtocolOptions(account)?.chainProviders;
const getNodeRpcClientsOptions = (protocolOptions?: AccountProtocolOptions) => protocolOptions?.pkcRpcClientsOptions ?? protocolOptions?.plebbitRpcClientsOptions;
const getPubsubRpcClientsOptions = (protocolOptions?: AccountProtocolOptions) =>
protocolOptions?.pubsubKuboRpcClientsOptions ?? protocolOptions?.pubsubHttpClientsOptions;
const getRpcSettingsDataPath = (rpcSettings?: RpcSettingsShape) => rpcSettings?.pkcOptions?.dataPath ?? rpcSettings?.plebbitOptions?.dataPath ?? '';
const IPFSGatewaysSettings = ({ ipfsGatewayUrlsRef, mediaIpfsGatewayUrlRef }: SettingsProps) => {
const account = useAccount();
const { plebbitOptions, mediaIpfsGatewayUrl } = account || {};
const { ipfsGatewayUrls } = plebbitOptions || {};
const plebbitRpc = usePlebbitRpcSettings();
const isConnectedToRpc = plebbitRpc?.state === 'connected';
const account = useAccount() as AccountShape | undefined;
const protocolOptions = getProtocolOptions(account);
const { ipfsGatewayUrls } = protocolOptions || {};
const { mediaIpfsGatewayUrl } = account || {};
const pkcRpc = usePkcRpcSettings();
const isConnectedToRpc = pkcRpc?.state === 'connected';
const ipfsGatewayUrlsDefaultValue = ipfsGatewayUrls?.join('\n');
return (
@@ -52,12 +87,12 @@ const IPFSGatewaysSettings = ({ ipfsGatewayUrlsRef, mediaIpfsGatewayUrlRef }: Se
};
const PubsubProvidersSettings = ({ pubsubProvidersRef }: SettingsProps) => {
const account = useAccount();
const { plebbitOptions } = account || {};
const { pubsubHttpClientsOptions } = plebbitOptions || {};
const plebbitRpc = usePlebbitRpcSettings();
const isConnectedToRpc = plebbitRpc?.state === 'connected';
const pubsubProvidersDefaultValue = pubsubHttpClientsOptions?.join('\n');
const account = useAccount() as AccountShape | undefined;
const protocolOptions = getProtocolOptions(account);
const pubsubKuboRpcClientsOptions = getPubsubRpcClientsOptions(protocolOptions);
const pkcRpc = usePkcRpcSettings();
const isConnectedToRpc = pkcRpc?.state === 'connected';
const pubsubProvidersDefaultValue = pubsubKuboRpcClientsOptions?.join('\n');
return (
<div className={styles.pubsubProvidersSettings}>
@@ -69,18 +104,18 @@ const PubsubProvidersSettings = ({ pubsubProvidersRef }: SettingsProps) => {
autoCapitalize='off'
autoComplete='off'
spellCheck='false'
rows={pubsubHttpClientsOptions?.length || 1}
rows={pubsubKuboRpcClientsOptions?.length || 1}
/>
</div>
);
};
const HttpRoutersSettings = ({ httpRoutersRef }: SettingsProps) => {
const account = useAccount();
const { plebbitOptions } = account || {};
const { httpRoutersOptions } = plebbitOptions || {};
const plebbitRpc = usePlebbitRpcSettings();
const isConnectedToRpc = plebbitRpc?.state === 'connected';
const account = useAccount() as AccountShape | undefined;
const protocolOptions = getProtocolOptions(account);
const { httpRoutersOptions } = protocolOptions || {};
const pkcRpc = usePkcRpcSettings();
const isConnectedToRpc = pkcRpc?.state === 'connected';
const httpRoutersDefaultValue = httpRoutersOptions?.join('\n');
return (
@@ -100,11 +135,10 @@ const HttpRoutersSettings = ({ httpRoutersRef }: SettingsProps) => {
};
const BlockchainProvidersSettings = ({ ethRpcRef, solRpcRef }: SettingsProps) => {
const account = useAccount();
const { plebbitOptions } = account || {};
const { chainProviders } = plebbitOptions || {};
const ethRpcDefaultValue = chainProviders?.['eth']?.urls.join('\n');
const solRpcDefaultValue = chainProviders?.['sol']?.urls.join('\n');
const account = useAccount() as AccountShape | undefined;
const chainProviders = getChainProviders(account);
const ethRpcDefaultValue = chainProviders?.['eth']?.urls?.join('\n');
const solRpcDefaultValue = chainProviders?.['sol']?.urls?.join('\n');
return (
<div className={styles.blockchainProvidersSettings}>
@@ -136,14 +170,14 @@ const BlockchainProvidersSettings = ({ ethRpcRef, solRpcRef }: SettingsProps) =>
const P2pRPCSettings = ({ p2pRpcRef }: SettingsProps) => {
const [showInfo, setShowInfo] = useState(false);
const account = useAccount();
const { plebbitOptions } = account || {};
const { plebbitRpcClientsOptions } = plebbitOptions || {};
const account = useAccount() as AccountShape | undefined;
const protocolOptions = getProtocolOptions(account);
const pkcRpcClientsOptions = getNodeRpcClientsOptions(protocolOptions);
return (
<div className={styles.p2pRPCSettings}>
<div>
<input type='text' defaultValue={plebbitRpcClientsOptions} ref={p2pRpcRef} autoCorrect='off' autoCapitalize='off' spellCheck='false' />
<input type='text' defaultValue={pkcRpcClientsOptions} ref={p2pRpcRef} autoCorrect='off' autoCapitalize='off' spellCheck='false' />
<button onClick={() => setShowInfo(!showInfo)}>{showInfo ? 'X' : '?'}</button>
</div>
{showInfo && (
@@ -165,10 +199,10 @@ const P2pRPCSettings = ({ p2pRpcRef }: SettingsProps) => {
};
const P2pDataPathSettings = ({ p2pDataPathRef }: SettingsProps) => {
const plebbitRpc = usePlebbitRpcSettings();
const { plebbitRpcSettings } = plebbitRpc || {};
const isConnectedToRpc = plebbitRpc?.state === 'connected';
const path = plebbitRpcSettings?.plebbitOptions?.dataPath || '';
const pkcRpc = usePkcRpcSettings();
const { pkcRpcSettings } = pkcRpc || {};
const isConnectedToRpc = pkcRpc?.state === 'connected';
const path = getRpcSettingsDataPath(pkcRpcSettings as RpcSettingsShape | undefined);
return (
<div className={styles.p2pDataPathSettings}>
@@ -183,8 +217,8 @@ const isElectron = window.electronApi?.isElectron === true;
const AdvancedSettings = () => {
const { t } = useTranslation();
const account = useAccount();
const { plebbitOptions } = account || {};
const account = useAccount() as AccountShape | undefined;
const protocolOptions = getProtocolOptions(account);
const ipfsGatewayUrlsRef = useRef<HTMLTextAreaElement>(null);
const mediaIpfsGatewayUrlRef = useRef<HTMLInputElement>(null);
@@ -223,7 +257,7 @@ const AdvancedSettings = () => {
.map((url) => url.trim())
.filter((url) => url !== '');
const plebbitRpcClientsOptions = p2pRpcRef.current?.value.trim() ? [p2pRpcRef.current.value.trim()] : undefined;
const pkcRpcClientsOptions = p2pRpcRef.current?.value.trim() ? [p2pRpcRef.current.value.trim()] : undefined;
const dataPath = p2pDataPathRef.current?.value.trim() || undefined;
const chainProviders: Record<string, { urls: string[] | undefined; chainId: number }> = {};
@@ -238,13 +272,13 @@ const AdvancedSettings = () => {
await setAccount({
...account,
mediaIpfsGatewayUrl,
plebbitOptions: {
...plebbitOptions,
pkcOptions: {
...protocolOptions,
ipfsGatewayUrls,
pubsubHttpClientsOptions,
pubsubKuboRpcClientsOptions: pubsubHttpClientsOptions,
chainProviders,
httpRoutersOptions,
plebbitRpcClientsOptions,
pkcRpcClientsOptions,
dataPath,
},
});