mirror of
https://github.com/Qortal/qortal-mobile.git
synced 2025-03-14 20:02:33 +00:00
changes to saved pinned apps
This commit is contained in:
parent
b34f0af49a
commit
0e87b1a4f2
@ -441,7 +441,7 @@ function App() {
|
||||
const [creationStep, setCreationStep] = useState(1)
|
||||
const qortalRequestCheckbox1Ref = useRef(null);
|
||||
useRetrieveDataLocalStorage();
|
||||
useQortalGetSaveSettings(userInfo?.name);
|
||||
useQortalGetSaveSettings(userInfo?.name, extState === "authenticated");
|
||||
const [fullScreen, setFullScreen] = useRecoilState(fullScreenAtom);
|
||||
|
||||
const { toggleFullScreen } = useAppFullScreen(setFullScreen);
|
||||
|
||||
@ -36,6 +36,8 @@ import GroupIcon from "@mui/icons-material/Group";
|
||||
import PersonIcon from "@mui/icons-material/Person";
|
||||
import LockIcon from '@mui/icons-material/Lock';
|
||||
import NoEncryptionGmailerrorredIcon from '@mui/icons-material/NoEncryptionGmailerrorred';
|
||||
import LockIcon from '@mui/icons-material/Lock';
|
||||
import NoEncryptionGmailerrorredIcon from '@mui/icons-material/NoEncryptionGmailerrorred';
|
||||
import {
|
||||
AuthenticatedContainerInnerRight,
|
||||
CustomButton,
|
||||
@ -2368,6 +2370,16 @@ export const Group = ({
|
||||
justifyContent: "flex-end",
|
||||
}}
|
||||
>
|
||||
{isPrivate === true && (
|
||||
<LockIcon sx={{
|
||||
color: 'var(--green)'
|
||||
}} />
|
||||
)}
|
||||
{isPrivate === false && (
|
||||
<NoEncryptionGmailerrorredIcon sx={{
|
||||
color: 'var(--unread)'
|
||||
}} />
|
||||
)}
|
||||
{/* <ExitIcon /> */}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
@ -139,7 +139,7 @@ const Header = ({
|
||||
|
||||
/>
|
||||
</ButtonBase>
|
||||
<Save />
|
||||
<Save myName={myName} />
|
||||
<ButtonBase
|
||||
onClick={logoutFunc}
|
||||
>
|
||||
@ -295,7 +295,7 @@ const Header = ({
|
||||
}}
|
||||
>
|
||||
{/* Right Logout Icon */}
|
||||
<Save />
|
||||
<Save myName={myName} />
|
||||
<ButtonBase
|
||||
onClick={logoutFunc}
|
||||
|
||||
|
||||
@ -9,14 +9,17 @@ import {
|
||||
settingsQDNLastUpdatedAtom,
|
||||
sortablePinnedAppsAtom,
|
||||
} from "../../atoms/global";
|
||||
import { ButtonBase } from "@mui/material";
|
||||
import { Box, 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";
|
||||
export const Save = ({ isDesktop }) => {
|
||||
import { Spacer } from "../../common/Spacer";
|
||||
import { LoadingButton } from "@mui/lab";
|
||||
import { saveToLocalStorage } from "../Apps/AppsNavBar";
|
||||
export const Save = ({ isDesktop, disableWidth, myName }) => {
|
||||
const [pinnedApps, setPinnedApps] = useRecoilState(sortablePinnedAppsAtom);
|
||||
const [settingsQdnLastUpdated, setSettingsQdnLastUpdated] = useRecoilState(
|
||||
settingsQDNLastUpdatedAtom
|
||||
@ -31,7 +34,7 @@ export const Save = ({ isDesktop }) => {
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [infoSnack, setInfoSnack] = useState(null);
|
||||
const [oldPinnedApps, setOldPinnedApps] = useRecoilState(oldPinnedAppsAtom);
|
||||
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const { show } = useContext(MyContext);
|
||||
|
||||
const hasChanged = useMemo(() => {
|
||||
@ -83,9 +86,7 @@ export const Save = ({ isDesktop }) => {
|
||||
.sendMessage(
|
||||
"ENCRYPT_DATA",
|
||||
{
|
||||
|
||||
data64,
|
||||
|
||||
data64,
|
||||
},
|
||||
60000
|
||||
)
|
||||
@ -135,6 +136,7 @@ export const Save = ({ isDesktop }) => {
|
||||
message: "Sucessfully published to QDN",
|
||||
});
|
||||
setOpenSnack(true);
|
||||
setAnchorEl(null)
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
@ -147,19 +149,31 @@ export const Save = ({ isDesktop }) => {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
const handlePopupClick = (event) => {
|
||||
event.stopPropagation(); // Prevent parent onClick from firing
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const revertChanges = () => {
|
||||
setPinnedApps(oldPinnedApps);
|
||||
saveToLocalStorage("ext_saved_settings", "sortablePinnedApps", null);
|
||||
setAnchorEl(null)
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<ButtonBase
|
||||
onClick={saveToQdn}
|
||||
onClick={handlePopupClick}
|
||||
disabled={
|
||||
!hasChanged ||
|
||||
!canSave ||
|
||||
isLoading ||
|
||||
settingsQdnLastUpdated === -100
|
||||
// !hasChanged ||
|
||||
// !canSave ||
|
||||
isLoading
|
||||
// settingsQdnLastUpdated === -100
|
||||
}
|
||||
>
|
||||
{isDesktop ? (
|
||||
<IconWrapper
|
||||
disableWidth={disableWidth}
|
||||
color="rgba(250, 250, 250, 0.5)"
|
||||
label="Save"
|
||||
selected={false}
|
||||
@ -186,6 +200,204 @@ export const Save = ({ isDesktop }) => {
|
||||
/>
|
||||
)}
|
||||
</ButtonBase>
|
||||
<Popover
|
||||
open={!!anchorEl}
|
||||
anchorEl={anchorEl}
|
||||
onClose={() => setAnchorEl(null)} // Close popover on click outside
|
||||
anchorOrigin={{
|
||||
vertical: "bottom",
|
||||
horizontal: "center",
|
||||
}}
|
||||
transformOrigin={{
|
||||
vertical: "top",
|
||||
horizontal: "center",
|
||||
}}
|
||||
// sx={{
|
||||
// width: "300px",
|
||||
// maxWidth: "90%",
|
||||
// maxHeight: "80%",
|
||||
// overflow: "auto",
|
||||
// }}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
padding: "15px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: 1,
|
||||
width: '100%'
|
||||
}}
|
||||
>
|
||||
{!myName ? (
|
||||
<Box
|
||||
sx={{
|
||||
width: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
You need a registered Qortal name to save your pinned apps to QDN.
|
||||
</Typography>
|
||||
</Box>
|
||||
) : (
|
||||
<>
|
||||
{hasChanged && (
|
||||
<Box
|
||||
sx={{
|
||||
width: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
You have unsaved changes to your pinned apps. Save them to QDN.
|
||||
</Typography>
|
||||
<Spacer height="10px" />
|
||||
<LoadingButton
|
||||
sx={{
|
||||
backgroundColor: "var(--green)",
|
||||
color: "black",
|
||||
opacity: 0.7,
|
||||
"&:hover": {
|
||||
backgroundColor: "var(--green)",
|
||||
color: "black",
|
||||
opacity: 1,
|
||||
},
|
||||
}}
|
||||
size="small"
|
||||
loading={isLoading}
|
||||
onClick={saveToQdn}
|
||||
variant="contained"
|
||||
>
|
||||
Save to QDN
|
||||
</LoadingButton>
|
||||
<Spacer height="20px" />
|
||||
{!isNaN(settingsQdnLastUpdated) && settingsQdnLastUpdated > 0 && (
|
||||
<>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
Don't like your current local changes? Would you like to
|
||||
reset to your saved QDN pinned apps?
|
||||
</Typography>
|
||||
<Spacer height="10px" />
|
||||
<LoadingButton
|
||||
size="small"
|
||||
loading={isLoading}
|
||||
onClick={revertChanges}
|
||||
variant="contained"
|
||||
sx={{
|
||||
backgroundColor: "var(--unread)",
|
||||
color: "black",
|
||||
opacity: 0.7,
|
||||
"&:hover": {
|
||||
backgroundColor: "var(--unread)",
|
||||
color: "black",
|
||||
opacity: 1,
|
||||
},
|
||||
}}
|
||||
>
|
||||
Revert to QDN
|
||||
</LoadingButton>
|
||||
</>
|
||||
)}
|
||||
{!isNaN(settingsQdnLastUpdated) && settingsQdnLastUpdated === 0 && (
|
||||
<>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
Don't like your current local changes? Would you like to
|
||||
reset to the default pinned apps?
|
||||
</Typography>
|
||||
<Spacer height="10px" />
|
||||
<LoadingButton
|
||||
loading={isLoading}
|
||||
onClick={revertChanges}
|
||||
variant="contained"
|
||||
>
|
||||
Revert to default
|
||||
</LoadingButton>
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
)}
|
||||
{!isNaN(settingsQdnLastUpdated) && settingsQdnLastUpdated === -100 && (
|
||||
<Box
|
||||
sx={{
|
||||
width: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
The app was unable to download your existing QDN-saved pinned
|
||||
apps. Would you like to overwrite those changes?
|
||||
</Typography>
|
||||
<Spacer height="10px" />
|
||||
<LoadingButton
|
||||
size="small"
|
||||
loading={isLoading}
|
||||
onClick={saveToQdn}
|
||||
variant="contained"
|
||||
sx={{
|
||||
backgroundColor: "var(--unread)",
|
||||
color: "black",
|
||||
opacity: 0.7,
|
||||
"&:hover": {
|
||||
backgroundColor: "var(--unread)",
|
||||
color: "black",
|
||||
opacity: 1,
|
||||
},
|
||||
}}
|
||||
>
|
||||
Overwrite to QDN
|
||||
</LoadingButton>
|
||||
</Box>
|
||||
)}
|
||||
{!hasChanged && (
|
||||
<Box
|
||||
sx={{
|
||||
width: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "14px",
|
||||
}}
|
||||
>
|
||||
You currently do not have any changes to your pinned apps
|
||||
</Typography>
|
||||
|
||||
</Box>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
</Box>
|
||||
</Popover>
|
||||
<CustomizedSnackbars
|
||||
duration={3500}
|
||||
open={openSnack}
|
||||
|
||||
@ -40,7 +40,6 @@ const getPublishRecord = async (myName) => {
|
||||
);
|
||||
data = await res.text();
|
||||
|
||||
|
||||
if(!data) throw new Error('Unable to fetch publish')
|
||||
|
||||
const decryptedKey: any = await decryptResource(data);
|
||||
@ -53,7 +52,8 @@ const getPublishRecord = async (myName) => {
|
||||
}
|
||||
};
|
||||
|
||||
export const useQortalGetSaveSettings = (myName) => {
|
||||
|
||||
export const useQortalGetSaveSettings = (myName, isAuthenticated) => {
|
||||
const setSortablePinnedApps = useSetRecoilState(sortablePinnedAppsAtom);
|
||||
const setCanSave = useSetRecoilState(canSaveSettingToQdnAtom);
|
||||
const setSettingsQDNLastUpdated = useSetRecoilState(settingsQDNLastUpdatedAtom);
|
||||
@ -67,7 +67,7 @@ export const useQortalGetSaveSettings = (myName) => {
|
||||
const settings = await getPublish(myName)
|
||||
if(settings?.sortablePinnedApps && timestamp > settingsLocalLastUpdated){
|
||||
setSortablePinnedApps(settings.sortablePinnedApps)
|
||||
|
||||
|
||||
setSettingsQDNLastUpdated(timestamp || 0)
|
||||
} else if(settings?.sortablePinnedApps){
|
||||
setSettingsQDNLastUpdated(timestamp || 0)
|
||||
@ -87,8 +87,8 @@ export const useQortalGetSaveSettings = (myName) => {
|
||||
}
|
||||
}, [])
|
||||
useEffect(()=> {
|
||||
if(!myName || !settingsLocalLastUpdated) return
|
||||
if(!myName || !settingsLocalLastUpdated || !isAuthenticated) return
|
||||
getSavedSettings(myName, settingsLocalLastUpdated)
|
||||
}, [getSavedSettings, myName, settingsLocalLastUpdated])
|
||||
}, [getSavedSettings, myName, settingsLocalLastUpdated, isAuthenticated])
|
||||
|
||||
}
|
||||
|
||||
@ -23,8 +23,11 @@ export const useRetrieveDataLocalStorage = () => {
|
||||
const pinnedAppsLocal = fetchFromLocalStorage('ext_saved_settings')
|
||||
if(pinnedAppsLocal?.sortablePinnedApps){
|
||||
setSortablePinnedApps(pinnedAppsLocal?.sortablePinnedApps)
|
||||
setSettingsLocalLastUpdated(pinnedAppsLocal?.timestamp || -1)
|
||||
} else {
|
||||
setSettingsLocalLastUpdated(-1)
|
||||
}
|
||||
setSettingsLocalLastUpdated(pinnedAppsLocal?.timestamp || -1)
|
||||
|
||||
}, [])
|
||||
useEffect(()=> {
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user