Compare commits
No commits in common. "33b57bf173022c8a6d117b03da81ae3de0192b57" and "dfd9055318d3b7b61746974cd4a8df7e3d7a88da" have entirely different histories.
33b57bf173
...
dfd9055318
1
.gitignore
vendored
1
.gitignore
vendored
@ -21,7 +21,6 @@ build/
|
||||
*.pem
|
||||
.turbo
|
||||
bin/
|
||||
cache.json
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
|
2
.vscode/react.code-snippets
vendored
2
.vscode/react.code-snippets
vendored
@ -3,7 +3,7 @@
|
||||
"scope": "typescriptreact",
|
||||
"prefix": "rfc",
|
||||
"body": [
|
||||
"export interface ${1:ComponentName}Props {}",
|
||||
"interface ${1:ComponentName}Props {}",
|
||||
"",
|
||||
"export const ${1:ComponentName}: React.FC<${1:ComponentName}Props> = () => {",
|
||||
" return (",
|
||||
|
15
TODO.md
15
TODO.md
@ -2,18 +2,17 @@
|
||||
|
||||
- [x] chore: initial commit (+ mirror on GitHub)
|
||||
- [x] Deploy first staging version (v1.0.0-staging.1)
|
||||
- [ ] Implement Wikipedia Game Solver (`website`) with inputs, button to submit, and list all pages to go from one to another, or none if it is not possible
|
||||
- [ ] Check, cache and store (in `.json` file) all Wikipedia Pages and its internal links, maybe use Wikipedia Dump (<https://en.wikipedia.org/wiki/Wikipedia:Database_download>)?
|
||||
- [ ] Implement toast notifications for errors, warnings, and success messages
|
||||
- [ ] Implement CLI (`cli`)
|
||||
- [ ] Implement REST API (`api`) with JSON responses ([AdonisJS](https://adonisjs.com/))
|
||||
- [ ] Add docs to add locale/edit translations, create component, install a dependency in a package, create a new package, technology used, architecture, links where it's deployed, how to use/install for end users, how to update dependencies with `npx taze -l` etc.
|
||||
- [ ] Implement Wikipedia Game Solver (`website`) with inputs, button to submit, and list all articles to go from one to another, or none if it is not possible
|
||||
- [ ] v1.0.0-staging.2
|
||||
- [ ] Implement CLI (`cli`)
|
||||
- [ ] v1.0.0-staging.3
|
||||
- [ ] Implement REST API (`api`) with JSON responses ([AdonisJS](https://adonisjs.com/))
|
||||
- [ ] v1.0.0-staging.4
|
||||
- [ ] v1.0.0
|
||||
|
||||
## Links
|
||||
|
||||
- <https://www.sixdegreesofwikipedia.com/> and <https://github.com/jwngr/sdow>
|
||||
- <https://github.com/shyamupa/wikidump_preprocessing>
|
||||
- <https://www.mediawiki.org/wiki/API:Allpages>
|
||||
- <https://www.thewikigame.com/>
|
||||
- How to get all URLs in a Wikipedia page: <https://stackoverflow.com/questions/14882571/how-to-get-all-urls-in-a-wikipedia-page>
|
||||
- <https://en.wikipedia.org/w/api.php?action=query&titles=Title&prop=links&pllimit=max&format=json>
|
||||
|
@ -11,13 +11,13 @@
|
||||
},
|
||||
"scripts": {
|
||||
"start": "node --import=tsx ./src/index.ts",
|
||||
"dev-test": "node --import=tsx --watch --watch-preserve-output ./src/index.ts",
|
||||
"dev": "node --import=tsx --watch --watch-preserve-output ./src/index.ts",
|
||||
"lint:eslint": "eslint src --max-warnings 0 --report-unused-disable-directives",
|
||||
"lint:typescript": "tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@repo/wikipedia-game-solver": "workspace:*",
|
||||
"@repo/utils": "workspace:*",
|
||||
"@repo/constants": "workspace:*",
|
||||
"tsx": "catalog:"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
@ -1,62 +1,11 @@
|
||||
#!/usr/bin/env -S node --import=tsx
|
||||
|
||||
import type { WikipediaPagesInternalLinks } from "@repo/wikipedia-game-solver/wikipedia-api"
|
||||
import { getWikipediaPageInternalLinks } from "@repo/wikipedia-game-solver/wikipedia-api"
|
||||
import fs from "node:fs"
|
||||
import path from "node:path"
|
||||
import { add } from "#abc/def/add.js"
|
||||
|
||||
const localeWikipedia = "en"
|
||||
const cachePath = path.join(process.cwd(), "cache.json")
|
||||
import { VERSION } from "@repo/constants"
|
||||
import { sum } from "@repo/wikipedia-game-solver/wikipedia-api"
|
||||
|
||||
const fromPageInput = "New York City"
|
||||
// const fromPageInput = "Linux"
|
||||
// const toPageInput = "Node.js"
|
||||
// console.log({
|
||||
// fromPageInput,
|
||||
// toPageInput,
|
||||
// })
|
||||
// const [fromPageWikipediaLinks, toPageWikipediaLinks] = await Promise.all([
|
||||
// getWikipediaPageInternalLinks({
|
||||
// title: fromPageInput,
|
||||
// locale: localeWikipedia,
|
||||
// }),
|
||||
// getWikipediaPageInternalLinks({
|
||||
// title: toPageInput,
|
||||
// locale: localeWikipedia,
|
||||
// }),
|
||||
// ])
|
||||
// console.log({
|
||||
// fromPageWikipediaLinks,
|
||||
// toPageWikipediaLinks,
|
||||
// })
|
||||
// const data = {
|
||||
// [fromPageWikipediaLinks.title]: fromPageWikipediaLinks,
|
||||
// [toPageWikipediaLinks.title]: toPageWikipediaLinks,
|
||||
// }
|
||||
|
||||
const data = JSON.parse(
|
||||
await fs.promises.readFile(cachePath, { encoding: "utf-8" }),
|
||||
) as WikipediaPagesInternalLinks
|
||||
|
||||
// let maxLinks = { max: 0, title: "" }
|
||||
// for (const [title, page] of Object.entries(data)) {
|
||||
// if (page.links.length > maxLinks.max) {
|
||||
// maxLinks = { max: page.links.length, title }
|
||||
// }
|
||||
// }
|
||||
// console.log(maxLinks)
|
||||
|
||||
const pageLinks = (data[fromPageInput]?.links ?? []).slice(0, 1100)
|
||||
for (const pageLink of pageLinks) {
|
||||
if (pageLink in data) {
|
||||
continue
|
||||
}
|
||||
console.log("Fetching", pageLink)
|
||||
data[pageLink] = await getWikipediaPageInternalLinks({
|
||||
title: pageLink,
|
||||
locale: localeWikipedia,
|
||||
})
|
||||
}
|
||||
await fs.promises.writeFile(cachePath, JSON.stringify(data, null, 2), {
|
||||
encoding: "utf-8",
|
||||
})
|
||||
console.log("Hello, world!")
|
||||
console.log(sum(1, 2))
|
||||
console.log(add(2, 3))
|
||||
console.log(`v${VERSION}`)
|
||||
|
@ -1,11 +0,0 @@
|
||||
#!/usr/bin/env -S node --import=tsx
|
||||
|
||||
import { add } from "#abc/def/add.js"
|
||||
|
||||
import { VERSION } from "@repo/utils/constants"
|
||||
import { sum } from "@repo/wikipedia-game-solver/wikipedia-api"
|
||||
|
||||
console.log("Hello, world!")
|
||||
console.log(sum(1, 2))
|
||||
console.log(add(2, 3))
|
||||
console.log(`v${VERSION}`)
|
@ -1,9 +1,9 @@
|
||||
import "@repo/config-tailwind/styles.css"
|
||||
import { defaultTranslationValues, Locale } from "@repo/i18n/config"
|
||||
import { defaultTranslationValues } from "@repo/i18n/config"
|
||||
import i18nMessagesEnglish from "@repo/i18n/translations/en-US.json"
|
||||
import { ThemeProvider } from "@repo/ui/Header/SwitchTheme"
|
||||
import type { Preview } from "@storybook/react"
|
||||
import { NextIntlClientProvider } from "next-intl"
|
||||
import { ThemeProvider as NextThemeProvider } from "next-themes"
|
||||
import React from "react"
|
||||
|
||||
const preview: Preview = {
|
||||
@ -13,7 +13,7 @@ const preview: Preview = {
|
||||
},
|
||||
options: {
|
||||
storySort: {
|
||||
order: ["Design System", "Layout", "Errors"],
|
||||
order: ["Design System", "User Interface", "Feature"],
|
||||
},
|
||||
},
|
||||
backgrounds: { disable: true },
|
||||
@ -32,18 +32,16 @@ const preview: Preview = {
|
||||
},
|
||||
decorators: [
|
||||
(Story) => {
|
||||
const locale = "en-US" satisfies Locale
|
||||
|
||||
return (
|
||||
<NextThemeProvider enableColorScheme={false}>
|
||||
<ThemeProvider>
|
||||
<NextIntlClientProvider
|
||||
messages={i18nMessagesEnglish}
|
||||
locale={locale}
|
||||
locale="en"
|
||||
defaultTranslationValues={defaultTranslationValues}
|
||||
>
|
||||
<Story />
|
||||
</NextIntlClientProvider>
|
||||
</NextThemeProvider>
|
||||
</ThemeProvider>
|
||||
)
|
||||
},
|
||||
],
|
||||
|
@ -19,7 +19,6 @@
|
||||
"@repo/wikipedia-game-solver": "workspace:*",
|
||||
"next": "catalog:",
|
||||
"next-intl": "catalog:",
|
||||
"next-themes": "catalog:",
|
||||
"react": "catalog:",
|
||||
"react-dom": "catalog:"
|
||||
},
|
||||
|
@ -5,7 +5,7 @@ RUN corepack enable
|
||||
WORKDIR /usr/src/app
|
||||
|
||||
FROM node-pnpm AS builder
|
||||
RUN pnpm install --global turbo@2.0.10
|
||||
RUN pnpm install --global turbo@2.0.9
|
||||
COPY ./ ./
|
||||
RUN turbo prune @repo/website --docker
|
||||
|
||||
|
@ -1,10 +1,34 @@
|
||||
"use client"
|
||||
|
||||
import type { ErrorServerProps } from "@repo/ui/Errors/ErrorServer"
|
||||
import { ErrorServer } from "@repo/ui/Errors/ErrorServer"
|
||||
import { Button } from "@repo/ui/design/Button"
|
||||
import { MainLayout } from "@repo/ui/MainLayout"
|
||||
import { useTranslations } from "next-intl"
|
||||
import { useEffect } from "react"
|
||||
|
||||
const ErrorBoundaryPage: React.FC<ErrorServerProps> = (props) => {
|
||||
return <ErrorServer {...props} />
|
||||
interface ErrorBoundaryPageProps {
|
||||
error: Error & { digest?: string }
|
||||
reset: () => void
|
||||
}
|
||||
|
||||
const ErrorBoundaryPage: React.FC<ErrorBoundaryPageProps> = (props) => {
|
||||
const { error, reset } = props
|
||||
|
||||
const t = useTranslations()
|
||||
|
||||
useEffect(() => {
|
||||
console.error(error)
|
||||
}, [error])
|
||||
|
||||
return (
|
||||
<MainLayout className="items-center justify-center text-center">
|
||||
<h1 className="text-3xl font-semibold">
|
||||
{t("errors.error")} 500 - {t("errors.server-error")}
|
||||
</h1>
|
||||
<p className="mb-4 mt-2">
|
||||
<Button onClick={reset}>{t("errors.try-again")}</Button>
|
||||
</p>
|
||||
</MainLayout>
|
||||
)
|
||||
}
|
||||
|
||||
export default ErrorBoundaryPage
|
||||
|
@ -1,10 +1,10 @@
|
||||
import "@repo/config-tailwind/styles.css"
|
||||
import { VERSION } from "@repo/constants"
|
||||
import type { Locale, LocaleProps } from "@repo/i18n/config"
|
||||
import { LOCALES } from "@repo/i18n/config"
|
||||
import { Footer } from "@repo/ui/Layout/Footer"
|
||||
import { Header } from "@repo/ui/Layout/Header"
|
||||
import { ThemeProvider } from "@repo/ui/Layout/Header/SwitchTheme"
|
||||
import { VERSION } from "@repo/utils/constants"
|
||||
import { Footer } from "@repo/ui/Footer"
|
||||
import { Header } from "@repo/ui/Header"
|
||||
import { ThemeProvider } from "@repo/ui/Header/SwitchTheme"
|
||||
import type { Metadata } from "next"
|
||||
import { NextIntlClientProvider } from "next-intl"
|
||||
import {
|
||||
@ -17,37 +17,9 @@ export const generateMetadata = async ({
|
||||
params,
|
||||
}: LocaleProps): Promise<Metadata> => {
|
||||
const t = await getTranslations({ locale: params.locale })
|
||||
const title = t("meta.title")
|
||||
const description = t("meta.description")
|
||||
const image = "/images/Wikipedia-Logo.webp"
|
||||
const url = new URL("https://wikipedia-game-solver.theoludwig.fr")
|
||||
const locale = LOCALES.join(", ")
|
||||
|
||||
return {
|
||||
title,
|
||||
description,
|
||||
metadataBase: url,
|
||||
openGraph: {
|
||||
title,
|
||||
description,
|
||||
url,
|
||||
siteName: title,
|
||||
images: [
|
||||
{
|
||||
url: image,
|
||||
width: 96,
|
||||
height: 96,
|
||||
},
|
||||
],
|
||||
locale,
|
||||
type: "website",
|
||||
},
|
||||
twitter: {
|
||||
card: "summary",
|
||||
title,
|
||||
description,
|
||||
images: [image],
|
||||
},
|
||||
title: t("meta.title"),
|
||||
description: t("meta.description"),
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,9 +1,9 @@
|
||||
import { Spinner } from "@repo/ui/Design/Spinner"
|
||||
import { MainLayout } from "@repo/ui/Layout/MainLayout"
|
||||
import { MainLayout } from "@repo/ui/MainLayout"
|
||||
import { Spinner } from "@repo/ui/design/Spinner"
|
||||
|
||||
const Loading: React.FC = () => {
|
||||
return (
|
||||
<MainLayout center>
|
||||
<MainLayout className="items-center justify-center">
|
||||
<Spinner size={50} />
|
||||
</MainLayout>
|
||||
)
|
||||
|
@ -1,10 +1,24 @@
|
||||
import { ErrorNotFound } from "@repo/ui/Errors/ErrorNotFound"
|
||||
import { Link } from "@repo/ui/design/Link"
|
||||
import { MainLayout } from "@repo/ui/MainLayout"
|
||||
import { useTranslations } from "next-intl"
|
||||
|
||||
/**
|
||||
* Note that `app/[locale]/[...rest]/page.tsx` is necessary for this page to render.
|
||||
*/
|
||||
const NotFound: React.FC = () => {
|
||||
return <ErrorNotFound />
|
||||
const t = useTranslations()
|
||||
|
||||
return (
|
||||
<MainLayout className="items-center justify-center text-center">
|
||||
<h1 className="text-3xl font-semibold">
|
||||
{t("errors.error")} 404 - {t("errors.not-found")}
|
||||
</h1>
|
||||
<p className="mb-4 mt-2">
|
||||
{t("errors.page-doesnt-exist")}{" "}
|
||||
<Link href="/">{t("errors.return-to-home-page")}</Link>
|
||||
</p>
|
||||
</MainLayout>
|
||||
)
|
||||
}
|
||||
|
||||
export default NotFound
|
||||
|
@ -1,17 +1,13 @@
|
||||
import type { LocaleProps } from "@repo/i18n/config"
|
||||
import { Link } from "@repo/ui/Design/Link"
|
||||
import { Typography } from "@repo/ui/Design/Typography"
|
||||
import { MainLayout } from "@repo/ui/Layout/MainLayout"
|
||||
import {
|
||||
fromLocaleToWikipediaLocale,
|
||||
getWikipediaLink,
|
||||
} from "@repo/wikipedia-game-solver/wikipedia-api"
|
||||
import { Link } from "@repo/ui/design/Link"
|
||||
import { Typography } from "@repo/ui/design/Typography"
|
||||
import { MainLayout } from "@repo/ui/MainLayout"
|
||||
import { WikipediaClient } from "@repo/wikipedia-game-solver/WikipediaClient"
|
||||
import { useTranslations } from "next-intl"
|
||||
import { unstable_setRequestLocale } from "next-intl/server"
|
||||
import Image from "next/image"
|
||||
|
||||
import WikipediaLogo from "#public/images/Wikipedia-Logo.webp"
|
||||
import WikipediaLogo from "#public/images/Wikipedia-Logo.png"
|
||||
|
||||
interface HomePageProps extends LocaleProps {}
|
||||
|
||||
@ -23,8 +19,6 @@ const HomePage: React.FC<HomePageProps> = (props) => {
|
||||
|
||||
const t = useTranslations()
|
||||
|
||||
const localeWikipedia = fromLocaleToWikipediaLocale(params.locale)
|
||||
|
||||
return (
|
||||
<MainLayout>
|
||||
<section className="text-center">
|
||||
@ -34,9 +28,9 @@ const HomePage: React.FC<HomePageProps> = (props) => {
|
||||
|
||||
<Typography as="p" variant="text1" className="mt-3">
|
||||
{t.rich("home.description", {
|
||||
"wikipedia-link": (children) => {
|
||||
wikipedia: (children) => {
|
||||
return (
|
||||
<Link href={getWikipediaLink(localeWikipedia)} target="_blank">
|
||||
<Link href="https://en.wikipedia.org/" target="_blank">
|
||||
{children}
|
||||
</Link>
|
||||
)
|
||||
|
@ -14,8 +14,6 @@ export const config = {
|
||||
|
||||
// Set a cookie to remember the previous locale for
|
||||
// all requests that have a locale prefix
|
||||
// Next.js issue, middleware matcher should support template literals:
|
||||
// https://github.com/vercel/next.js/issues/56398
|
||||
"/(en-US|fr-FR)/:path*",
|
||||
|
||||
// Enable redirects that add missing locales
|
||||
|
@ -15,7 +15,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@repo/config-tailwind": "workspace:*",
|
||||
"@repo/utils": "workspace:*",
|
||||
"@repo/constants": "workspace:*",
|
||||
"@repo/i18n": "workspace:*",
|
||||
"@repo/ui": "workspace:*",
|
||||
"@repo/wikipedia-game-solver": "workspace:*",
|
||||
@ -23,7 +23,7 @@
|
||||
"next-intl": "catalog:",
|
||||
"react": "catalog:",
|
||||
"react-dom": "catalog:",
|
||||
"sharp": "catalog:"
|
||||
"react-icons": "catalog:"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@repo/eslint-config": "workspace:*",
|
||||
|
BIN
apps/website/public/images/Wikipedia-Logo.png
Normal file
BIN
apps/website/public/images/Wikipedia-Logo.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 272 KiB |
Binary file not shown.
Before Width: | Height: | Size: 91 KiB |
@ -2,7 +2,11 @@ import sharedConfig from "@repo/config-tailwind"
|
||||
|
||||
/** @type {Pick<import('tailwindcss').Config, "presets" | "content">} */
|
||||
const config = {
|
||||
content: ["./**/*.tsx", "../../packages/**/*.tsx"],
|
||||
content: [
|
||||
"./**/*.tsx",
|
||||
"../../packages/ui/**/*.tsx",
|
||||
"../../packages/wikipedia-game-solver/**/*.tsx",
|
||||
],
|
||||
presets: [sharedConfig],
|
||||
}
|
||||
|
||||
|
@ -1,17 +0,0 @@
|
||||
# Wikipedia data
|
||||
|
||||
Database layout: <https://www.mediawiki.org/wiki/Manual:Database_layout>
|
||||
|
||||
<https://stackoverflow.com/questions/43954631/issues-with-wikipedia-dump-table-pagelinks>
|
||||
|
||||
<https://stackoverflow.com/questions/40384864/importing-wikipedia-dump-to-mysql>
|
||||
|
||||
## Dumps Links
|
||||
|
||||
- <https://dumps.wikimedia.org/enwiki/>
|
||||
|
||||
- <https://dumps.wikimedia.org/enwiki/latest/enwiki-latest-pagelinks.sql.gz>
|
||||
- <https://dumps.wikimedia.org/enwiki/latest/enwiki-latest-page.sql.gz>
|
||||
- <https://dumps.wikimedia.org/enwiki/latest/enwiki-latest-all-titles-in-ns0.gz>
|
||||
- <https://dumps.wikimedia.org/enwiki/latest/enwiki-latest-iwlinks.sql.gz>
|
||||
- <https://dumps.wikimedia.org/enwiki/latest/enwiki-latest-all-titles.gz>
|
@ -24,12 +24,11 @@
|
||||
"@semantic-release/exec": "6.0.3",
|
||||
"@semantic-release/git": "10.0.1",
|
||||
"editorconfig-checker": "5.1.8",
|
||||
"playwright": "catalog:",
|
||||
"prettier": "3.3.3",
|
||||
"prettier-plugin-tailwindcss": "0.6.5",
|
||||
"replace-in-files-cli": "3.0.0",
|
||||
"semantic-release": "23.1.1",
|
||||
"turbo": "2.0.10",
|
||||
"turbo": "2.0.9",
|
||||
"typescript": "catalog:"
|
||||
}
|
||||
}
|
||||
|
@ -23,7 +23,6 @@ const config = {
|
||||
yellow: "#fef08a",
|
||||
transparent: "transparent",
|
||||
inherit: "inherit",
|
||||
current: "currentColor",
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ["'Montserrat'", ...fontFamily.sans],
|
||||
|
@ -13,8 +13,6 @@
|
||||
|
||||
"isolatedModules": true,
|
||||
"esModuleInterop": true,
|
||||
"skipLibCheck": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true
|
||||
"skipLibCheck": true
|
||||
}
|
||||
}
|
||||
|
17
packages/constants/package.json
Normal file
17
packages/constants/package.json
Normal file
@ -0,0 +1,17 @@
|
||||
{
|
||||
"name": "@repo/constants",
|
||||
"version": "1.0.0-staging.1",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"exports": {
|
||||
".": "./version.ts"
|
||||
},
|
||||
"scripts": {
|
||||
"lint:typescript": "tsc --noEmit"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@repo/config-typescript": "workspace:*",
|
||||
"@types/node": "catalog:",
|
||||
"typescript": "catalog:"
|
||||
}
|
||||
}
|
@ -2,12 +2,9 @@
|
||||
"extends": "@repo/config-typescript/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"module": "NodeNext",
|
||||
"moduleResolution": "NodeNext",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Bundler",
|
||||
"resolveJsonModule": true,
|
||||
"lib": ["ESNext"],
|
||||
"types": ["@types/node", "@total-typescript/ts-reset"],
|
||||
|
||||
"noEmit": true
|
||||
}
|
||||
}
|
6
packages/constants/version.ts
Normal file
6
packages/constants/version.ts
Normal file
@ -0,0 +1,6 @@
|
||||
import packageJSON from "./package.json"
|
||||
|
||||
export const VERSION =
|
||||
process.env["NODE_ENV"] === "development"
|
||||
? "0.0.0-development"
|
||||
: packageJSON.version
|
@ -1,15 +1,13 @@
|
||||
{
|
||||
"meta": {
|
||||
"title": "Wikipedia Game Solver",
|
||||
"description": "The Wikipedia Game involves players competing to navigate from one Wikipedia page to another using only internal links."
|
||||
"description": "The Wikipedia Game involves players competing to navigate from one Wikipedia page to another using only internal links.",
|
||||
"all-rights-reserved": "All rights reserved"
|
||||
},
|
||||
"locales": {
|
||||
"en-US": "🇺🇸 English",
|
||||
"fr-FR": "🇫🇷 French"
|
||||
},
|
||||
"footer": {
|
||||
"all-rights-reserved": "All rights reserved"
|
||||
},
|
||||
"errors": {
|
||||
"error": "Error",
|
||||
"page-doesnt-exist": "This page doesn't exist!",
|
||||
@ -20,6 +18,6 @@
|
||||
},
|
||||
"home": {
|
||||
"title": "Wikipedia Game Solver",
|
||||
"description": "The Wikipedia Game involves players competing to navigate from one <wikipedia-link>Wikipedia</wikipedia-link> page to another using only internal links."
|
||||
"description": "The Wikipedia Game involves players competing to navigate from one <wikipedia>Wikipedia</wikipedia> page to another using only internal links."
|
||||
}
|
||||
}
|
||||
|
@ -1,15 +1,13 @@
|
||||
{
|
||||
"meta": {
|
||||
"title": "Wikipedia Game Solver",
|
||||
"description": "Le jeu Wikipédia implique des joueurs en compétition pour naviguer d'une page Wikipédia à une autre en utilisant uniquement des liens internes."
|
||||
"description": "Le jeu Wikipédia implique des joueurs en compétition pour naviguer d'une page Wikipédia à une autre en utilisant uniquement des liens internes.",
|
||||
"all-rights-reserved": "Tous droits réservés"
|
||||
},
|
||||
"locales": {
|
||||
"en-US": "🇺🇸 Anglais",
|
||||
"fr-FR": "🇫🇷 Français"
|
||||
},
|
||||
"footer": {
|
||||
"all-rights-reserved": "Tous droits réservés"
|
||||
},
|
||||
"errors": {
|
||||
"error": "Erreur",
|
||||
"page-doesnt-exist": "Cette page n'existe pas !",
|
||||
@ -20,6 +18,6 @@
|
||||
},
|
||||
"home": {
|
||||
"title": "Wikipedia Game Solver",
|
||||
"description": "Le jeu Wikipédia implique des joueurs en compétition pour naviguer d'une page <wikipedia-link>Wikipedia</wikipedia-link> à une autre en utilisant uniquement des liens internes."
|
||||
"description": "Le jeu Wikipédia implique des joueurs en compétition pour naviguer d'une page Wikipédia à une autre en utilisant uniquement des liens internes."
|
||||
}
|
||||
}
|
||||
|
@ -4,14 +4,11 @@
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"exports": {
|
||||
"./useBoolean": "./src/useBoolean.ts",
|
||||
"./useIsMounted": "./src/useIsMounted.ts"
|
||||
},
|
||||
"scripts": {
|
||||
"lint:eslint": "eslint src --max-warnings 0 --report-unused-disable-directives",
|
||||
"lint:typescript": "tsc --noEmit",
|
||||
"test": "vitest run --browser.headless",
|
||||
"test:ui": "vitest --ui --no-open"
|
||||
"lint:typescript": "tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "catalog:",
|
||||
@ -20,16 +17,10 @@
|
||||
"devDependencies": {
|
||||
"@repo/eslint-config": "workspace:*",
|
||||
"@repo/config-typescript": "workspace:*",
|
||||
"@testing-library/react": "catalog:",
|
||||
"@types/react": "catalog:",
|
||||
"@types/react-dom": "catalog:",
|
||||
"@total-typescript/ts-reset": "catalog:",
|
||||
"@vitest/browser": "catalog:",
|
||||
"@vitest/coverage-istanbul": "catalog:",
|
||||
"@vitest/ui": "catalog:",
|
||||
"eslint": "catalog:",
|
||||
"playwright": "catalog:",
|
||||
"typescript": "catalog:",
|
||||
"vitest": "catalog:"
|
||||
"typescript": "catalog:"
|
||||
}
|
||||
}
|
||||
|
@ -1,83 +0,0 @@
|
||||
import { act, renderHook } from "@testing-library/react"
|
||||
|
||||
import { describe, expect, it } from "vitest"
|
||||
import { useBoolean } from "../useBoolean"
|
||||
|
||||
describe("useBoolean", () => {
|
||||
const initialValues = [true, false]
|
||||
|
||||
for (const initialValue of initialValues) {
|
||||
it(`should set the initial value to ${initialValue}`, () => {
|
||||
// Arrange - Given
|
||||
const { result } = renderHook(() => {
|
||||
return useBoolean({ initialValue })
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.value).toBe(initialValue)
|
||||
})
|
||||
}
|
||||
|
||||
it("should by default set the initial value to false", () => {
|
||||
// Arrange - Given
|
||||
const { result } = renderHook(() => {
|
||||
return useBoolean()
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.value).toBe(false)
|
||||
})
|
||||
|
||||
it("should toggle the value", () => {
|
||||
// Arrange - Given
|
||||
const { result } = renderHook(() => {
|
||||
return useBoolean({ initialValue: false })
|
||||
})
|
||||
|
||||
// Act - When
|
||||
act(() => {
|
||||
return result.current.toggle()
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.value).toBe(true)
|
||||
|
||||
// Act - When
|
||||
act(() => {
|
||||
return result.current.toggle()
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.value).toBe(false)
|
||||
})
|
||||
|
||||
it("should set the value to true", () => {
|
||||
// Arrange - Given
|
||||
const { result } = renderHook(() => {
|
||||
return useBoolean({ initialValue: false })
|
||||
})
|
||||
|
||||
// Act - When
|
||||
act(() => {
|
||||
return result.current.setTrue()
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.value).toBe(true)
|
||||
})
|
||||
|
||||
it("should set the value to false", () => {
|
||||
// Arrange - Given
|
||||
const { result } = renderHook(() => {
|
||||
return useBoolean({ initialValue: true })
|
||||
})
|
||||
|
||||
// Act - When
|
||||
act(() => {
|
||||
return result.current.setFalse()
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.value).toBe(false)
|
||||
})
|
||||
})
|
@ -1,16 +0,0 @@
|
||||
import { renderHook } from "@testing-library/react"
|
||||
|
||||
import { describe, expect, it } from "vitest"
|
||||
import { useIsMounted } from "../useIsMounted"
|
||||
|
||||
describe("useIsMounted", () => {
|
||||
it("should return true", () => {
|
||||
// Arrange - Given
|
||||
const { result } = renderHook(() => {
|
||||
return useIsMounted()
|
||||
})
|
||||
|
||||
// Assert - Then
|
||||
expect(result.current.isMounted).toBe(true)
|
||||
})
|
||||
})
|
@ -1,50 +0,0 @@
|
||||
import { useState } from "react"
|
||||
|
||||
export interface UseBooleanOutput {
|
||||
value: boolean
|
||||
setValue: React.Dispatch<React.SetStateAction<boolean>>
|
||||
setTrue: () => void
|
||||
setFalse: () => void
|
||||
toggle: () => void
|
||||
}
|
||||
|
||||
export interface UseBooleanInput {
|
||||
/**
|
||||
* The initial value of the boolean.
|
||||
* @default false
|
||||
*/
|
||||
initialValue?: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* Hook to manage a boolean state.
|
||||
* @param options
|
||||
* @returns
|
||||
*/
|
||||
export const useBoolean = (options: UseBooleanInput = {}): UseBooleanOutput => {
|
||||
const { initialValue = false } = options
|
||||
|
||||
const [value, setValue] = useState(initialValue)
|
||||
|
||||
const toggle = (): void => {
|
||||
setValue((old) => {
|
||||
return !old
|
||||
})
|
||||
}
|
||||
|
||||
const setTrue = (): void => {
|
||||
setValue(true)
|
||||
}
|
||||
|
||||
const setFalse = (): void => {
|
||||
setValue(false)
|
||||
}
|
||||
|
||||
return {
|
||||
value,
|
||||
setValue,
|
||||
toggle,
|
||||
setTrue,
|
||||
setFalse,
|
||||
}
|
||||
}
|
@ -1,15 +0,0 @@
|
||||
import { defineConfig } from "vitest/config"
|
||||
|
||||
export default defineConfig({
|
||||
test: {
|
||||
browser: {
|
||||
provider: "playwright",
|
||||
enabled: true,
|
||||
name: "chromium",
|
||||
},
|
||||
coverage: {
|
||||
enabled: true,
|
||||
provider: "istanbul",
|
||||
},
|
||||
},
|
||||
})
|
@ -4,17 +4,14 @@
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"exports": {
|
||||
"./Design/Button": "./src/Design/Button/Button.tsx",
|
||||
"./Design/Link": "./src/Design/Link/Link.tsx",
|
||||
"./Design/Spinner": "./src/Design/Spinner/Spinner.tsx",
|
||||
"./Design/Typography": "./src/Design/Typography/Typography.tsx",
|
||||
"./Errors/ErrorNotFound": "./src/Errors/ErrorNotFound/ErrorNotFound.tsx",
|
||||
"./Errors/ErrorServer": "./src/Errors/ErrorServer/ErrorServer.tsx",
|
||||
"./Layout/Footer": "./src/Layout/Footer/Footer.tsx",
|
||||
"./Layout/Header": "./src/Layout/Header/Header.tsx",
|
||||
"./Layout/Header/SwitchTheme": "./src/Layout/Header/SwitchTheme.tsx",
|
||||
"./Layout/MainLayout": "./src/Layout/MainLayout/MainLayout.tsx",
|
||||
"./Layout/Section": "./src/Layout/Section/Section.tsx"
|
||||
"./design/Button": "./src/design/Button/Button.tsx",
|
||||
"./design/Link": "./src/design/Link/Link.tsx",
|
||||
"./design/Spinner": "./src/design/Spinner/Spinner.tsx",
|
||||
"./design/Typography": "./src/design/Typography/Typography.tsx",
|
||||
"./Footer": "./src/Footer/Footer.tsx",
|
||||
"./Header": "./src/Header/Header.tsx",
|
||||
"./Header/SwitchTheme": "./src/Header/SwitchTheme.tsx",
|
||||
"./MainLayout": "./src/MainLayout/MainLayout.tsx"
|
||||
},
|
||||
"scripts": {
|
||||
"lint:eslint": "eslint src --max-warnings 0 --report-unused-disable-directives",
|
||||
@ -22,7 +19,6 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@repo/config-tailwind": "workspace:*",
|
||||
"@repo/utils": "workspace:*",
|
||||
"@repo/i18n": "workspace:*",
|
||||
"@repo/react-hooks": "workspace:*",
|
||||
"cva": "catalog:",
|
||||
|
@ -1,16 +0,0 @@
|
||||
import type { Meta, StoryObj } from "@storybook/react"
|
||||
|
||||
import { ErrorNotFound as ErrorNotFoundComponent } from "./ErrorNotFound"
|
||||
|
||||
const meta = {
|
||||
title: "Errors/ErrorNotFound",
|
||||
component: ErrorNotFoundComponent,
|
||||
} satisfies Meta<typeof ErrorNotFoundComponent>
|
||||
|
||||
export default meta
|
||||
|
||||
type Story = StoryObj<typeof meta>
|
||||
|
||||
export const ErrorNotFound: Story = {
|
||||
args: {},
|
||||
}
|
@ -1,26 +0,0 @@
|
||||
import { useTranslations } from "next-intl"
|
||||
import { Link } from "../../Design/Link/Link"
|
||||
import { Typography } from "../../Design/Typography/Typography"
|
||||
import { MainLayout } from "../../Layout/MainLayout/MainLayout"
|
||||
import { Section } from "../../Layout/Section/Section"
|
||||
|
||||
export interface ErrorNotFoundProps {}
|
||||
|
||||
export const ErrorNotFound: React.FC<ErrorNotFoundProps> = () => {
|
||||
const t = useTranslations()
|
||||
|
||||
return (
|
||||
<MainLayout center>
|
||||
<Section horizontalSpacing>
|
||||
<Typography variant="h1" as="h1">
|
||||
{t("errors.error")} 404 - {t("errors.not-found")}
|
||||
</Typography>
|
||||
|
||||
<Typography variant="text1" as="p" className="mt-4">
|
||||
{t("errors.page-doesnt-exist")}{" "}
|
||||
<Link href="/">{t("errors.return-to-home-page")}</Link>
|
||||
</Typography>
|
||||
</Section>
|
||||
</MainLayout>
|
||||
)
|
||||
}
|
@ -1,22 +0,0 @@
|
||||
import type { Meta, StoryObj } from "@storybook/react"
|
||||
import { expect, fn, userEvent, within } from "@storybook/test"
|
||||
|
||||
import { ErrorServer as ErrorServerComponent } from "./ErrorServer"
|
||||
|
||||
const meta = {
|
||||
title: "Errors/ErrorServer",
|
||||
component: ErrorServerComponent,
|
||||
} satisfies Meta<typeof ErrorServerComponent>
|
||||
|
||||
export default meta
|
||||
|
||||
type Story = StoryObj<typeof meta>
|
||||
|
||||
export const ErrorServer: Story = {
|
||||
args: { reset: fn(), error: new Error("Server error") },
|
||||
play: async ({ canvasElement, args }) => {
|
||||
const canvas = within(canvasElement)
|
||||
await userEvent.click(canvas.getByText("Try again?"))
|
||||
await expect(args.reset).toHaveBeenCalled()
|
||||
},
|
||||
}
|
@ -1,37 +0,0 @@
|
||||
"use client"
|
||||
|
||||
import { useTranslations } from "next-intl"
|
||||
import { useEffect } from "react"
|
||||
import { Button } from "../../Design/Button/Button"
|
||||
import { Typography } from "../../Design/Typography/Typography"
|
||||
import { MainLayout } from "../../Layout/MainLayout/MainLayout"
|
||||
import { Section } from "../../Layout/Section/Section"
|
||||
|
||||
export interface ErrorServerProps {
|
||||
error: Error & { digest?: string }
|
||||
reset: () => void
|
||||
}
|
||||
|
||||
export const ErrorServer: React.FC<ErrorServerProps> = (props) => {
|
||||
const { error, reset } = props
|
||||
|
||||
const t = useTranslations()
|
||||
|
||||
useEffect(() => {
|
||||
console.error(error)
|
||||
}, [error])
|
||||
|
||||
return (
|
||||
<MainLayout center>
|
||||
<Section horizontalSpacing>
|
||||
<Typography variant="h1" as="h1">
|
||||
{t("errors.error")} 500 - {t("errors.server-error")}
|
||||
</Typography>
|
||||
|
||||
<Typography variant="text1" as="p" className="mt-4">
|
||||
<Button onClick={reset}>{t("errors.try-again")}</Button>
|
||||
</Typography>
|
||||
</Section>
|
||||
</MainLayout>
|
||||
)
|
||||
}
|
@ -3,7 +3,7 @@ import type { Meta, StoryObj } from "@storybook/react"
|
||||
import { Footer as FooterComponent } from "./Footer"
|
||||
|
||||
const meta = {
|
||||
title: "Layout/Footer",
|
||||
title: "User Interface/Footer",
|
||||
component: FooterComponent,
|
||||
} satisfies Meta<typeof FooterComponent>
|
||||
|
@ -1,7 +1,6 @@
|
||||
import { useTranslations } from "next-intl"
|
||||
|
||||
import { GIT_REPO_LINK } from "@repo/utils/constants"
|
||||
import { Link } from "../../Design/Link/Link"
|
||||
import { Link } from "../design/Link/Link"
|
||||
|
||||
export interface FooterProps {
|
||||
version: string
|
||||
@ -13,23 +12,19 @@ export const Footer: React.FC<FooterProps> = (props) => {
|
||||
const t = useTranslations()
|
||||
|
||||
return (
|
||||
<footer className="bg-background dark:bg-background-dark border-gray-darker dark:border-gray-darker-dark flex flex-col items-center justify-center border-t-2 px-6 py-2 text-lg">
|
||||
<footer className="bg-background dark:bg-background-dark border-gray-darker dark:border-gray-darker-dark flex h-20 flex-col items-center justify-center border-t-2 px-6 py-2 text-lg">
|
||||
<p>
|
||||
<Link href="https://theoludwig.fr" target="_blank" isExternal={false}>
|
||||
Théo LUDWIG
|
||||
</Link>{" "}
|
||||
| {t("footer.all-rights-reserved")}
|
||||
| {t("meta.all-rights-reserved")}
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Version{" "}
|
||||
<Link
|
||||
href={`${GIT_REPO_LINK}/releases/tag/v${version}`}
|
||||
target="_blank"
|
||||
isExternal={false}
|
||||
>
|
||||
<strong className="text-primary dark:text-primary-dark hover:underline">
|
||||
{version}
|
||||
</Link>
|
||||
</strong>
|
||||
</p>
|
||||
</footer>
|
||||
)
|
@ -3,7 +3,7 @@ import type { Meta, StoryObj } from "@storybook/react"
|
||||
import { Header as HeaderComponent } from "./Header"
|
||||
|
||||
const meta = {
|
||||
title: "Layout/Header",
|
||||
title: "User Interface/Header",
|
||||
component: HeaderComponent,
|
||||
} satisfies Meta<typeof HeaderComponent>
|
||||
|
@ -5,7 +5,7 @@ import { SwitchTheme } from "./SwitchTheme"
|
||||
|
||||
export const Header: React.FC = () => {
|
||||
return (
|
||||
<header className="bg-background dark:bg-background-dark border-gray-darker dark:border-gray-darker-dark sticky top-0 z-50 flex flex-col items-center justify-center gap-4 border-b-2 px-4 py-2">
|
||||
<header className="bg-background dark:bg-background-dark border-gray-darker dark:border-gray-darker-dark sticky top-0 z-50 flex h-16 flex-col items-center justify-center gap-4 border-b-2 px-4 py-2">
|
||||
<div className="flex w-full items-center justify-between">
|
||||
<Locales />
|
||||
<SwitchTheme />
|
@ -1,7 +1,6 @@
|
||||
"use client"
|
||||
|
||||
import { classNames } from "@repo/config-tailwind/classNames"
|
||||
import type { Locale } from "@repo/i18n/config"
|
||||
import { LOCALES } from "@repo/i18n/config"
|
||||
import { usePathname, useRouter } from "@repo/i18n/navigation"
|
||||
import { useLocale, useTranslations } from "next-intl"
|
||||
@ -9,7 +8,7 @@ import { useLocale, useTranslations } from "next-intl"
|
||||
export const Locales: React.FC = () => {
|
||||
const router = useRouter()
|
||||
const pathname = usePathname()
|
||||
const localeCurrent = useLocale() as Locale
|
||||
const currentLocale = useLocale()
|
||||
|
||||
const t = useTranslations()
|
||||
|
||||
@ -22,7 +21,7 @@ export const Locales: React.FC = () => {
|
||||
key={locale}
|
||||
className={classNames("rounded-md p-2", {
|
||||
"border-primary dark:border-primary-dark border":
|
||||
locale === localeCurrent,
|
||||
locale === currentLocale,
|
||||
})}
|
||||
>
|
||||
<button
|
@ -2,18 +2,13 @@
|
||||
|
||||
import { classNames } from "@repo/config-tailwind/classNames"
|
||||
import { useIsMounted } from "@repo/react-hooks/useIsMounted"
|
||||
import {
|
||||
ThemeProvider as NextThemeProvider,
|
||||
useTheme as useNextTheme,
|
||||
} from "next-themes"
|
||||
import { ThemeProvider as NextThemeProvider, useTheme } from "next-themes"
|
||||
|
||||
export const THEMES = ["light", "dark"] as const
|
||||
export type Theme = (typeof THEMES)[number]
|
||||
export const THEME_DEFAULT = "dark" as Theme
|
||||
export const THEME_DEFAULT = "light" as Theme
|
||||
|
||||
export interface ThemeProviderProps extends React.PropsWithChildren {}
|
||||
|
||||
export const ThemeProvider: React.FC<ThemeProviderProps> = (props) => {
|
||||
export const ThemeProvider: React.FC<React.PropsWithChildren> = (props) => {
|
||||
const { children } = props
|
||||
|
||||
return (
|
||||
@ -27,35 +22,19 @@ export const ThemeProvider: React.FC<ThemeProviderProps> = (props) => {
|
||||
)
|
||||
}
|
||||
|
||||
export interface UseThemeOutput {
|
||||
theme: Theme
|
||||
toggleTheme: () => void
|
||||
}
|
||||
|
||||
export const useTheme = (): UseThemeOutput => {
|
||||
const { setTheme, theme: themeData } = useNextTheme()
|
||||
export const SwitchTheme: React.FC = () => {
|
||||
const { setTheme, theme: themeData } = useTheme()
|
||||
const { isMounted } = useIsMounted()
|
||||
|
||||
const theme = isMounted ? (themeData as Theme) : THEME_DEFAULT
|
||||
|
||||
const toggleTheme: UseThemeOutput["toggleTheme"] = () => {
|
||||
const handleClick = (): void => {
|
||||
const newTheme = theme === "dark" ? "light" : "dark"
|
||||
setTheme(newTheme)
|
||||
}
|
||||
|
||||
return {
|
||||
theme,
|
||||
toggleTheme,
|
||||
}
|
||||
}
|
||||
|
||||
export interface SwitchThemeProps {}
|
||||
|
||||
export const SwitchTheme: React.FC<SwitchThemeProps> = () => {
|
||||
const { theme, toggleTheme } = useTheme()
|
||||
|
||||
return (
|
||||
<div className="flex items-center justify-center" onClick={toggleTheme}>
|
||||
<div className="flex items-center justify-center" onClick={handleClick}>
|
||||
<div className="relative inline-block cursor-pointer touch-pan-x select-none border-0 bg-transparent p-0">
|
||||
<div className="h-[24px] w-[50px] rounded-[30px] bg-[#4d4d4d] p-0 text-white transition-all duration-200 ease-in-out">
|
||||
<div
|
@ -1,24 +0,0 @@
|
||||
import { classNames } from "@repo/config-tailwind/classNames"
|
||||
|
||||
export interface MainLayoutProps
|
||||
extends React.ComponentPropsWithoutRef<"main"> {
|
||||
className?: string
|
||||
center?: boolean
|
||||
}
|
||||
|
||||
export const MainLayout: React.FC<MainLayoutProps> = (props) => {
|
||||
const { className, center = false, ...rest } = props
|
||||
|
||||
return (
|
||||
<main
|
||||
className={classNames(
|
||||
"min-h-[calc(100vh-188px)] md:mx-auto md:max-w-4xl lg:max-w-7xl",
|
||||
{
|
||||
"flex flex-col items-center justify-center text-center": center,
|
||||
},
|
||||
className,
|
||||
)}
|
||||
{...rest}
|
||||
/>
|
||||
)
|
||||
}
|
@ -1,29 +0,0 @@
|
||||
import { classNames } from "@repo/config-tailwind/classNames"
|
||||
|
||||
export interface SectionProps
|
||||
extends React.ComponentPropsWithoutRef<"section"> {
|
||||
verticalSpacing?: boolean
|
||||
horizontalSpacing?: boolean
|
||||
}
|
||||
|
||||
export const Section: React.FC<SectionProps> = (props) => {
|
||||
const {
|
||||
className,
|
||||
verticalSpacing = false,
|
||||
horizontalSpacing = false,
|
||||
...rest
|
||||
} = props
|
||||
|
||||
return (
|
||||
<section
|
||||
className={classNames(
|
||||
{
|
||||
"my-12": verticalSpacing,
|
||||
"mx-6": horizontalSpacing,
|
||||
},
|
||||
className,
|
||||
)}
|
||||
{...rest}
|
||||
/>
|
||||
)
|
||||
}
|
20
packages/ui/src/MainLayout/MainLayout.tsx
Normal file
20
packages/ui/src/MainLayout/MainLayout.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import { classNames } from "@repo/config-tailwind/classNames"
|
||||
|
||||
export interface MainLayoutProps extends React.PropsWithChildren {
|
||||
className?: string
|
||||
}
|
||||
|
||||
export const MainLayout: React.FC<MainLayoutProps> = (props) => {
|
||||
const { children, className } = props
|
||||
|
||||
return (
|
||||
<main
|
||||
className={classNames(
|
||||
"flex min-h-[calc(100vh-144px)] flex-col p-6",
|
||||
className,
|
||||
)}
|
||||
>
|
||||
{children}
|
||||
</main>
|
||||
)
|
||||
}
|
@ -11,8 +11,8 @@ const typographyVariants = cva({
|
||||
h4: "text-xl font-semibold",
|
||||
h5: "text-xl font-medium",
|
||||
h6: "text-lg font-medium",
|
||||
text1: "break-words text-base",
|
||||
text2: "break-words text-sm",
|
||||
text1: "text-base",
|
||||
text2: "text-sm",
|
||||
},
|
||||
},
|
||||
})
|
@ -1,14 +0,0 @@
|
||||
{
|
||||
"root": true,
|
||||
"extends": ["@repo/eslint-config"],
|
||||
"overrides": [
|
||||
{
|
||||
"files": ["*.ts", "*.tsx"],
|
||||
"plugins": ["@typescript-eslint"],
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"parserOptions": {
|
||||
"project": true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
@ -1,28 +0,0 @@
|
||||
{
|
||||
"name": "@repo/utils",
|
||||
"version": "3.3.2",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"exports": {
|
||||
"./constants": "./src/constants.ts",
|
||||
"./dates": "./src/dates.ts",
|
||||
"./strings": "./src/strings.ts"
|
||||
},
|
||||
"scripts": {
|
||||
"lint:eslint": "eslint src --max-warnings 0 --report-unused-disable-directives",
|
||||
"lint:typescript": "tsc --noEmit",
|
||||
"test": "vitest run",
|
||||
"test:ui": "vitest --ui --no-open"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@repo/eslint-config": "workspace:*",
|
||||
"@repo/config-typescript": "workspace:*",
|
||||
"@types/node": "catalog:",
|
||||
"@total-typescript/ts-reset": "catalog:",
|
||||
"@vitest/coverage-istanbul": "catalog:",
|
||||
"@vitest/ui": "catalog:",
|
||||
"eslint": "catalog:",
|
||||
"typescript": "catalog:",
|
||||
"vitest": "catalog:"
|
||||
}
|
||||
}
|
@ -1,9 +0,0 @@
|
||||
import packageJSON from "../package.json"
|
||||
|
||||
export const VERSION =
|
||||
process.env["NODE_ENV"] === "development"
|
||||
? "0.0.0-development"
|
||||
: packageJSON.version
|
||||
|
||||
export const GIT_REPO_LINK =
|
||||
"https://git.theoludwig.fr/theoludwig/wikipedia-game-solver"
|
@ -1,10 +0,0 @@
|
||||
/**
|
||||
* Returns a date as a string value in ISO 8601 format (without time information).
|
||||
*
|
||||
* @param date
|
||||
* @returns
|
||||
* @example getISODate(new Date("2012-05-23")) // "2012-05-23"
|
||||
*/
|
||||
export const getISODate = (date: Date): string => {
|
||||
return date.toISOString().slice(0, 10)
|
||||
}
|
@ -1,9 +0,0 @@
|
||||
/**
|
||||
* Capitalize the first letter of a string.
|
||||
* @param string
|
||||
* @returns
|
||||
* @example capitalize("hello, world!") // "Hello, world!"
|
||||
*/
|
||||
export const capitalize = (string: string): string => {
|
||||
return string.charAt(0).toUpperCase() + string.slice(1)
|
||||
}
|
@ -1,36 +0,0 @@
|
||||
import { afterEach, describe, expect, it, vi } from "vitest"
|
||||
|
||||
describe("VERSION", () => {
|
||||
afterEach(() => {
|
||||
vi.unstubAllEnvs()
|
||||
vi.resetModules()
|
||||
vi.restoreAllMocks()
|
||||
})
|
||||
|
||||
it('should return "0.0.0-development" when NODE_ENV is development', async () => {
|
||||
// Arrange - Given
|
||||
vi.stubEnv("NODE_ENV", "development")
|
||||
|
||||
// Act - When
|
||||
const { VERSION } = await import("../constants.js")
|
||||
|
||||
// Assert - Then
|
||||
const expected = "0.0.0-development"
|
||||
expect(VERSION).toEqual(expected)
|
||||
})
|
||||
|
||||
it("should return the version from package.json when NODE_ENV is not development", async () => {
|
||||
// Arrange - Given
|
||||
vi.stubEnv("NODE_ENV", "production")
|
||||
vi.mock("../../package.json", () => {
|
||||
return { default: { version: "1.0.0" } }
|
||||
})
|
||||
|
||||
// Act - When
|
||||
const { VERSION } = await import("../constants.js")
|
||||
|
||||
// Assert - Then
|
||||
const expected = "1.0.0"
|
||||
expect(VERSION).toEqual(expected)
|
||||
})
|
||||
})
|
@ -1,17 +0,0 @@
|
||||
import { describe, expect, it } from "vitest"
|
||||
|
||||
import { getISODate } from "../dates.js"
|
||||
|
||||
describe("getISODate", () => {
|
||||
it("should return the correct date in ISO format (e.g: 2012-05-23)", () => {
|
||||
// Arrange - Given
|
||||
const input = new Date("2012-05-23")
|
||||
|
||||
// Act - When
|
||||
const output = getISODate(input)
|
||||
|
||||
// Assert - Then
|
||||
const expected = "2012-05-23"
|
||||
expect(output).toEqual(expected)
|
||||
})
|
||||
})
|
@ -1,41 +0,0 @@
|
||||
import { describe, expect, it } from "vitest"
|
||||
|
||||
import { capitalize } from "../strings.js"
|
||||
|
||||
describe("capitalize", () => {
|
||||
it("should capitalize the first letter of a string", () => {
|
||||
// Arrange - Given
|
||||
const input = "hello, world!"
|
||||
|
||||
// Act - When
|
||||
const output = capitalize(input)
|
||||
|
||||
// Assert - Then
|
||||
const expected = "Hello, world!"
|
||||
expect(output).toEqual(expected)
|
||||
})
|
||||
|
||||
it("should return an empty string when the input is an empty string", () => {
|
||||
// Arrange - Given
|
||||
const input = ""
|
||||
|
||||
// Act - When
|
||||
const output = capitalize(input)
|
||||
|
||||
// Assert - Then
|
||||
const expected = ""
|
||||
expect(output).toEqual(expected)
|
||||
})
|
||||
|
||||
it("should return the same string when the first letter is already capitalized", () => {
|
||||
// Arrange - Given
|
||||
const input = "Hello, world!"
|
||||
|
||||
// Act - When
|
||||
const output = capitalize(input)
|
||||
|
||||
// Assert - Then
|
||||
const expected = "Hello, world!"
|
||||
expect(output).toEqual(expected)
|
||||
})
|
||||
})
|
@ -1,10 +0,0 @@
|
||||
import { defineConfig } from "vitest/config"
|
||||
|
||||
export default defineConfig({
|
||||
test: {
|
||||
coverage: {
|
||||
enabled: true,
|
||||
provider: "istanbul",
|
||||
},
|
||||
},
|
||||
})
|
@ -17,7 +17,6 @@
|
||||
"@repo/config-tailwind": "workspace:*",
|
||||
"@repo/i18n": "workspace:*",
|
||||
"@repo/ui": "workspace:*",
|
||||
"ky": "catalog:",
|
||||
"next": "catalog:",
|
||||
"next-intl": "catalog:",
|
||||
"react": "catalog:",
|
||||
|
@ -1,51 +1,21 @@
|
||||
"use client"
|
||||
|
||||
import { Button } from "@repo/ui/Design/Button"
|
||||
import { Link } from "@repo/ui/Design/Link"
|
||||
import { Typography } from "@repo/ui/Design/Typography"
|
||||
import { Button } from "@repo/ui/design/Button"
|
||||
import { useState } from "react"
|
||||
import {
|
||||
fromLocaleToWikipediaLocale,
|
||||
getWikipediaLink,
|
||||
getWikipediaPageInternalLinks,
|
||||
} from "./wikipedia-api"
|
||||
|
||||
const wait = async (ms: number): Promise<void> => {
|
||||
return await new Promise((resolve) => {
|
||||
setTimeout(resolve, ms)
|
||||
})
|
||||
}
|
||||
|
||||
export const WikipediaClient: React.FC = () => {
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
|
||||
const localeWikipedia = fromLocaleToWikipediaLocale("en-US")
|
||||
const wikipediaLink = getWikipediaLink(localeWikipedia)
|
||||
|
||||
const handleClick: React.MouseEventHandler<HTMLButtonElement> = async () => {
|
||||
console.log("clicked")
|
||||
setIsLoading(true)
|
||||
const fromPageInput = "Linux"
|
||||
const toPageInput = "Node.js"
|
||||
console.log({
|
||||
fromPageInput,
|
||||
toPageInput,
|
||||
})
|
||||
const [fromPageWikipediaLinks, toPageWikipediaLinks] = await Promise.all([
|
||||
getWikipediaPageInternalLinks({
|
||||
title: fromPageInput,
|
||||
locale: localeWikipedia,
|
||||
}),
|
||||
getWikipediaPageInternalLinks({
|
||||
title: toPageInput,
|
||||
locale: localeWikipedia,
|
||||
}),
|
||||
])
|
||||
console.log({
|
||||
fromPageWikipediaLinks,
|
||||
toPageWikipediaLinks,
|
||||
})
|
||||
// const deepInternalLinks = await getDeepWikipediaPageInternalLinks({
|
||||
// locale: localeWikipedia,
|
||||
// data: {
|
||||
// [fromPageWikipediaLinks.title]: fromPageWikipediaLinks,
|
||||
// [toPageWikipediaLinks.title]: toPageWikipediaLinks,
|
||||
// },
|
||||
// })
|
||||
// console.log(deepInternalLinks)
|
||||
await wait(2_000)
|
||||
setIsLoading(false)
|
||||
}
|
||||
|
||||
@ -54,11 +24,15 @@ export const WikipediaClient: React.FC = () => {
|
||||
<Button onClick={handleClick} isLoading={isLoading} className="w-36">
|
||||
Wikipedia
|
||||
</Button>
|
||||
<Typography variant="text1" as="p">
|
||||
<Link href={wikipediaLink} target="_blank">
|
||||
{wikipediaLink.replace("https://", "")}
|
||||
</Link>
|
||||
</Typography>
|
||||
|
||||
<Button
|
||||
onClick={handleClick}
|
||||
variant="outline"
|
||||
isLoading={isLoading}
|
||||
className="w-36"
|
||||
>
|
||||
Wikipedia
|
||||
</Button>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
@ -2,7 +2,7 @@ import { describe, expect, it } from "vitest"
|
||||
|
||||
import { sum } from "../wikipedia-api"
|
||||
|
||||
describe("sum", () => {
|
||||
describe("wikipedia-game-solver", () => {
|
||||
it("adds 1 + 2 to equal 3", () => {
|
||||
expect(sum(1, 2)).toBe(3)
|
||||
})
|
||||
|
@ -1,194 +1,28 @@
|
||||
import type { Locale } from "@repo/i18n/config"
|
||||
import ky from "ky"
|
||||
|
||||
export const sum = (a: number, b: number): number => {
|
||||
return a + b
|
||||
}
|
||||
|
||||
/**
|
||||
* @see https://www.mediawiki.org/wiki/Wikimedia_REST_API#Terms_and_conditions
|
||||
* To avoid impacting other API users, limit your clients to no more than 200 requests/sec to this API overall. Many entry points additionally specify and enforce more restrictive rate limits (HTTP 429 error).
|
||||
*/
|
||||
export const wikipediaAPIBaseURL = new URL("https://en.wikipedia.org/w/api.php")
|
||||
|
||||
export const WIKIPEDIA_LOCALES = ["en", "fr"] as const
|
||||
export type WikipediaLocale = (typeof WIKIPEDIA_LOCALES)[number]
|
||||
|
||||
const WIKIPEDIA_LOCALES_MAP: Record<Locale, WikipediaLocale> = {
|
||||
"en-US": "en",
|
||||
"fr-FR": "fr",
|
||||
}
|
||||
|
||||
export const fromLocaleToWikipediaLocale = (
|
||||
locale: Locale,
|
||||
): WikipediaLocale => {
|
||||
return WIKIPEDIA_LOCALES_MAP[locale]
|
||||
}
|
||||
|
||||
export const getWikipediaLink = (locale: WikipediaLocale): string => {
|
||||
return `https://${locale}.wikipedia.org`
|
||||
}
|
||||
|
||||
interface WikipediaQueryLinksResponse {
|
||||
continue?: {
|
||||
plcontinue: string
|
||||
continue: string
|
||||
}
|
||||
query: {
|
||||
pages: {
|
||||
[key: string]: {
|
||||
pageid: number
|
||||
ns: number
|
||||
title: string
|
||||
links: [
|
||||
{
|
||||
ns: number
|
||||
title: string
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
limits: {
|
||||
links: number
|
||||
}
|
||||
}
|
||||
|
||||
interface GetWikipediaPageInternalLinksInput {
|
||||
title: string
|
||||
locale: WikipediaLocale
|
||||
}
|
||||
|
||||
interface GetWikipediaPageInternalLinksOutput {
|
||||
/**
|
||||
* Title of the Wikipedia page.
|
||||
*/
|
||||
title: string
|
||||
|
||||
/**
|
||||
* Page id is unique for each page on Wikipedia, can be used to link to the page.
|
||||
* @example `https://${locale}.wikipedia.org/?curid=${pageId}`
|
||||
*/
|
||||
pageId: number
|
||||
|
||||
/**
|
||||
* List of internal links on the Wikipedia page.
|
||||
*/
|
||||
links: string[]
|
||||
}
|
||||
|
||||
/**
|
||||
* Get internal links from a Wikipedia page.
|
||||
* @param input
|
||||
* @returns
|
||||
*/
|
||||
export const getWikipediaPageInternalLinks = async (
|
||||
input: GetWikipediaPageInternalLinksInput,
|
||||
): Promise<GetWikipediaPageInternalLinksOutput> => {
|
||||
const links: string[] = []
|
||||
let title = input.title
|
||||
let pageId = 0
|
||||
let plcontinue: string | null = null
|
||||
|
||||
const fetchLinks = async (): Promise<WikipediaQueryLinksResponse> => {
|
||||
const url = new URL("/w/api.php", getWikipediaLink(input.locale))
|
||||
url.searchParams.append("action", "query")
|
||||
url.searchParams.append("titles", title)
|
||||
url.searchParams.append("prop", "links")
|
||||
url.searchParams.append("pllimit", "max")
|
||||
url.searchParams.append("format", "json")
|
||||
url.searchParams.append("origin", "*")
|
||||
if (plcontinue != null) {
|
||||
url.searchParams.set("plcontinue", plcontinue)
|
||||
}
|
||||
return await ky
|
||||
.get(url, {
|
||||
method: "GET",
|
||||
})
|
||||
.json()
|
||||
}
|
||||
|
||||
do {
|
||||
try {
|
||||
const response = await fetchLinks()
|
||||
plcontinue = response?.continue?.plcontinue ?? null
|
||||
const pages = Object.keys(response.query.pages)
|
||||
const page = pages[0] ?? ""
|
||||
if (page === "-1" || page === "") {
|
||||
break
|
||||
}
|
||||
const pageData = response.query.pages[page]
|
||||
if (pageData == null) {
|
||||
break
|
||||
}
|
||||
title = pageData.title
|
||||
pageId = pageData.pageid
|
||||
links.push(
|
||||
...pageData.links.map((link) => {
|
||||
return link.title
|
||||
}),
|
||||
)
|
||||
} catch (error) {
|
||||
console.error("Error", error)
|
||||
console.error("title", title)
|
||||
throw error
|
||||
}
|
||||
} while (plcontinue != null)
|
||||
|
||||
return {
|
||||
title,
|
||||
pageId,
|
||||
links,
|
||||
}
|
||||
}
|
||||
|
||||
export interface WikipediaPagesInternalLinks {
|
||||
[key: string]: GetWikipediaPageInternalLinksOutput
|
||||
}
|
||||
|
||||
export interface GetDeepWikipediaPageInternalLinksInput {
|
||||
locale: WikipediaLocale
|
||||
data: WikipediaPagesInternalLinks
|
||||
}
|
||||
|
||||
export const getDeepWikipediaPageInternalLinks = async (
|
||||
input: GetDeepWikipediaPageInternalLinksInput,
|
||||
): Promise<void> => {
|
||||
const pagesTitles = Object.keys(input.data)
|
||||
for (const pageTitle of pagesTitles) {
|
||||
const links = input.data[pageTitle]?.links ?? []
|
||||
for (const pageTitleLink of links) {
|
||||
if (pageTitleLink in input.data) {
|
||||
continue
|
||||
}
|
||||
input.data[pageTitleLink] = await getWikipediaPageInternalLinks({
|
||||
locale: input.locale,
|
||||
title: pageTitleLink,
|
||||
})
|
||||
// await getDeepWikipediaPageInternalLinks({
|
||||
// locale: input.locale,
|
||||
// data: input.data,
|
||||
// const getWikipediaPageLinks = async (title: string): Promise<string[]> => {
|
||||
// const url = new URL(wikipediaAPIBaseURL)
|
||||
// url.searchParams.append("action", "query")
|
||||
// url.searchParams.append("titles", title)
|
||||
// url.searchParams.append("prop", "links")
|
||||
// url.searchParams.append("pllimit", "max")
|
||||
// url.searchParams.append("format", "json")
|
||||
// url.searchParams.append("origin", "*")
|
||||
// const response = await fetch(url, {
|
||||
// method: "GET",
|
||||
// })
|
||||
}
|
||||
}
|
||||
|
||||
// await Promise.all(
|
||||
// pagesTitles.map(async (pageTitle) => {
|
||||
// const links = input.data[pageTitle]?.links ?? []
|
||||
// await Promise.all(
|
||||
// links.map(async (pageTitleLink) => {
|
||||
// if (pageTitleLink in input.data) {
|
||||
// return
|
||||
// if (!response.ok) {
|
||||
// throw new Error(response.statusText)
|
||||
// }
|
||||
// input.data[pageTitleLink] = await getWikipediaPageInternalLinks({
|
||||
// locale: input.locale,
|
||||
// title: pageTitleLink,
|
||||
// })
|
||||
// await getDeepWikipediaPageInternalLinks({
|
||||
// locale: input.locale,
|
||||
// data: input.data,
|
||||
// })
|
||||
// }),
|
||||
// )
|
||||
// }),
|
||||
// )
|
||||
}
|
||||
// const json = await response.json()
|
||||
// return json
|
||||
// }
|
||||
|
||||
// const links = await getWikipediaPageLinks("France")
|
||||
// const links2 = await getWikipediaPageLinks("Frddgdgdgance")
|
||||
// console.log("links.length", links)
|
||||
// console.log("links.length", links2)
|
||||
|
3531
pnpm-lock.yaml
generated
3531
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@ -5,7 +5,6 @@ packages:
|
||||
catalog:
|
||||
# Utils
|
||||
"deepmerge": "4.3.1"
|
||||
"ky": "1.5.0"
|
||||
|
||||
# React.js/Next.js
|
||||
"next": "14.2.5"
|
||||
@ -16,57 +15,53 @@ catalog:
|
||||
"react-icons": "5.2.1"
|
||||
"@types/react": "18.3.3"
|
||||
"@types/react-dom": "18.3.0"
|
||||
"sharp": "0.33.4"
|
||||
|
||||
# TypeScript
|
||||
"typescript": "5.5.4"
|
||||
"@total-typescript/ts-reset": "0.5.1"
|
||||
"@types/node": "22.0.0"
|
||||
"tsx": "4.16.3"
|
||||
"@types/node": "20.14.12"
|
||||
"tsx": "4.16.2"
|
||||
|
||||
# ESLint
|
||||
"@typescript-eslint/eslint-plugin": "7.18.0"
|
||||
"@typescript-eslint/parser": "7.18.0"
|
||||
"@typescript-eslint/eslint-plugin": "7.17.0"
|
||||
"@typescript-eslint/parser": "7.17.0"
|
||||
"eslint": "8.57.0"
|
||||
"eslint-config-conventions": "14.4.0"
|
||||
"eslint-plugin-promise": "7.0.0"
|
||||
"eslint-plugin-unicorn": "55.0.0"
|
||||
"eslint-config-conventions": "14.3.0"
|
||||
"eslint-plugin-promise": "6.5.1"
|
||||
"eslint-plugin-unicorn": "54.0.0"
|
||||
"eslint-config-next": "14.2.5"
|
||||
"eslint-plugin-storybook": "0.8.0"
|
||||
"eslint-plugin-tailwindcss": "3.17.4"
|
||||
|
||||
# Storybook
|
||||
"@chromatic-com/storybook": "1.6.1"
|
||||
"@storybook/addon-a11y": "8.2.6"
|
||||
"@storybook/addon-essentials": "8.2.6"
|
||||
"@storybook/addon-interactions": "8.2.6"
|
||||
"@storybook/addon-links": "8.2.6"
|
||||
"@storybook/addon-storysource": "8.2.6"
|
||||
"@storybook/addon-themes": "8.2.6"
|
||||
"@storybook/blocks": "8.2.6"
|
||||
"@storybook/nextjs": "8.2.6"
|
||||
"@storybook/react": "8.2.6"
|
||||
"@storybook/test": "8.2.6"
|
||||
"@storybook/addon-a11y": "8.2.5"
|
||||
"@storybook/addon-essentials": "8.2.5"
|
||||
"@storybook/addon-interactions": "8.2.5"
|
||||
"@storybook/addon-links": "8.2.5"
|
||||
"@storybook/addon-storysource": "8.2.5"
|
||||
"@storybook/addon-themes": "8.2.5"
|
||||
"@storybook/blocks": "8.2.5"
|
||||
"@storybook/nextjs": "8.2.5"
|
||||
"@storybook/react": "8.2.5"
|
||||
"@storybook/test": "8.2.5"
|
||||
"@storybook/test-runner": "0.19.1"
|
||||
"chromatic": "11.6.0"
|
||||
"chromatic": "11.5.6"
|
||||
"http-server": "14.1.1"
|
||||
"storybook": "8.2.6"
|
||||
"storybook": "8.2.5"
|
||||
"storybook-dark-mode": "4.0.2"
|
||||
|
||||
# Testing
|
||||
"playwright": "1.45.3"
|
||||
"@playwright/test": "1.45.3"
|
||||
"axe-playwright": "2.0.1"
|
||||
"start-server-and-test": "2.0.5"
|
||||
"@vitest/browser": "2.0.5"
|
||||
"@vitest/coverage-istanbul": "2.0.5"
|
||||
"@vitest/ui": "2.0.5"
|
||||
"vitest": "2.0.5"
|
||||
"@testing-library/react": "16.0.0"
|
||||
"start-server-and-test": "2.0.4"
|
||||
"@vitest/coverage-istanbul": "2.0.4"
|
||||
"@vitest/ui": "2.0.4"
|
||||
"vitest": "2.0.4"
|
||||
|
||||
# CSS
|
||||
"postcss": "8.4.40"
|
||||
"tailwindcss": "3.4.7"
|
||||
"postcss": "8.4.39"
|
||||
"tailwindcss": "3.4.6"
|
||||
"@fontsource/montserrat": "5.0.18"
|
||||
"clsx": "2.1.0"
|
||||
"cva": "1.0.0-beta.1"
|
||||
|
@ -1,6 +1,5 @@
|
||||
{
|
||||
"$schema": "https://turbo.build/schema.json",
|
||||
"ui": "tui",
|
||||
"tasks": {
|
||||
"build": {
|
||||
"inputs": ["$TURBO_DEFAULT$", ".env*"],
|
||||
|
Reference in New Issue
Block a user