Software-Mac/spacedrive
Software-Mac/spacedrive
1
0
Fork 0
mirror of https://github.com/spacedriveapp/spacedrive synced 2024-07-14 01:54:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix landing page not working without WebGL (#1469)

Browse source 
Fix landing page not working with WebGL
This commit is contained in:
Vítor Vasconcellos 2023-10-11 02:20:54 -03:00 committed by GitHub
parent 38a764e43e
commit ba1d75e8ff
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
apps/landing/src/pages/index.tsx
View file

@ -14,7 +14,7 @@ import { useEffect, useState } from 'react';
import { Tooltip, TooltipProvider, tw } from '@sd/ui';
import NewBanner from '~/components/NewBanner';
import PageWrapper from '~/components/PageWrapper';
import { Space } from '~/components/Space';
import { detectWebGLContext, getWindow } from '~/utils/util';
import CyclingImage from '../components/CyclingImage';
@ -38,6 +38,7 @@ const platforms = [
export default function HomePage() {
const [opacity, setOpacity] = useState(0.6);
const [background, setBackground] = useState<JSX.Element | null>(null);
const [downloadMacOs, setDownloadMacOS] = useState(false);
const [deviceOs, setDeviceOs] = useState<null | {
isWindows: boolean;
@ -85,6 +86,20 @@ export default function HomePage() {
};
}, []);
useEffect(() => {
if (!(getWindow() && background == null)) return;
(async () => {
if (detectWebGLContext()) {
const Space = (await import('~/components/Space')).Space;
setBackground(<Space />);
} else {
console.warn('Fallback to Bubbles background due WebGL not being available');
const Bubbles = (await import('~/components/Bubbles')).Bubbles;
setBackground(<Bubbles />);
}
})();
}, [background]);
return (
<TooltipProvider>
<Head>
@ -103,9 +118,7 @@ export default function HomePage() {
/>
<meta name="author" content="Spacedrive Technology Inc." />
</Head>
<div style={{ opacity }}>
<Space />
</div>
<div style={{ opacity }}>{background}</div>
<PageWrapper>
{/* <div