diff --git a/src/App.tsx b/src/App.tsx index 8da871d..9bb5342 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -34,9 +34,9 @@ import ltcLogo from './assets/ltc.png'; import PersonSearchIcon from '@mui/icons-material/PersonSearch'; import qortLogo from './assets/qort.png'; import { CopyToClipboard } from 'react-copy-to-clipboard'; -import { Download } from './assets/svgs/Download.tsx'; -import { Logout } from './assets/svgs/Logout.tsx'; -import { Return } from './assets/svgs/Return.tsx'; +import { Download } from './assets/Icons/Download.tsx'; +import { Logout } from './assets/Icons/Logout.tsx'; +import { Return } from './assets/Icons/Return.tsx'; import WarningIcon from '@mui/icons-material/Warning'; import Success from './assets/svgs/Success.svg'; import './utils/seedPhrase/RandomSentenceGenerator'; diff --git a/src/assets/svgs/CreateThreadIcon.tsx b/src/assets/Icons/CreateThreadIcon.tsx similarity index 100% rename from src/assets/svgs/CreateThreadIcon.tsx rename to src/assets/Icons/CreateThreadIcon.tsx diff --git a/src/assets/svgs/Download.tsx b/src/assets/Icons/Download.tsx similarity index 100% rename from src/assets/svgs/Download.tsx rename to src/assets/Icons/Download.tsx diff --git a/src/assets/svgs/Logout.tsx b/src/assets/Icons/Logout.tsx similarity index 100% rename from src/assets/svgs/Logout.tsx rename to src/assets/Icons/Logout.tsx diff --git a/src/assets/svgs/NavAdd.tsx b/src/assets/Icons/NavAdd.tsx similarity index 100% rename from src/assets/svgs/NavAdd.tsx rename to src/assets/Icons/NavAdd.tsx diff --git a/src/assets/svgs/NavBack.tsx b/src/assets/Icons/NavBack.tsx similarity index 100% rename from src/assets/svgs/NavBack.tsx rename to src/assets/Icons/NavBack.tsx diff --git a/src/assets/svgs/NavCloseTab.tsx b/src/assets/Icons/NavCloseTab.tsx similarity index 100% rename from src/assets/svgs/NavCloseTab.tsx rename to src/assets/Icons/NavCloseTab.tsx diff --git a/src/assets/svgs/NavMoreMenu.tsx b/src/assets/Icons/NavMoreMenu.tsx similarity index 100% rename from src/assets/svgs/NavMoreMenu.tsx rename to src/assets/Icons/NavMoreMenu.tsx diff --git a/src/assets/svgs/Return.tsx b/src/assets/Icons/Return.tsx similarity index 100% rename from src/assets/svgs/Return.tsx rename to src/assets/Icons/Return.tsx diff --git a/src/assets/svgs/SaveIcon.tsx b/src/assets/Icons/SaveIcon.tsx similarity index 100% rename from src/assets/svgs/SaveIcon.tsx rename to src/assets/Icons/SaveIcon.tsx diff --git a/src/assets/svgs/SendNewMessage.tsx b/src/assets/Icons/SendNewMessage.tsx similarity index 100% rename from src/assets/svgs/SendNewMessage.tsx rename to src/assets/Icons/SendNewMessage.tsx diff --git a/src/assets/svgs/StarEmpty.tsx b/src/assets/Icons/StarEmpty.tsx similarity index 100% rename from src/assets/svgs/StarEmpty.tsx rename to src/assets/Icons/StarEmpty.tsx diff --git a/src/assets/svgs/StarFilled.tsx b/src/assets/Icons/StarFilled.tsx similarity index 100% rename from src/assets/svgs/StarFilled.tsx rename to src/assets/Icons/StarFilled.tsx diff --git a/src/assets/Icons/WalletIcon.tsx b/src/assets/Icons/WalletIcon.tsx index 9bb606b..84c6775 100644 --- a/src/assets/Icons/WalletIcon.tsx +++ b/src/assets/Icons/WalletIcon.tsx @@ -1,5 +1,5 @@ import { useTheme } from '@mui/material'; -import { SVGProps } from '../svgs/interfaces'; +import { SVGProps } from './interfaces'; export const WalletIcon: React.FC = ({ color, diff --git a/src/assets/svgs/interfaces.ts b/src/assets/Icons/interfaces.ts similarity index 100% rename from src/assets/svgs/interfaces.ts rename to src/assets/Icons/interfaces.ts diff --git a/src/assets/svgs/Download.svg b/src/assets/svgs/Download.svg deleted file mode 100644 index 4fb9e52..0000000 --- a/src/assets/svgs/Download.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/components/Apps/AppRating.tsx b/src/components/Apps/AppRating.tsx index a1f3c98..abf1bba 100644 --- a/src/components/Apps/AppRating.tsx +++ b/src/components/Apps/AppRating.tsx @@ -1,20 +1,14 @@ -import { Box, Rating, Typography } from "@mui/material"; -import React, { - useCallback, - useContext, - useEffect, - useRef, - useState, -} from "react"; -import { getFee } from "../../background"; -import { MyContext, getBaseApiReact } from "../../App"; -import { CustomizedSnackbars } from "../Snackbar/Snackbar"; -import { StarFilledIcon } from "../../assets/svgs/StarFilled"; -import { StarEmptyIcon } from "../../assets/svgs/StarEmpty"; -import { AppInfoUserName } from "./Apps-styles"; -import { Spacer } from "../../common/Spacer"; +import { Box, Rating } from '@mui/material'; +import { useCallback, useContext, useEffect, useRef, useState } from 'react'; +import { getFee } from '../../background'; +import { MyContext, getBaseApiReact } from '../../App'; +import { CustomizedSnackbars } from '../Snackbar/Snackbar'; +import { StarFilledIcon } from '../../assets/Icons/StarFilled'; +import { StarEmptyIcon } from '../../assets/Icons/StarEmpty'; +import { AppInfoUserName } from './Apps-styles'; +import { Spacer } from '../../common/Spacer'; -export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { +export const AppRating = ({ app, myName, ratingCountPosition = 'right' }) => { const [value, setValue] = useState(0); const { show } = useContext(MyContext); const [hasPublishedRating, setHasPublishedRating] = useState( @@ -33,14 +27,14 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { const url = `${getBaseApiReact()}/polls/${pollName}`; const response = await fetch(url, { - method: "GET", + method: 'GET', headers: { - "Content-Type": "application/json", + 'Content-Type': 'application/json', }, }); const responseData = await response.json(); - if (responseData?.message?.includes("POLL_NO_EXISTS")) { + if (responseData?.message?.includes('POLL_NO_EXISTS')) { setHasPublishedRating(false); } else if (responseData?.pollName) { setPollInfo(responseData); @@ -48,9 +42,9 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { const urlVotes = `${getBaseApiReact()}/polls/votes/${pollName}`; const responseVotes = await fetch(urlVotes, { - method: "GET", + method: 'GET', headers: { - "Content-Type": "application/json", + 'Content-Type': 'application/json', }, }); @@ -59,15 +53,15 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { const voteCount = responseDataVotes.voteCounts; // Include initial value vote in the calculation const ratingVotes = voteCount.filter( - (vote) => !vote.optionName.startsWith("initialValue-") + (vote) => !vote.optionName.startsWith('initialValue-') ); const initialValueVote = voteCount.find((vote) => - vote.optionName.startsWith("initialValue-") + vote.optionName.startsWith('initialValue-') ); if (initialValueVote) { // Convert "initialValue-X" to just "X" and add it to the ratingVotes array const initialRating = parseInt( - initialValueVote.optionName.split("-")[1], + initialValueVote.optionName.split('-')[1], 10 ); ratingVotes.push({ @@ -92,7 +86,7 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { setValue(averageRating); } } catch (error) { - if (error?.message?.includes("POLL_NO_EXISTS")) { + if (error?.message?.includes('POLL_NO_EXISTS')) { setHasPublishedRating(false); } } @@ -105,45 +99,47 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { const rateFunc = async (event, chosenValue, currentValue) => { try { - const newValue = chosenValue || currentValue - if (!myName) throw new Error("You need a name to rate."); + const newValue = chosenValue || currentValue; + if (!myName) throw new Error('You need a name to rate.'); if (!app?.name) return; - const fee = await getFee("CREATE_POLL"); + const fee = await getFee('CREATE_POLL'); await show({ message: `Would you like to rate this app a rating of ${newValue}?. It will create a POLL tx.`, - publishFee: fee.fee + " QORT", + publishFee: fee.fee + ' QORT', }); if (hasPublishedRating === false) { const pollName = `app-library-${app.service}-rating-${app.name}`; const pollOptions = [`1, 2, 3, 4, 5, initialValue-${newValue}`]; await new Promise((res, rej) => { - window.sendMessage("createPoll", { - - pollName: pollName, - pollDescription: `Rating for ${app.service} ${app.name}`, - pollOptions: pollOptions, - pollOwnerAddress: myName, - - }, 60000) - .then((response) => { - if (response.error) { - rej(response?.message); - return; - } else { - res(response); - setInfoSnack({ - type: "success", - message: - "Successfully rated. Please wait a couple minutes for the network to propogate the changes.", - }); - setOpenSnack(true); - } - }) - .catch((error) => { - console.error("Failed qortalRequest", error); - }); - + window + .sendMessage( + 'createPoll', + { + pollName: pollName, + pollDescription: `Rating for ${app.service} ${app.name}`, + pollOptions: pollOptions, + pollOwnerAddress: myName, + }, + 60000 + ) + .then((response) => { + if (response.error) { + rej(response?.message); + return; + } else { + res(response); + setInfoSnack({ + type: 'success', + message: + 'Successfully rated. Please wait a couple minutes for the network to propogate the changes.', + }); + setOpenSnack(true); + } + }) + .catch((error) => { + console.error('Failed qortalRequest', error); + }); }); } else { const pollName = `app-library-${app.service}-rating-${app.name}`; @@ -152,39 +148,41 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { (option) => +option.optionName === +newValue ); if (isNaN(optionIndex) || optionIndex === -1) - throw new Error("Cannot find rating option"); + throw new Error('Cannot find rating option'); await new Promise((res, rej) => { - window.sendMessage("voteOnPoll", { - - pollName: pollName, - optionIndex, - - }, 60000) - .then((response) => { - if (response.error) { - rej(response?.message); - return; - } else { - res(response); - setInfoSnack({ - type: "success", - message: - "Successfully rated. Please wait a couple minutes for the network to propogate the changes.", - }); - setOpenSnack(true); - } - }) - .catch((error) => { - console.error("Failed qortalRequest", error); - }); - + window + .sendMessage( + 'voteOnPoll', + { + pollName: pollName, + optionIndex, + }, + 60000 + ) + .then((response) => { + if (response.error) { + rej(response?.message); + return; + } else { + res(response); + setInfoSnack({ + type: 'success', + message: + 'Successfully rated. Please wait a couple minutes for the network to propogate the changes.', + }); + setOpenSnack(true); + } + }) + .catch((error) => { + console.error('Failed qortalRequest', error); + }); }); } } catch (error) { - console.log('error', error) + console.log('error', error); setInfoSnack({ - type: "error", - message: error?.message || "Unable to rate", + type: 'error', + message: error?.message || 'Unable to rate', }); setOpenSnack(true); } @@ -194,17 +192,17 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => {
- {ratingCountPosition === "top" && ( + {ratingCountPosition === 'top' && ( <> {(votesInfo?.totalVotes ?? 0) + - (votesInfo?.voteCounts?.length === 6 ? 1 : 0)}{" "} - {" RATINGS"} + (votesInfo?.voteCounts?.length === 6 ? 1 : 0)}{' '} + {' RATINGS'} {value?.toFixed(1)} @@ -214,17 +212,17 @@ export const AppRating = ({ app, myName, ratingCountPosition = "right" }) => { rateFunc(event, rating, value)} + onChange={(event, rating) => rateFunc(event, rating, value)} precision={1} size="small" icon={} emptyIcon={} sx={{ - display: "flex", - gap: "2px", + display: 'flex', + gap: '2px', }} /> - {ratingCountPosition === "right" && ( + {ratingCountPosition === 'right' && ( {(votesInfo?.totalVotes ?? 0) + (votesInfo?.voteCounts?.length === 6 ? 1 : 0)} diff --git a/src/components/Apps/AppsDevModeNavBar.tsx b/src/components/Apps/AppsDevModeNavBar.tsx index 15c22ab..433ce9b 100644 --- a/src/components/Apps/AppsDevModeNavBar.tsx +++ b/src/components/Apps/AppsDevModeNavBar.tsx @@ -4,8 +4,8 @@ import { AppsNavBarParent, AppsNavBarRight, } from './Apps-styles'; -import { NavBack } from '../../assets/svgs/NavBack.tsx'; -import { NavAdd } from '../../assets/svgs/NavAdd.tsx'; +import { NavBack } from '../../assets/Icons/NavBack.tsx'; +import { NavAdd } from '../../assets/Icons/NavAdd.tsx'; import { ButtonBase, Tab, Tabs } from '@mui/material'; import { executeEvent, diff --git a/src/components/Apps/AppsDevModeTabComponent.tsx b/src/components/Apps/AppsDevModeTabComponent.tsx index 27dcbec..3e791c1 100644 --- a/src/components/Apps/AppsDevModeTabComponent.tsx +++ b/src/components/Apps/AppsDevModeTabComponent.tsx @@ -1,5 +1,5 @@ import { TabParent } from './Apps-styles'; -import { NavCloseTab } from '../../assets/svgs/NavCloseTab.tsx'; +import { NavCloseTab } from '../../assets/Icons/NavCloseTab.tsx'; import { getBaseApiReact } from '../../App'; import { Avatar, ButtonBase } from '@mui/material'; import LogoSelected from '../../assets/svgs/LogoSelected.svg'; diff --git a/src/components/Apps/AppsNavBar.tsx b/src/components/Apps/AppsNavBar.tsx index 5546962..9731bd5 100644 --- a/src/components/Apps/AppsNavBar.tsx +++ b/src/components/Apps/AppsNavBar.tsx @@ -4,9 +4,9 @@ import { AppsNavBarParent, AppsNavBarRight, } from './Apps-styles'; -import { NavBack } from '../../assets/svgs/NavBack.tsx'; -import { NavAdd } from '../../assets/svgs/NavAdd.tsx'; -import { NavMoreMenu } from '../../assets/svgs/NavMoreMenu.tsx'; +import { NavBack } from '../../assets/Icons/NavBack.tsx'; +import { NavAdd } from '../../assets/Icons/NavAdd.tsx'; +import { NavMoreMenu } from '../../assets/Icons/NavMoreMenu.tsx'; import { ButtonBase, ListItemIcon, diff --git a/src/components/Apps/AppsNavBarDesktop.tsx b/src/components/Apps/AppsNavBarDesktop.tsx index 2a22efd..890c297 100644 --- a/src/components/Apps/AppsNavBarDesktop.tsx +++ b/src/components/Apps/AppsNavBarDesktop.tsx @@ -4,9 +4,9 @@ import { AppsNavBarParent, AppsNavBarRight, } from './Apps-styles'; -import { NavBack } from '../../assets/svgs/NavBack.tsx'; -import { NavAdd } from '../../assets/svgs/NavAdd.tsx'; -import { NavMoreMenu } from '../../assets/svgs/NavMoreMenu.tsx'; +import { NavBack } from '../../assets/Icons/NavBack.tsx'; +import { NavAdd } from '../../assets/Icons/NavAdd.tsx'; +import { NavMoreMenu } from '../../assets/Icons/NavMoreMenu.tsx'; import ContentCopyIcon from '@mui/icons-material/ContentCopy'; import { ButtonBase, diff --git a/src/components/Apps/TabComponent.tsx b/src/components/Apps/TabComponent.tsx index 0e8f655..2558a9f 100644 --- a/src/components/Apps/TabComponent.tsx +++ b/src/components/Apps/TabComponent.tsx @@ -1,5 +1,5 @@ import { TabParent } from './Apps-styles'; -import { NavCloseTab } from '../../assets/svgs/NavCloseTab.tsx'; +import { NavCloseTab } from '../../assets/Icons/NavCloseTab.tsx'; import { getBaseApiReact } from '../../App'; import { Avatar, ButtonBase, useTheme } from '@mui/material'; import LogoSelected from '../../assets/svgs/LogoSelected.svg'; diff --git a/src/components/Group/Forum/NewThread.tsx b/src/components/Group/Forum/NewThread.tsx index dd4c83a..31b6592 100644 --- a/src/components/Group/Forum/NewThread.tsx +++ b/src/components/Group/Forum/NewThread.tsx @@ -33,8 +33,8 @@ import { import { ReusableModal } from './ReusableModal'; import { Spacer } from '../../../common/Spacer'; import { formatBytes } from '../../../utils/Size'; -import { CreateThreadIcon } from '../../../assets/svgs/CreateThreadIcon'; -import { SendNewMessage } from '../../../assets/svgs/SendNewMessage'; +import { CreateThreadIcon } from '../../../assets/Icons/CreateThreadIcon'; +import { SendNewMessage } from '../../../assets/Icons/SendNewMessage'; import { TextEditor } from './TextEditor'; import { MyContext, diff --git a/src/components/Group/WalletsAppWrapper.tsx b/src/components/Group/WalletsAppWrapper.tsx index 64b89be..c569425 100644 --- a/src/components/Group/WalletsAppWrapper.tsx +++ b/src/components/Group/WalletsAppWrapper.tsx @@ -10,7 +10,7 @@ import { import { useRecoilState } from 'recoil'; import { navigationControllerAtom } from '../../atoms/global'; import { AppsNavBarLeft, AppsNavBarParent } from '../Apps/Apps-styles'; -import { NavBack } from '../../assets/svgs/NavBack.tsx'; +import { NavBack } from '../../assets/Icons/NavBack.tsx'; import RefreshIcon from '@mui/icons-material/Refresh'; export const WalletsAppWrapper = () => { diff --git a/src/components/Save/Save.tsx b/src/components/Save/Save.tsx index 273da15..cf8dba6 100644 --- a/src/components/Save/Save.tsx +++ b/src/components/Save/Save.tsx @@ -1,6 +1,6 @@ -import React, { useContext, useEffect, useMemo, useState } from "react"; -import { useRecoilState, useSetRecoilState } from "recoil"; -import isEqual from "lodash/isEqual"; // Import deep comparison utility +import React, { useContext, useEffect, useMemo, useState } from 'react'; +import { useRecoilState, useSetRecoilState } from 'recoil'; +import isEqual from 'lodash/isEqual'; // Import deep comparison utility import { canSaveSettingToQdnAtom, hasSettingsChangedAtom, @@ -9,35 +9,35 @@ import { settingsLocalLastUpdatedAtom, settingsQDNLastUpdatedAtom, sortablePinnedAppsAtom, -} from "../../atoms/global"; -import { Box, Button, ButtonBase, Popover, Typography } from "@mui/material"; -import { objectToBase64 } from "../../qdn/encryption/group-encryption"; -import { MyContext } from "../../App"; -import { getFee } from "../../background"; -import { CustomizedSnackbars } from "../Snackbar/Snackbar"; -import { SaveIcon } from "../../assets/svgs/SaveIcon"; -import { IconWrapper } from "../Desktop/DesktopFooter"; -import { Spacer } from "../../common/Spacer"; -import { LoadingButton } from "@mui/lab"; -import { saveToLocalStorage } from "../Apps/AppsNavBar"; -import { decryptData, encryptData } from "../../qortalRequests/get"; -import { saveFileToDiskGeneric } from "../../utils/generateWallet/generateWallet"; +} from '../../atoms/global'; +import { Box, Button, ButtonBase, Popover, Typography } from '@mui/material'; +import { objectToBase64 } from '../../qdn/encryption/group-encryption'; +import { MyContext } from '../../App'; +import { getFee } from '../../background'; +import { CustomizedSnackbars } from '../Snackbar/Snackbar'; +import { SaveIcon } from '../../assets/Icons/SaveIcon'; +import { IconWrapper } from '../Desktop/DesktopFooter'; +import { Spacer } from '../../common/Spacer'; +import { LoadingButton } from '@mui/lab'; +import { saveToLocalStorage } from '../Apps/AppsNavBar'; +import { decryptData, encryptData } from '../../qortalRequests/get'; +import { saveFileToDiskGeneric } from '../../utils/generateWallet/generateWallet'; import { base64ToUint8Array, uint8ArrayToObject, -} from "../../backgroundFunctions/encryption"; +} from '../../backgroundFunctions/encryption'; export const handleImportClick = async () => { - const fileInput = document.createElement("input"); - fileInput.type = "file"; - fileInput.accept = ".base64,.txt"; + const fileInput = document.createElement('input'); + fileInput.type = 'file'; + fileInput.accept = '.base64,.txt'; // Create a promise to handle file selection and reading synchronously return await new Promise((resolve, reject) => { fileInput.onchange = () => { const file = fileInput.files[0]; if (!file) { - reject(new Error("No file selected")); + reject(new Error('No file selected')); return; } @@ -46,7 +46,7 @@ export const handleImportClick = async () => { resolve(e.target.result); // Resolve with the file content }; reader.onerror = () => { - reject(new Error("Error reading file")); + reject(new Error('Error reading file')); }; reader.readAsText(file); // Read the file as text (Base64 string) @@ -124,7 +124,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { const encryptData = await new Promise((res, rej) => { window .sendMessage( - "ENCRYPT_DATA", + 'ENCRYPT_DATA', { data64, }, @@ -139,23 +139,23 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { } }) .catch((error) => { - console.error("Failed qortalRequest", error); + console.error('Failed qortalRequest', error); }); }); if (encryptData && !encryptData?.error) { - const fee = await getFee("ARBITRARY"); + const fee = await getFee('ARBITRARY'); await show({ message: - "Would you like to publish your settings to QDN (encrypted) ?", - publishFee: fee.fee + " QORT", + 'Would you like to publish your settings to QDN (encrypted) ?', + publishFee: fee.fee + ' QORT', }); const response = await new Promise((res, rej) => { window - .sendMessage("publishOnQDN", { + .sendMessage('publishOnQDN', { data: encryptData, - identifier: "ext_saved_settings", - service: "DOCUMENT_PRIVATE", + identifier: 'ext_saved_settings', + service: 'DOCUMENT_PRIVATE', }) .then((response) => { if (!response?.error) { @@ -165,15 +165,15 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { rej(response.error); }) .catch((error) => { - rej(error.message || "An error occurred"); + rej(error.message || 'An error occurred'); }); }); if (response?.identifier) { setOldPinnedApps(pinnedApps); setSettingsQdnLastUpdated(Date.now()); setInfoSnack({ - type: "success", - message: "Sucessfully published to QDN", + type: 'success', + message: 'Sucessfully published to QDN', }); setOpenSnack(true); setAnchorEl(null); @@ -181,8 +181,8 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { } } catch (error) { setInfoSnack({ - type: "error", - message: error?.message || "Unable to save to QDN", + type: 'error', + message: error?.message || 'Unable to save to QDN', }); setOpenSnack(true); } finally { @@ -196,7 +196,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { const revertChanges = () => { setPinnedApps(oldPinnedApps); - saveToLocalStorage("ext_saved_settings", "sortablePinnedApps", null); + saveToLocalStorage('ext_saved_settings', 'sortablePinnedApps', null); setAnchorEl(null); }; @@ -218,11 +218,11 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { selected={false} > ) : ( - + )} { anchorEl={anchorEl} onClose={() => setAnchorEl(null)} // Close popover on click outside anchorOrigin={{ - vertical: "bottom", - horizontal: "center", + vertical: 'bottom', + horizontal: 'center', }} transformOrigin={{ - vertical: "top", - horizontal: "center", + vertical: 'top', + horizontal: 'center', }} sx={{ - width: "300px", - maxWidth: "90%", - maxHeight: "80%", - overflow: "auto", + width: '300px', + maxWidth: '90%', + maxHeight: '80%', + overflow: 'auto', }} > {isUsingImportExportSettings && ( You are using the export/import way of saving settings. @@ -274,8 +274,8 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { size="small" onClick={() => { saveToLocalStorage( - "ext_saved_settings_import_export", - "sortablePinnedApps", + 'ext_saved_settings_import_export', + 'sortablePinnedApps', null, true ); @@ -283,13 +283,13 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { }} variant="contained" sx={{ - backgroundColor: "var(--danger)", - color: "black", - fontWeight: "bold", + backgroundColor: 'var(--danger)', + color: 'black', + fontWeight: 'bold', opacity: 0.7, - "&:hover": { - backgroundColor: "var(--danger)", - color: "black", + '&:hover': { + backgroundColor: 'var(--danger)', + color: 'black', opacity: 1, }, }} @@ -302,25 +302,25 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { {!isUsingImportExportSettings && ( {!myName ? ( You need a registered Qortal name to save your pinned apps to @@ -332,15 +332,15 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { {hasChanged && ( You have unsaved changes to your pinned apps. Save them to @@ -349,13 +349,13 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { { <> Don't like your current local changes? Would you @@ -385,13 +385,13 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { onClick={revertChanges} variant="contained" sx={{ - backgroundColor: "var(--danger)", - color: "black", - fontWeight: "bold", + backgroundColor: 'var(--danger)', + color: 'black', + fontWeight: 'bold', opacity: 0.7, - "&:hover": { - backgroundColor: "var(--danger)", - color: "black", + '&:hover': { + backgroundColor: 'var(--danger)', + color: 'black', opacity: 1, }, }} @@ -405,7 +405,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { <> Don't like your current local changes? Would you @@ -428,15 +428,15 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { isUsingImportExportSettings !== true && ( The app was unable to download your existing QDN-saved @@ -449,13 +449,13 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { onClick={saveToQdn} variant="contained" sx={{ - backgroundColor: "var(--danger)", - color: "black", - fontWeight: "bold", + backgroundColor: 'var(--danger)', + color: 'black', + fontWeight: 'bold', opacity: 0.7, - "&:hover": { - backgroundColor: "var(--danger)", - color: "black", + '&:hover': { + backgroundColor: 'var(--danger)', + color: 'black', opacity: 1, }, }} @@ -467,15 +467,15 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { {!hasChanged && ( You currently do not have any changes to your pinned apps @@ -488,19 +488,19 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { )} { ); if (Array.isArray(responseData)) { saveToLocalStorage( - "ext_saved_settings_import_export", - "sortablePinnedApps", + 'ext_saved_settings_import_export', + 'sortablePinnedApps', responseData, { isUsingImportExport: true, @@ -529,7 +529,7 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { setIsUsingImportExportSettings(true); } } catch (error) { - console.log("error", error); + console.log('error', error); } }} > @@ -544,14 +544,14 @@ export const Save = ({ isDesktop, disableWidth, myName }) => { data64, }); const blob = new Blob([encryptedData], { - type: "text/plain", + type: 'text/plain', }); - const timestamp = new Date().toISOString().replace(/:/g, "-"); // Safe timestamp for filenames + const timestamp = new Date().toISOString().replace(/:/g, '-'); // Safe timestamp for filenames const filename = `qortal-new-ui-backup-settings-${timestamp}.txt`; await saveFileToDiskGeneric(blob, filename); } catch (error) { - console.log("error", error); + console.log('error', error); } }} >