From 1f10a0a26277cffc3420e063644663925231bb0a Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Sat, 23 Sep 2023 10:16:23 +0200 Subject: [PATCH 1/7] chore(prettier.config.js): use spaces instead of tabs for indentation --- prettier.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/prettier.config.js b/prettier.config.js index 31549966..1adf0f16 100644 --- a/prettier.config.js +++ b/prettier.config.js @@ -7,5 +7,5 @@ module.exports = { trailingComma: 'all', jsxSingleQuote: true, arrowParens: 'always', - useTabs: true, + useTabs: false, } \ No newline at end of file From 4cd1b1ce99c13e63866c4af6797179f8d4965720 Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Sat, 23 Sep 2023 10:30:48 +0200 Subject: [PATCH 2/7] chore(prettier): prettify --- src/components/BoardAvatar.jsx | 16 +- src/components/BoardSettings.jsx | 536 +++++++++++++------------- src/components/BoardStats.jsx | 120 +++--- src/components/CatalogLoader.jsx | 74 ++-- src/components/EditLabel.jsx | 100 ++--- src/components/Embed.jsx | 396 +++++++++---------- src/components/ForwardRefLink.jsx | 38 +- src/components/ImageBanner.jsx | 46 +-- src/components/OfflineIndicator.jsx | 40 +- src/components/PendingLabel.jsx | 18 +- src/components/Post.jsx | 218 +++++------ src/components/PostLoader.jsx | 54 +-- src/components/PostOnHover.jsx | 572 ++++++++++++++-------------- src/components/StateLabel.jsx | 32 +- src/components/VerifiedAuthor.jsx | 6 +- src/hooks/useAnonMode.js | 34 +- src/hooks/useAnonModeRef.js | 34 +- src/hooks/useClickForm.js | 12 +- src/hooks/useError.js | 76 ++-- src/hooks/useFeedRows.js | 26 +- src/hooks/useFeedStateString.js | 150 ++++---- src/hooks/useInfo.js | 60 +-- src/hooks/useStateString.js | 88 ++--- src/hooks/useSuccess.js | 60 +-- src/hooks/useWindowWidth.js | 18 +- src/utils/countLinks.js | 24 +- src/utils/findShortParentCid.js | 26 +- src/utils/getCommentMediaInfo.js | 124 +++--- src/utils/getDate.js | 62 +-- src/utils/getFormattedTime.js | 70 ++-- src/utils/handleAddressClick.js | 56 +-- src/utils/handleImageClick.js | 12 +- src/utils/handleQuoteClick.js | 74 ++-- src/utils/handleQuoteHover.js | 64 ++-- src/utils/handleShareClick.js | 46 +-- src/utils/handleStyleChange.js | 158 ++++---- src/utils/isValidUrl.js | 12 +- src/utils/preloadImages.js | 8 +- src/utils/removeHighlight.js | 8 +- 39 files changed, 1784 insertions(+), 1784 deletions(-) diff --git a/src/components/BoardAvatar.jsx b/src/components/BoardAvatar.jsx index f94359d6..bc1f5010 100644 --- a/src/components/BoardAvatar.jsx +++ b/src/components/BoardAvatar.jsx @@ -2,16 +2,16 @@ import React, { useEffect, useState } from 'react'; import { useSubplebbit } from '@plebbit/plebbit-react-hooks'; const BoardAvatar = ({ address }) => { - const [avatarUrl, setAvatarUrl] = useState('assets/plebchan.png'); - const subplebbit = useSubplebbit({ subplebbitAddress: address }); + const [avatarUrl, setAvatarUrl] = useState('assets/plebchan.png'); + const subplebbit = useSubplebbit({ subplebbitAddress: address }); - useEffect(() => { - if (subplebbit.suggested?.avatarUrl) { - setAvatarUrl(subplebbit.suggested?.avatarUrl); - } - }, [subplebbit.suggested?.avatarUrl, subplebbit]); + useEffect(() => { + if (subplebbit.suggested?.avatarUrl) { + setAvatarUrl(subplebbit.suggested?.avatarUrl); + } + }, [subplebbit.suggested?.avatarUrl, subplebbit]); - return board avatar; + return board avatar; }; export default BoardAvatar; diff --git a/src/components/BoardSettings.jsx b/src/components/BoardSettings.jsx index 113d0449..49055b29 100644 --- a/src/components/BoardSettings.jsx +++ b/src/components/BoardSettings.jsx @@ -7,309 +7,309 @@ import useSuccess from '../hooks/useSuccess'; import useGeneralStore from '../hooks/stores/useGeneralStore'; const BoardSettings = ({ subplebbit }) => { - const { setCaptchaResponse, setChallengesArray, setIsCaptchaOpen, setResolveCaptchaPromise, selectedAddress, selectedStyle } = useGeneralStore((state) => state); + const { setCaptchaResponse, setChallengesArray, setIsCaptchaOpen, setResolveCaptchaPromise, selectedAddress, selectedStyle } = useGeneralStore((state) => state); - const allowedSettings = { - address: subplebbit.address, - apiUrl: subplebbit.apiUrl, - description: subplebbit.description, - pubsubTopic: subplebbit.pubsubTopic, - settings: { - fetchThumbnailUrls: subplebbit.settings?.fetchThumbnailUrls, - fetchThumbnailUrlsProxyUrl: subplebbit.settings?.fetchThumbnailUrlsProxyUrl, - }, - roles: subplebbit.roles, - rules: subplebbit.rules, - suggested: { - avatarUrl: subplebbit.suggested?.avatarUrl, - backgroundUrl: subplebbit.suggested?.backgroundUrl, - bannerUrl: subplebbit.suggested?.bannerUrl, - language: subplebbit.suggested?.language, - primaryColor: subplebbit.suggested?.primaryColor, - secondaryColor: subplebbit.suggested?.secondaryColor, - }, - title: subplebbit.title, - }; + const allowedSettings = { + address: subplebbit.address, + apiUrl: subplebbit.apiUrl, + description: subplebbit.description, + pubsubTopic: subplebbit.pubsubTopic, + settings: { + fetchThumbnailUrls: subplebbit.settings?.fetchThumbnailUrls, + fetchThumbnailUrlsProxyUrl: subplebbit.settings?.fetchThumbnailUrlsProxyUrl, + }, + roles: subplebbit.roles, + rules: subplebbit.rules, + suggested: { + avatarUrl: subplebbit.suggested?.avatarUrl, + backgroundUrl: subplebbit.suggested?.backgroundUrl, + bannerUrl: subplebbit.suggested?.bannerUrl, + language: subplebbit.suggested?.language, + primaryColor: subplebbit.suggested?.primaryColor, + secondaryColor: subplebbit.suggested?.secondaryColor, + }, + title: subplebbit.title, + }; - const generateSettingsFromSubplebbit = (subplebbitData) => ({ - address: subplebbitData.address, - apiUrl: subplebbitData.apiUrl, - description: subplebbitData.description, - pubsubTopic: subplebbitData.pubsubTopic, - settings: { - fetchThumbnailUrls: subplebbitData.settings?.fetchThumbnailUrls, - fetchThumbnailUrlsProxyUrl: subplebbitData.settings?.fetchThumbnailUrlsProxyUrl, - }, - roles: subplebbitData.roles, - rules: subplebbitData.rules, - suggested: { - avatarUrl: subplebbitData.suggested?.avatarUrl, - backgroundUrl: subplebbitData.suggested?.backgroundUrl, - bannerUrl: subplebbitData.suggested?.bannerUrl, - language: subplebbitData.suggested?.language, - primaryColor: subplebbitData.suggested?.primaryColor, - secondaryColor: subplebbitData.suggested?.secondaryColor, - }, - title: subplebbitData.title, - }); + const generateSettingsFromSubplebbit = (subplebbitData) => ({ + address: subplebbitData.address, + apiUrl: subplebbitData.apiUrl, + description: subplebbitData.description, + pubsubTopic: subplebbitData.pubsubTopic, + settings: { + fetchThumbnailUrls: subplebbitData.settings?.fetchThumbnailUrls, + fetchThumbnailUrlsProxyUrl: subplebbitData.settings?.fetchThumbnailUrlsProxyUrl, + }, + roles: subplebbitData.roles, + rules: subplebbitData.rules, + suggested: { + avatarUrl: subplebbitData.suggested?.avatarUrl, + backgroundUrl: subplebbitData.suggested?.backgroundUrl, + bannerUrl: subplebbitData.suggested?.bannerUrl, + language: subplebbitData.suggested?.language, + primaryColor: subplebbitData.suggested?.primaryColor, + secondaryColor: subplebbitData.suggested?.secondaryColor, + }, + title: subplebbitData.title, + }); - const initialSettings = generateSettingsFromSubplebbit(subplebbit); - const [isModalOpen, setIsModalOpen] = useState(false); - const [boardSettingsJson, setBoardSettingsJson] = useState(JSON.stringify(initialSettings, null, 2)); - const [triggerPublilshSubplebbitEdit, setTriggerPublishCommentEdit] = useState(false); + const initialSettings = generateSettingsFromSubplebbit(subplebbit); + const [isModalOpen, setIsModalOpen] = useState(false); + const [boardSettingsJson, setBoardSettingsJson] = useState(JSON.stringify(initialSettings, null, 2)); + const [triggerPublilshSubplebbitEdit, setTriggerPublishCommentEdit] = useState(false); - const [, setNewErrorMessage] = useError(); - const [, setNewSuccessMessage] = useSuccess(); + const [, setNewErrorMessage] = useError(); + const [, setNewSuccessMessage] = useSuccess(); - const getDifferences = (oldObj, newObj) => { - let differences = {}; + const getDifferences = (oldObj, newObj) => { + let differences = {}; - for (let key in oldObj) { - if (typeof oldObj[key] === 'object' && oldObj[key] !== null) { - const nestedDifferences = getDifferences(oldObj[key], newObj[key] || {}); - if (Object.keys(nestedDifferences).length > 0) { - differences[key] = nestedDifferences; - } - } else if (oldObj[key] !== newObj[key]) { - differences[key] = newObj[key]; - } - } + for (let key in oldObj) { + if (typeof oldObj[key] === 'object' && oldObj[key] !== null) { + const nestedDifferences = getDifferences(oldObj[key], newObj[key] || {}); + if (Object.keys(nestedDifferences).length > 0) { + differences[key] = nestedDifferences; + } + } else if (oldObj[key] !== newObj[key]) { + differences[key] = newObj[key]; + } + } - for (let key in newObj) { - if (!oldObj.hasOwnProperty(key)) { - differences[key] = newObj[key]; - } - } + for (let key in newObj) { + if (!oldObj.hasOwnProperty(key)) { + differences[key] = newObj[key]; + } + } - return differences; - }; + return differences; + }; - const isInitialMount = useRef(true); + const isInitialMount = useRef(true); - useEffect(() => { - if (isInitialMount.current) { - setBoardSettingsJson(JSON.stringify(generateSettingsFromSubplebbit(subplebbit), null, 2)); - isInitialMount.current = false; - } - }, [subplebbit]); + useEffect(() => { + if (isInitialMount.current) { + setBoardSettingsJson(JSON.stringify(generateSettingsFromSubplebbit(subplebbit), null, 2)); + isInitialMount.current = false; + } + }, [subplebbit]); - function validateSettings(updatedSettings, allowedSettings) { - for (let key in updatedSettings) { - if (!allowedSettings.hasOwnProperty(key) && !initialSettings.hasOwnProperty(key)) { - throw new Error(`Unexpected setting: ${key}`); - } + function validateSettings(updatedSettings, allowedSettings) { + for (let key in updatedSettings) { + if (!allowedSettings.hasOwnProperty(key) && !initialSettings.hasOwnProperty(key)) { + throw new Error(`Unexpected setting: ${key}`); + } - if (typeof updatedSettings[key] === 'object' && updatedSettings[key] !== null && !Array.isArray(updatedSettings[key])) { - if (typeof allowedSettings[key] !== 'object' || allowedSettings[key] === null || Array.isArray(allowedSettings[key])) { - throw new Error(`Expected ${key} to be an object in allowedSettings`); - } - validateSettings(updatedSettings[key], allowedSettings[key]); - } - } - } + if (typeof updatedSettings[key] === 'object' && updatedSettings[key] !== null && !Array.isArray(updatedSettings[key])) { + if (typeof allowedSettings[key] !== 'object' || allowedSettings[key] === null || Array.isArray(allowedSettings[key])) { + throw new Error(`Expected ${key} to be an object in allowedSettings`); + } + validateSettings(updatedSettings[key], allowedSettings[key]); + } + } + } - const onChallenge = async (challenges, subplebbitEdit) => { - let challengeAnswers = []; + const onChallenge = async (challenges, subplebbitEdit) => { + let challengeAnswers = []; - try { - challengeAnswers = await getChallengeAnswersFromUser(challenges); - } catch (error) { - setNewErrorMessage(error.message); - console.log(error); - } - if (challengeAnswers) { - await subplebbitEdit.publishChallengeAnswers(challengeAnswers); - } - }; + try { + challengeAnswers = await getChallengeAnswersFromUser(challenges); + } catch (error) { + setNewErrorMessage(error.message); + console.log(error); + } + if (challengeAnswers) { + await subplebbitEdit.publishChallengeAnswers(challengeAnswers); + } + }; - const onChallengeVerification = (challengeVerification) => { - if (challengeVerification.challengeSuccess === true) { - setNewSuccessMessage('Challenge Success'); - console.log('challenge success', challengeVerification); - } else if (challengeVerification.challengeSuccess === false) { - setNewErrorMessage(`Challenge Failed, reason: ${challengeVerification.reason}. Errors: ${challengeVerification.errors}`); - console.log('challenge failed', challengeVerification); - } - }; + const onChallengeVerification = (challengeVerification) => { + if (challengeVerification.challengeSuccess === true) { + setNewSuccessMessage('Challenge Success'); + console.log('challenge success', challengeVerification); + } else if (challengeVerification.challengeSuccess === false) { + setNewErrorMessage(`Challenge Failed, reason: ${challengeVerification.reason}. Errors: ${challengeVerification.errors}`); + console.log('challenge failed', challengeVerification); + } + }; - const getChallengeAnswersFromUser = async (challenges) => { - setChallengesArray(challenges); + const getChallengeAnswersFromUser = async (challenges) => { + setChallengesArray(challenges); - return new Promise((resolve, reject) => { - const imageString = challenges?.challenges[0].challenge; - const imageSource = `data:image/png;base64,${imageString}`; - const challengeImg = new Image(); - challengeImg.src = imageSource; + return new Promise((resolve, reject) => { + const imageString = challenges?.challenges[0].challenge; + const imageSource = `data:image/png;base64,${imageString}`; + const challengeImg = new Image(); + challengeImg.src = imageSource; - challengeImg.onload = () => { - setIsCaptchaOpen(true); + challengeImg.onload = () => { + setIsCaptchaOpen(true); - const handleKeyDown = async (event) => { - if (event.key === 'Enter') { - const currentCaptchaResponse = useGeneralStore.getState().captchaResponse; - resolve(currentCaptchaResponse); - setIsCaptchaOpen(false); - document.removeEventListener('keydown', handleKeyDown); - event.preventDefault(); - } - }; + const handleKeyDown = async (event) => { + if (event.key === 'Enter') { + const currentCaptchaResponse = useGeneralStore.getState().captchaResponse; + resolve(currentCaptchaResponse); + setIsCaptchaOpen(false); + document.removeEventListener('keydown', handleKeyDown); + event.preventDefault(); + } + }; - setCaptchaResponse(''); - document.addEventListener('keydown', handleKeyDown); + setCaptchaResponse(''); + document.addEventListener('keydown', handleKeyDown); - setResolveCaptchaPromise(resolve); - }; + setResolveCaptchaPromise(resolve); + }; - challengeImg.onerror = () => { - reject(setNewErrorMessage('Could not load challenges')); - }; - }); - }; + challengeImg.onerror = () => { + reject(setNewErrorMessage('Could not load challenges')); + }; + }); + }; - const [editSubplebbitOptions, setEditSubplebbitOptions] = useState({ - subplebbitAddress: selectedAddress, - onChallenge, - onChallengeVerification, - onError: (error) => { - setNewErrorMessage(error.message); - console.log(error); - }, - }); + const [editSubplebbitOptions, setEditSubplebbitOptions] = useState({ + subplebbitAddress: selectedAddress, + onChallenge, + onChallengeVerification, + onError: (error) => { + setNewErrorMessage(error.message); + console.log(error); + }, + }); - const { publishSubplebbitEdit } = usePublishSubplebbitEdit(editSubplebbitOptions); + const { publishSubplebbitEdit } = usePublishSubplebbitEdit(editSubplebbitOptions); - useEffect(() => { - let isActive = true; - if (editSubplebbitOptions && triggerPublilshSubplebbitEdit) { - (async () => { - await publishSubplebbitEdit(editSubplebbitOptions); - if (isActive) { - setTriggerPublishCommentEdit(false); - } - })(); - } + useEffect(() => { + let isActive = true; + if (editSubplebbitOptions && triggerPublilshSubplebbitEdit) { + (async () => { + await publishSubplebbitEdit(editSubplebbitOptions); + if (isActive) { + setTriggerPublishCommentEdit(false); + } + })(); + } - return () => { - isActive = false; - }; - }, [editSubplebbitOptions, publishSubplebbitEdit, triggerPublilshSubplebbitEdit]); + return () => { + isActive = false; + }; + }, [editSubplebbitOptions, publishSubplebbitEdit, triggerPublilshSubplebbitEdit]); - const handleSaveChanges = async () => { - try { - const updatedSettings = JSON.parse(boardSettingsJson); - validateSettings(updatedSettings, allowedSettings); - const changes = getDifferences(initialSettings, updatedSettings); - if (Object.keys(changes).length > 0) { - setEditSubplebbitOptions((prevOptions) => ({ - ...prevOptions, - ...changes, - })); - setTriggerPublishCommentEdit(true); - } else { - setNewErrorMessage('No changes detected'); - } - } catch (error) { - setNewErrorMessage(`Error saving changes: ${error}`); - console.log(error); - } - }; + const handleSaveChanges = async () => { + try { + const updatedSettings = JSON.parse(boardSettingsJson); + validateSettings(updatedSettings, allowedSettings); + const changes = getDifferences(initialSettings, updatedSettings); + if (Object.keys(changes).length > 0) { + setEditSubplebbitOptions((prevOptions) => ({ + ...prevOptions, + ...changes, + })); + setTriggerPublishCommentEdit(true); + } else { + setNewErrorMessage('No changes detected'); + } + } catch (error) { + setNewErrorMessage(`Error saving changes: ${error}`); + console.log(error); + } + }; - const handleResetChanges = () => { - setBoardSettingsJson(JSON.stringify(initialSettings, null, 2)); - }; + const handleResetChanges = () => { + setBoardSettingsJson(JSON.stringify(initialSettings, null, 2)); + }; - function generateSettingsList(settingsObj, parentKey = '') { - let result = []; + function generateSettingsList(settingsObj, parentKey = '') { + let result = []; - for (let key in settingsObj) { - if (typeof settingsObj[key] === 'object' && settingsObj[key] !== null) { - const nestedItems = generateSettingsList(settingsObj[key], `${parentKey}${key}.`); - if (nestedItems.length > 1) { - result.push(`${parentKey}${key}: { ${nestedItems.join(', ')} }`); - } else { - result.push(...nestedItems); - } - } else { - result.push(`${parentKey}${key}`); - } - } + for (let key in settingsObj) { + if (typeof settingsObj[key] === 'object' && settingsObj[key] !== null) { + const nestedItems = generateSettingsList(settingsObj[key], `${parentKey}${key}.`); + if (nestedItems.length > 1) { + result.push(`${parentKey}${key}: { ${nestedItems.join(', ')} }`); + } else { + result.push(...nestedItems); + } + } else { + result.push(`${parentKey}${key}`); + } + } - return result; - } + return result; + } - const possibleSettingsList = generateSettingsList(initialSettings); + const possibleSettingsList = generateSettingsList(initialSettings); - const handleCloseModal = () => { - setIsModalOpen(false); - setBoardSettingsJson(JSON.stringify(initialSettings, null, 2)); - }; + const handleCloseModal = () => { + setIsModalOpen(false); + setBoardSettingsJson(JSON.stringify(initialSettings, null, 2)); + }; - const openModal = () => { - setIsModalOpen(true); - setBoardSettingsJson(JSON.stringify(generateSettingsFromSubplebbit(subplebbit), null, 2)); - }; + const openModal = () => { + setIsModalOpen(true); + setBoardSettingsJson(JSON.stringify(generateSettingsFromSubplebbit(subplebbit), null, 2)); + }; - return ( - <> - -
-
- Board Settings - - - -
-
-
- Allowed settings: - {`{ ${possibleSettingsList.join(', ')} }`} -
- API docs:  - - https://github.com/plebbit/plebbit-js#readme - -
-