replace eslint/prettier with rome
This commit is contained in:
@@ -1,10 +1,10 @@
|
||||
import { StrictMode } from 'react';
|
||||
import { Root, createRoot, hydrateRoot } from 'react-dom/client';
|
||||
import 'vidstack/styles/defaults.css';
|
||||
import { StrictMode } from "react";
|
||||
import { Root, createRoot, hydrateRoot } from "react-dom/client";
|
||||
import "vidstack/styles/defaults.css";
|
||||
|
||||
import './index.css';
|
||||
import { Shell } from './shell';
|
||||
import { PageContextClient } from './types';
|
||||
import "./index.css";
|
||||
import { Shell } from "./shell";
|
||||
import { PageContextClient } from "./types";
|
||||
|
||||
export const clientRouting = true;
|
||||
export const hydrationCanBeAborted = true;
|
||||
@@ -12,27 +12,30 @@ export const hydrationCanBeAborted = true;
|
||||
let root: Root;
|
||||
|
||||
export async function render(pageContext: PageContextClient) {
|
||||
const { Page, pageProps } = pageContext;
|
||||
const { Page, pageProps } = pageContext;
|
||||
|
||||
if (!Page) throw new Error('Client-side render() hook expects pageContext.Page to be defined');
|
||||
if (!Page)
|
||||
throw new Error(
|
||||
"Client-side render() hook expects pageContext.Page to be defined",
|
||||
);
|
||||
|
||||
const page = (
|
||||
<StrictMode>
|
||||
<Shell pageContext={pageContext}>
|
||||
<Page {...pageProps} />
|
||||
</Shell>
|
||||
</StrictMode>
|
||||
);
|
||||
const page = (
|
||||
<StrictMode>
|
||||
<Shell pageContext={pageContext}>
|
||||
<Page {...pageProps} />
|
||||
</Shell>
|
||||
</StrictMode>
|
||||
);
|
||||
|
||||
const container = document.getElementById('app');
|
||||
// SPA
|
||||
if (container.innerHTML === '' || !pageContext.isHydration) {
|
||||
if (!root) {
|
||||
root = createRoot(container);
|
||||
}
|
||||
root.render(page);
|
||||
// SSR
|
||||
} else {
|
||||
root = hydrateRoot(container, page);
|
||||
}
|
||||
const container = document.getElementById("app");
|
||||
// SPA
|
||||
if (container.innerHTML === "" || !pageContext.isHydration) {
|
||||
if (!root) {
|
||||
root = createRoot(container);
|
||||
}
|
||||
root.render(page);
|
||||
// SSR
|
||||
} else {
|
||||
root = hydrateRoot(container, page);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,33 +1,36 @@
|
||||
import { StrictMode } from 'react';
|
||||
import ReactDOMServer from 'react-dom/server';
|
||||
import { dangerouslySkipEscape, escapeInject } from 'vite-plugin-ssr/server';
|
||||
import { StrictMode } from "react";
|
||||
import ReactDOMServer from "react-dom/server";
|
||||
import { dangerouslySkipEscape, escapeInject } from "vite-plugin-ssr/server";
|
||||
|
||||
import { Shell } from './shell';
|
||||
import { PageContextServer } from './types';
|
||||
import { Shell } from "./shell";
|
||||
import { PageContextServer } from "./types";
|
||||
|
||||
export const passToClient = ['pageProps'];
|
||||
export const passToClient = ["pageProps"];
|
||||
|
||||
export function render(pageContext: PageContextServer) {
|
||||
let pageHtml: string;
|
||||
let pageHtml: string;
|
||||
|
||||
if (!pageContext.Page) {
|
||||
// SPA
|
||||
pageHtml = '';
|
||||
} else {
|
||||
// SSR / HTML-only
|
||||
const { Page, pageProps } = pageContext;
|
||||
if (!Page) throw new Error('My render() hook expects pageContext.Page to be defined');
|
||||
if (!pageContext.Page) {
|
||||
// SPA
|
||||
pageHtml = "";
|
||||
} else {
|
||||
// SSR / HTML-only
|
||||
const { Page, pageProps } = pageContext;
|
||||
if (!Page)
|
||||
throw new Error(
|
||||
"My render() hook expects pageContext.Page to be defined",
|
||||
);
|
||||
|
||||
pageHtml = ReactDOMServer.renderToString(
|
||||
<StrictMode>
|
||||
<Shell pageContext={pageContext}>
|
||||
<Page {...pageProps} />
|
||||
</Shell>
|
||||
</StrictMode>
|
||||
);
|
||||
}
|
||||
pageHtml = ReactDOMServer.renderToString(
|
||||
<StrictMode>
|
||||
<Shell pageContext={pageContext}>
|
||||
<Page {...pageProps} />
|
||||
</Shell>
|
||||
</StrictMode>,
|
||||
);
|
||||
}
|
||||
|
||||
return escapeInject`<!DOCTYPE html>
|
||||
return escapeInject`<!DOCTYPE html>
|
||||
<html lang="en" class="dark">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
|
||||
@@ -1,17 +1,17 @@
|
||||
export function Page({ is404 }: { is404: boolean }) {
|
||||
if (is404) {
|
||||
return (
|
||||
<>
|
||||
<h1>404 Page Not Found</h1>
|
||||
<p>This page could not be found.</p>
|
||||
</>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<>
|
||||
<h1>500 Internal Server Error</h1>
|
||||
<p>Something went wrong.</p>
|
||||
</>
|
||||
);
|
||||
}
|
||||
if (is404) {
|
||||
return (
|
||||
<>
|
||||
<h1>404 Page Not Found</h1>
|
||||
<p>This page could not be found.</p>
|
||||
</>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<>
|
||||
<h1>500 Internal Server Error</h1>
|
||||
<p>Something went wrong.</p>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,7 @@
|
||||
export function LayoutDefault({ children }: { children: React.ReactNode }) {
|
||||
return <div className="h-screen w-screen bg-zinc-50 text-zinc-900 dark:bg-black dark:text-white">{children}</div>;
|
||||
return (
|
||||
<div className="h-screen w-screen bg-zinc-50 text-zinc-900 dark:bg-black dark:text-white">
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,24 +1,31 @@
|
||||
import { RelayProvider } from '@shared/relayProvider';
|
||||
import { RelayProvider } from "@shared/relayProvider";
|
||||
|
||||
import { PageContextProvider } from '@utils/hooks/usePageContext';
|
||||
import { PageContextProvider } from "@utils/hooks/usePageContext";
|
||||
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
|
||||
import { LayoutDefault } from './layoutDefault';
|
||||
import { PageContext } from './types';
|
||||
import { LayoutDefault } from "./layoutDefault";
|
||||
import { PageContext } from "./types";
|
||||
|
||||
const queryClient = new QueryClient();
|
||||
|
||||
export function Shell({ children, pageContext }: { children: React.ReactNode; pageContext: PageContext }) {
|
||||
const Layout = (pageContext.exports.Layout as React.ElementType) || (LayoutDefault as React.ElementType);
|
||||
export function Shell({
|
||||
children,
|
||||
pageContext,
|
||||
}: { children: React.ReactNode; pageContext: PageContext }) {
|
||||
const Layout =
|
||||
(pageContext.exports.Layout as React.ElementType) ||
|
||||
(LayoutDefault as React.ElementType);
|
||||
|
||||
return (
|
||||
<PageContextProvider pageContext={pageContext}>
|
||||
<RelayProvider>
|
||||
<Layout>
|
||||
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
|
||||
</Layout>
|
||||
</RelayProvider>
|
||||
</PageContextProvider>
|
||||
);
|
||||
return (
|
||||
<PageContextProvider pageContext={pageContext}>
|
||||
<RelayProvider>
|
||||
<Layout>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
{children}
|
||||
</QueryClientProvider>
|
||||
</Layout>
|
||||
</RelayProvider>
|
||||
</PageContextProvider>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
import type {
|
||||
PageContextBuiltIn,
|
||||
/*
|
||||
PageContextBuiltIn,
|
||||
/*
|
||||
// When using Client Routing https://vite-plugin-ssr.com/clientRouting
|
||||
PageContextBuiltInClientWithClientRouting as PageContextBuiltInClient
|
||||
/*/
|
||||
// When using Server Routing
|
||||
PageContextBuiltInClientWithServerRouting as PageContextBuiltInClient, //*/
|
||||
} from 'vite-plugin-ssr/types';
|
||||
// When using Server Routing
|
||||
PageContextBuiltInClientWithServerRouting as PageContextBuiltInClient, //*/
|
||||
} from "vite-plugin-ssr/types";
|
||||
|
||||
export type { PageContextServer };
|
||||
export type { PageContextClient };
|
||||
@@ -17,16 +17,16 @@ type Page = (pageProps: PageProps) => React.ReactElement;
|
||||
type PageProps = Record<string, never>;
|
||||
|
||||
export type PageContextCustom = {
|
||||
Page: Page;
|
||||
pageProps?: PageProps;
|
||||
redirectTo?: string;
|
||||
urlPathname: string;
|
||||
exports: {
|
||||
documentProps?: {
|
||||
title?: string;
|
||||
description?: string;
|
||||
};
|
||||
};
|
||||
Page: Page;
|
||||
pageProps?: PageProps;
|
||||
redirectTo?: string;
|
||||
urlPathname: string;
|
||||
exports: {
|
||||
documentProps?: {
|
||||
title?: string;
|
||||
description?: string;
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
type PageContextServer = PageContextBuiltIn<Page> & PageContextCustom;
|
||||
|
||||
Reference in New Issue
Block a user