Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-02 19:36:12 +01:00
Code Issues Packages Projects Releases Activity

fix(website): missing suspense

Browse Source
This commit is contained in:
Elian Doran
2025-10-27 16:35:26 +02:00
parent 86aaa97809
commit dbfa94a9ee
3 changed files with 28 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
apps/website/src/components/Header.tsx
View File

@@ -11,6 +11,7 @@ import menuIcon from "../assets/boxicons/bx-menu.svg?raw";
import { LocaleContext } from ".."; import { LocaleContext } from "..";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { swapLocaleInUrl } from "../i18n"; import { swapLocaleInUrl } from "../i18n";
import { Suspense } from "preact/compat";
interface HeaderLink { interface HeaderLink {
url: string; url: string;
@@ -78,7 +79,9 @@ export function Header(props: {repoStargazersCount: number}) {
/> />
</div> </div>
<DownloadButton /> <Suspense fallback={<div class="loading-screen">Loading...</div>}>
<DownloadButton />
</Suspense>
</div> </div>
</header> </header>

37
apps/website/src/index.tsx
View File

@@ -13,30 +13,33 @@ import { default as i18next, changeLanguage } from 'i18next';
import { extractLocaleFromUrl, LOCALES, mapLocale } from './i18n'; import { extractLocaleFromUrl, LOCALES, mapLocale } from './i18n';
import HttpApi from 'i18next-http-backend'; import HttpApi from 'i18next-http-backend';
import { initReactI18next } from "react-i18next"; import { initReactI18next } from "react-i18next";
import { Suspense } from 'preact/compat';
export const LocaleContext = createContext('en'); export const LocaleContext = createContext('en');
export function App(props: {repoStargazersCount: number}) { export function App(props: {repoStargazersCount: number}) {
return ( return (
<LocationProvider> <LocationProvider>
<LocaleProvider> <LocaleProvider>
<Header repoStargazersCount={props.repoStargazersCount} /> <Suspense fallback={<div class="loading-screen">Loading...</div>}>
<main> <Header repoStargazersCount={props.repoStargazersCount} />
<Router> <main>
<Route path="/" component={Home} /> <Router>
<Route path="/get-started" component={GetStarted} /> <Route path="/" component={Home} />
<Route path="/support-us" component={SupportUs} /> <Route path="/get-started" component={GetStarted} />
<Route path="/support-us" component={SupportUs} />
<Route path="/:locale:/" component={Home} /> <Route path="/:locale:/" component={Home} />
<Route path="/:locale:/get-started" component={GetStarted} /> <Route path="/:locale:/get-started" component={GetStarted} />
<Route path="/:locale:/support-us" component={SupportUs} /> <Route path="/:locale:/support-us" component={SupportUs} />
<Route default component={NotFound} /> <Route default component={NotFound} />
</Router> </Router>
</main> </main>
<Footer /> <Footer />
</LocaleProvider> </Suspense>
</LocationProvider> </LocaleProvider>
</LocationProvider>
); );
} }

5
apps/website/src/pages/Home/index.tsx
View File

@@ -33,6 +33,7 @@ import presentationIcon from "../../assets/boxicons/bx-slideshow.svg?raw";
import { getPlatform } from '../../download-helper.js'; import { getPlatform } from '../../download-helper.js';
import { useEffect, useState } from 'preact/hooks'; import { useEffect, useState } from 'preact/hooks';
import { Trans, useTranslation } from 'react-i18next'; import { Trans, useTranslation } from 'react-i18next';
import { Suspense } from 'preact/compat';
export function Home() { export function Home() {
usePageTitle(""); usePageTitle("");
@@ -79,7 +80,9 @@ function HeroSection() {
<p>{t("hero_section.subtitle")}</p> <p>{t("hero_section.subtitle")}</p>
<div className="download-wrapper"> <div className="download-wrapper">
<DownloadButton big /> <Suspense fallback={<div class="loading-screen">Loading...</div>}>
<DownloadButton big />
</Suspense>
<Button href="./get-started/" className="mobile-only" text={t("hero_section.get_started")} /> <Button href="./get-started/" className="mobile-only" text={t("hero_section.get_started")} />
<div className="additional-options"> <div className="additional-options">
<Button iconSvg={gitHubIcon} outline text={t("hero_section.github")} href="https://github.com/TriliumNext/Trilium/" openExternally /> <Button iconSvg={gitHubIcon} outline text={t("hero_section.github")} href="https://github.com/TriliumNext/Trilium/" openExternally />