p-sw/pswui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(react): add 404 redirection and update build script

Browse Source 
Added a 404.html file that contains a redirection script in the 'react' package. Also updated the build script in package.json to copy the 404.html into the dist folder when building.
This commit is contained in:
p-sw 2024-06-08 09:11:38 +09:00
parent e1999266dd
commit 7d2aa1d7f0
3 changed files with 50 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/react/404.html Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript">
const l = window.location;
l.replace(
l.origin +
l.pathname.split('/').slice(0, 1).join('/') + '/?/' +
l.pathname.slice(1).split('/').join('/').replace(/&/g, '~and~') +
(l.search ? '&' + l.search.slice(1).replace(/&/g, '~and~') : '') +
l.hash
);
</script>
</head>
<body>
</body>
</html>

2
packages/react/package.json
View File

@ -5,7 +5,7 @@
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"build": "tsc && vite build && cp ./404.html ./dist",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview"
},

41
packages/react/src/App.tsx
View File

@ -59,7 +59,7 @@ function HashedHeaders(Level: `h${1 | 2 | 3 | 4 | 5 | 6}`) {
root: null,
rootMargin: "0px",
threshold: buildThresholdList(),
}
},
);
if (internalRef.current) {
observer.observe(internalRef.current);
@ -87,13 +87,24 @@ function HashedHeaders(Level: `h${1 | 2 | 3 | 4 | 5 | 6}`) {
}
const overrideComponents = {
pre: forwardRef<HTMLDivElement, { children: React.ReactElement }>((props, ref) => {
const { props: { children, className } } = React.cloneElement(React.Children.only(props.children));
pre: forwardRef<HTMLDivElement, { children: React.ReactElement }>(
(props, ref) => {
const {
props: { children, className },
} = React.cloneElement(React.Children.only(props.children));
const language = (typeof className !== "string" || !className.includes("language-") ? "typescript" : /language-([a-z]+)/.exec(className)![1]) ?? "typescript"
const language =
(typeof className !== "string" || !className.includes("language-")
? "typescript"
: /language-([a-z]+)/.exec(className)![1]) ?? "typescript";
return <Code ref={ref} language={language}>{children as string}</Code>;
}),
return (
<Code ref={ref} language={language}>
{children as string}
</Code>
);
},
),
code: forwardRef<HTMLElement, any>((props: any, ref) => (
<code
ref={ref}
@ -139,10 +150,20 @@ const routes = Object.keys(docsModules).map((path) => {
);
});
const REDIRECTED_404 = /^\?(\/([a-zA-Z0-9\-_]+\/?)+)(&.*)*$/;
const router = createBrowserRouter(
createRoutesFromElements(
<Route path="/" element={<MainLayout />} errorElement={<ErrorBoundary />}>
<Route index element={<Home />} />
<Route
index
loader={() =>
REDIRECTED_404.test(window.location.search)
? redirect(REDIRECTED_404.exec(window.location.search)?.[1] ?? "/")
: true
}
element={<Home />}
/>
<Route path="docs" element={<DocsLayout />}>
<Route index loader={() => redirect("/docs/introduction")} />
<Route
@ -169,15 +190,15 @@ const router = createBrowserRouter(
`/docs/components/${Object.keys(docsModules)[0]
.split("/")
.pop()
?.replace(".mdx", "")}`
?.replace(".mdx", "")}`,
)
}
/>
{routes}
</Route>
</Route>
</Route>
)
</Route>,
),
);
function App() {