mirror of
https://github.com/Qortal/Qortal-Hub.git
synced 2025-06-23 08:01:22 +00:00
Remove isMobile check
This commit is contained in:
parent
1bedeff36e
commit
c71853f754
142
src/App.tsx
142
src/App.tsx
@ -118,9 +118,7 @@ import {
|
|||||||
import { useAppFullScreen } from './useAppFullscreen';
|
import { useAppFullScreen } from './useAppFullscreen';
|
||||||
import { NotAuthenticated } from './ExtStates/NotAuthenticated';
|
import { NotAuthenticated } from './ExtStates/NotAuthenticated';
|
||||||
import { handleGetFileFromIndexedDB } from './utils/indexedDB';
|
import { handleGetFileFromIndexedDB } from './utils/indexedDB';
|
||||||
import { CoreSyncStatus } from './components/CoreSyncStatus';
|
|
||||||
import { Wallets } from './Wallets';
|
import { Wallets } from './Wallets';
|
||||||
import { RandomSentenceGenerator } from './utils/seedPhrase/RandomSentenceGenerator';
|
|
||||||
import { useFetchResources } from './common/useFetchResources';
|
import { useFetchResources } from './common/useFetchResources';
|
||||||
import { Tutorials } from './components/Tutorials/Tutorials';
|
import { Tutorials } from './components/Tutorials/Tutorials';
|
||||||
import { useHandleTutorials } from './components/Tutorials/useHandleTutorials';
|
import { useHandleTutorials } from './components/Tutorials/useHandleTutorials';
|
||||||
@ -182,28 +180,6 @@ const defaultValues: MyContextInterface = {
|
|||||||
message: '',
|
message: '',
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
export let isMobile = false;
|
|
||||||
|
|
||||||
const isMobileDevice = () => {
|
|
||||||
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
|
|
||||||
|
|
||||||
if (/android/i.test(userAgent)) {
|
|
||||||
return true; // Android device
|
|
||||||
}
|
|
||||||
|
|
||||||
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
|
|
||||||
return true; // iOS device
|
|
||||||
}
|
|
||||||
|
|
||||||
return false;
|
|
||||||
};
|
|
||||||
|
|
||||||
if (isMobileDevice()) {
|
|
||||||
isMobile = true;
|
|
||||||
console.log('Running on a mobile device');
|
|
||||||
} else {
|
|
||||||
console.log('Running on a desktop');
|
|
||||||
}
|
|
||||||
|
|
||||||
export const allQueues = {
|
export const allQueues = {
|
||||||
requestQueueCommentCount: requestQueueCommentCount,
|
requestQueueCommentCount: requestQueueCommentCount,
|
||||||
@ -436,16 +412,20 @@ function App() {
|
|||||||
const [isOpenMinting, setIsOpenMinting] = useState(false);
|
const [isOpenMinting, setIsOpenMinting] = useState(false);
|
||||||
const { toggleFullScreen } = useAppFullScreen(setFullScreen);
|
const { toggleFullScreen } = useAppFullScreen(setFullScreen);
|
||||||
const generatorRef = useRef(null);
|
const generatorRef = useRef(null);
|
||||||
|
|
||||||
const exportSeedphrase = () => {
|
const exportSeedphrase = () => {
|
||||||
const seedPhrase = generatorRef.current.parsedString;
|
const seedPhrase = generatorRef.current.parsedString;
|
||||||
saveSeedPhraseToDisk(seedPhrase);
|
saveSeedPhraseToDisk(seedPhrase);
|
||||||
};
|
};
|
||||||
|
|
||||||
const passwordRef = useRef<HTMLInputElement>(null);
|
const passwordRef = useRef<HTMLInputElement>(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (extState === 'wallet-dropped' && passwordRef.current) {
|
if (extState === 'wallet-dropped' && passwordRef.current) {
|
||||||
passwordRef.current.focus();
|
passwordRef.current.focus();
|
||||||
}
|
}
|
||||||
}, [extState]);
|
}, [extState]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const isDevModeFromStorage = localStorage.getItem('isEnabledDevMode');
|
const isDevModeFromStorage = localStorage.getItem('isEnabledDevMode');
|
||||||
if (isDevModeFromStorage) {
|
if (isDevModeFromStorage) {
|
||||||
@ -491,31 +471,38 @@ function App() {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
}, [toggleFullScreen]);
|
}, [toggleFullScreen]);
|
||||||
|
|
||||||
//resets for recoil
|
//resets for recoil
|
||||||
const resetAtomSortablePinnedAppsAtom = useResetRecoilState(
|
const resetAtomSortablePinnedAppsAtom = useResetRecoilState(
|
||||||
sortablePinnedAppsAtom
|
sortablePinnedAppsAtom
|
||||||
);
|
);
|
||||||
|
|
||||||
const resetAtomIsUsingImportExportSettingsAtom = useResetRecoilState(
|
const resetAtomIsUsingImportExportSettingsAtom = useResetRecoilState(
|
||||||
isUsingImportExportSettingsAtom
|
isUsingImportExportSettingsAtom
|
||||||
);
|
);
|
||||||
const resetAtomCanSaveSettingToQdnAtom = useResetRecoilState(
|
const resetAtomCanSaveSettingToQdnAtom = useResetRecoilState(
|
||||||
canSaveSettingToQdnAtom
|
canSaveSettingToQdnAtom
|
||||||
);
|
);
|
||||||
|
|
||||||
const resetAtomSettingsQDNLastUpdatedAtom = useResetRecoilState(
|
const resetAtomSettingsQDNLastUpdatedAtom = useResetRecoilState(
|
||||||
settingsQDNLastUpdatedAtom
|
settingsQDNLastUpdatedAtom
|
||||||
);
|
);
|
||||||
|
|
||||||
const resetAtomSettingsLocalLastUpdatedAtom = useResetRecoilState(
|
const resetAtomSettingsLocalLastUpdatedAtom = useResetRecoilState(
|
||||||
settingsLocalLastUpdatedAtom
|
settingsLocalLastUpdatedAtom
|
||||||
);
|
);
|
||||||
|
|
||||||
const resetAtomOldPinnedAppsAtom = useResetRecoilState(oldPinnedAppsAtom);
|
const resetAtomOldPinnedAppsAtom = useResetRecoilState(oldPinnedAppsAtom);
|
||||||
const resetAtomQMailLastEnteredTimestampAtom = useResetRecoilState(
|
const resetAtomQMailLastEnteredTimestampAtom = useResetRecoilState(
|
||||||
qMailLastEnteredTimestampAtom
|
qMailLastEnteredTimestampAtom
|
||||||
);
|
);
|
||||||
|
|
||||||
const resetAtomMailsAtom = useResetRecoilState(mailsAtom);
|
const resetAtomMailsAtom = useResetRecoilState(mailsAtom);
|
||||||
const resetGroupPropertiesAtom = useResetRecoilState(groupsPropertiesAtom);
|
const resetGroupPropertiesAtom = useResetRecoilState(groupsPropertiesAtom);
|
||||||
const resetLastPaymentSeenTimestampAtom = useResetRecoilState(
|
const resetLastPaymentSeenTimestampAtom = useResetRecoilState(
|
||||||
lastPaymentSeenTimestampAtom
|
lastPaymentSeenTimestampAtom
|
||||||
);
|
);
|
||||||
|
|
||||||
const resetAllRecoil = () => {
|
const resetAllRecoil = () => {
|
||||||
resetAtomSortablePinnedAppsAtom();
|
resetAtomSortablePinnedAppsAtom();
|
||||||
resetAtomCanSaveSettingToQdnAtom();
|
resetAtomCanSaveSettingToQdnAtom();
|
||||||
@ -528,34 +515,11 @@ function App() {
|
|||||||
resetGroupPropertiesAtom();
|
resetGroupPropertiesAtom();
|
||||||
resetLastPaymentSeenTimestampAtom();
|
resetLastPaymentSeenTimestampAtom();
|
||||||
};
|
};
|
||||||
useEffect(() => {
|
|
||||||
if (!isMobile) return;
|
|
||||||
// Function to set the height of the app to the viewport height
|
|
||||||
const resetHeight = () => {
|
|
||||||
const height = window.visualViewport
|
|
||||||
? window.visualViewport.height
|
|
||||||
: window.innerHeight;
|
|
||||||
// Set the height to the root element (usually #root)
|
|
||||||
document.getElementById('root').style.height = height + 'px';
|
|
||||||
setRootHeight(height + 'px');
|
|
||||||
};
|
|
||||||
|
|
||||||
// Set the initial height
|
|
||||||
resetHeight();
|
|
||||||
|
|
||||||
// Add event listeners for resize and visualViewport changes
|
|
||||||
window.addEventListener('resize', resetHeight);
|
|
||||||
window.visualViewport?.addEventListener('resize', resetHeight);
|
|
||||||
|
|
||||||
// Clean up the event listeners when the component unmounts
|
|
||||||
return () => {
|
|
||||||
window.removeEventListener('resize', resetHeight);
|
|
||||||
window.visualViewport?.removeEventListener('resize', resetHeight);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
const handleSetGlobalApikey = (key) => {
|
const handleSetGlobalApikey = (key) => {
|
||||||
globalApiKey = key;
|
globalApiKey = key;
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
try {
|
try {
|
||||||
setIsLoading(true);
|
setIsLoading(true);
|
||||||
@ -1232,14 +1196,6 @@ function App() {
|
|||||||
// Handler for when the window gains focus
|
// Handler for when the window gains focus
|
||||||
const handleFocus = () => {
|
const handleFocus = () => {
|
||||||
setIsFocused(true);
|
setIsFocused(true);
|
||||||
if (isMobile) {
|
|
||||||
window.sendMessage('clearAllNotifications', {}).catch((error) => {
|
|
||||||
console.error(
|
|
||||||
'Failed to clear notifications:',
|
|
||||||
error.message || 'An error occurred'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// Handler for when the window loses focus
|
// Handler for when the window loses focus
|
||||||
@ -1255,14 +1211,6 @@ function App() {
|
|||||||
const handleVisibilityChange = () => {
|
const handleVisibilityChange = () => {
|
||||||
if (document.visibilityState === 'visible') {
|
if (document.visibilityState === 'visible') {
|
||||||
setIsFocused(true);
|
setIsFocused(true);
|
||||||
if (isMobile) {
|
|
||||||
window.sendMessage('clearAllNotifications', {}).catch((error) => {
|
|
||||||
console.error(
|
|
||||||
'Failed to clear notifications:',
|
|
||||||
error.message || 'An error occurred'
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
setIsFocused(false);
|
setIsFocused(false);
|
||||||
}
|
}
|
||||||
@ -1315,7 +1263,7 @@ function App() {
|
|||||||
return (
|
return (
|
||||||
<AuthenticatedContainerInnerLeft
|
<AuthenticatedContainerInnerLeft
|
||||||
sx={{
|
sx={{
|
||||||
overflowY: isMobile && 'auto',
|
overflowY: 'auto',
|
||||||
padding: '0px 20px',
|
padding: '0px 20px',
|
||||||
minWidth: '225px',
|
minWidth: '225px',
|
||||||
}}
|
}}
|
||||||
@ -1568,27 +1516,9 @@ function App() {
|
|||||||
backgroundColor: theme.palette.background.default,
|
backgroundColor: theme.palette.background.default,
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
justifyContent: 'flex-end',
|
justifyContent: 'flex-end',
|
||||||
width: isMobile ? '100vw' : 'auto',
|
width: 'auto',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{isMobile && (
|
|
||||||
<Box
|
|
||||||
sx={{
|
|
||||||
display: 'flex',
|
|
||||||
justifyContent: 'flex-end',
|
|
||||||
padding: '10px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<CloseIcon
|
|
||||||
onClick={() => {
|
|
||||||
setIsOpenDrawerProfile(false);
|
|
||||||
}}
|
|
||||||
sx={{
|
|
||||||
cursor: 'pointer',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Box>
|
|
||||||
)}
|
|
||||||
{desktopViewMode !== 'apps' &&
|
{desktopViewMode !== 'apps' &&
|
||||||
desktopViewMode !== 'dev' &&
|
desktopViewMode !== 'dev' &&
|
||||||
desktopViewMode !== 'chat' && <>{renderProfileLeft()}</>}
|
desktopViewMode !== 'chat' && <>{renderProfileLeft()}</>}
|
||||||
@ -1609,9 +1539,6 @@ function App() {
|
|||||||
>
|
>
|
||||||
<Spacer height="20px" />
|
<Spacer height="20px" />
|
||||||
|
|
||||||
{!isMobile && (
|
|
||||||
<>
|
|
||||||
<Spacer height="20px" />
|
|
||||||
<Tooltip
|
<Tooltip
|
||||||
title={
|
title={
|
||||||
<span
|
<span
|
||||||
@ -1652,8 +1579,6 @@ function App() {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<Spacer height="20px" />
|
<Spacer height="20px" />
|
||||||
|
|
||||||
@ -2009,7 +1934,7 @@ function App() {
|
|||||||
return (
|
return (
|
||||||
<AppContainer
|
<AppContainer
|
||||||
sx={{
|
sx={{
|
||||||
height: isMobile ? '100%' : '100vh',
|
height: '100vh',
|
||||||
// backgroundImage: desktopViewMode === "apps" && 'url("appsBg.svg")',
|
// backgroundImage: desktopViewMode === "apps" && 'url("appsBg.svg")',
|
||||||
// backgroundSize: desktopViewMode === "apps" && "cover",
|
// backgroundSize: desktopViewMode === "apps" && "cover",
|
||||||
// backgroundPosition: desktopViewMode === "apps" && "center",
|
// backgroundPosition: desktopViewMode === "apps" && "center",
|
||||||
@ -2075,51 +2000,50 @@ function App() {
|
|||||||
>
|
>
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
width: '100vw',
|
|
||||||
height: isMobile ? '100%' : '100vh',
|
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: isMobile ? 'column' : 'row',
|
flexDirection: 'row',
|
||||||
overflow: isMobile && 'hidden',
|
height: '100vh',
|
||||||
|
width: '100vw',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Group
|
<Group
|
||||||
logoutFunc={logoutFunc}
|
|
||||||
balance={balance}
|
balance={balance}
|
||||||
userInfo={userInfo}
|
desktopViewMode={desktopViewMode}
|
||||||
myAddress={address}
|
|
||||||
isFocused={isFocused}
|
isFocused={isFocused}
|
||||||
isMain={isMain}
|
isMain={isMain}
|
||||||
isOpenDrawerProfile={isOpenDrawerProfile}
|
isOpenDrawerProfile={isOpenDrawerProfile}
|
||||||
setIsOpenDrawerProfile={setIsOpenDrawerProfile}
|
logoutFunc={logoutFunc}
|
||||||
desktopViewMode={desktopViewMode}
|
myAddress={address}
|
||||||
setDesktopViewMode={setDesktopViewMode}
|
setDesktopViewMode={setDesktopViewMode}
|
||||||
|
setIsOpenDrawerProfile={setIsOpenDrawerProfile}
|
||||||
|
userInfo={userInfo}
|
||||||
/>
|
/>
|
||||||
{!isMobile && renderProfile()}
|
renderProfile()
|
||||||
</Box>
|
</Box>
|
||||||
</MyContext.Provider>
|
</MyContext.Provider>
|
||||||
)}
|
)}
|
||||||
{isOpenSendQort && isMainWindow && (
|
{isOpenSendQort && isMainWindow && (
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
width: '100%',
|
alignItems: 'center',
|
||||||
height: '100%',
|
|
||||||
position: 'fixed',
|
|
||||||
background: theme.palette.background.default,
|
background: theme.palette.background.default,
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
alignItems: 'center',
|
height: '100%',
|
||||||
|
position: 'fixed',
|
||||||
|
width: '100%',
|
||||||
zIndex: 10000,
|
zIndex: 10000,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Spacer height="22px" />
|
<Spacer height="22px" />
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
display: 'flex',
|
|
||||||
width: '100%',
|
|
||||||
justifyContent: 'flex-start',
|
|
||||||
paddingLeft: '22px',
|
|
||||||
boxSizing: 'border-box',
|
boxSizing: 'border-box',
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'flex-start',
|
||||||
maxWidth: '700px',
|
maxWidth: '700px',
|
||||||
|
paddingLeft: '22px',
|
||||||
|
width: '100%',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Return
|
<Return
|
||||||
@ -2130,7 +2054,9 @@ function App() {
|
|||||||
onClick={returnToMain}
|
onClick={returnToMain}
|
||||||
/>
|
/>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
<Spacer height="35px" />
|
<Spacer height="35px" />
|
||||||
|
|
||||||
<QortPayment
|
<QortPayment
|
||||||
balance={balance}
|
balance={balance}
|
||||||
show={show}
|
show={show}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user