From d8e9e4f71f450ef3d523a5835fd786bb49a6731c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Corn=C3=A9=20Dorrestijn?= Date: Tue, 9 May 2023 21:05:15 +0200 Subject: [PATCH] First steps toward app dir --- .babelrc | 4 - app/global.css | 500 +++++++++++++++++++++++++++++ app/layout.js | 28 ++ app/page.mdx | 20 ++ components/DarkModeSwitcher.res | 7 +- components/Footer.res | 24 +- components/FooterShare.res | 31 ++ components/Layout.res | 10 +- components/LayoutMenu.res | 15 + components/MarketData.res | 22 ++ components/fonts.tsx | 11 + mdx-components.js | 9 + next-env.d.ts | 1 + next.config.mjs | 9 +- package-lock.json | 83 ++--- package.json | 10 +- pages/_document.tsx | 3 + pages/{index.mdx => index.mdx.old} | 0 pages/marketdata.res | 25 +- tsconfig.json | 10 +- 20 files changed, 713 insertions(+), 109 deletions(-) delete mode 100644 .babelrc create mode 100644 app/global.css create mode 100644 app/layout.js create mode 100644 app/page.mdx create mode 100644 components/FooterShare.res create mode 100644 components/LayoutMenu.res create mode 100644 components/MarketData.res create mode 100644 components/fonts.tsx create mode 100644 mdx-components.js rename pages/{index.mdx => index.mdx.old} (100%) diff --git a/.babelrc b/.babelrc deleted file mode 100644 index e3b5134..0000000 --- a/.babelrc +++ /dev/null @@ -1,4 +0,0 @@ -{ - "presets": ["next/babel"], - "plugins": ["import-glob-array"] -} diff --git a/app/global.css b/app/global.css new file mode 100644 index 0000000..33f86af --- /dev/null +++ b/app/global.css @@ -0,0 +1,500 @@ +html { + --gradient: linear-gradient( + 180deg, + rgba(140, 73, 207, 0.25) 0%, + rgba(140, 72, 207, 0.05) 100% + ); + + --font-title: 'Pacifico', cursive; + --font-body: 'Balsamiq Sans', sans-serif; + --gray: #999; +} + +html, +body { + padding: 0; + margin: 0; + font-family: var(--font-body); + line-height: 1.5; + font-size: 18px; + + color: var(--color-text); + background: var(--color-background); + + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +* { + box-sizing: border-box; +} + +a { + color: var(--color-primary); + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +p { + padding: 10px 0; + margin: 0; +} + +/* Styles that are available on every page */ + +/* Layout */ +.header { + padding: 20px 40px 0; + height: 180px; + background: var(--gradient); +} + +.headerContent { + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + max-width: 1152px; + margin: 0 auto; +} + +.headerName { + font-family: var(--font-title); + font-size: 32px; +} + +.navLinks { + display: flex; + align-items: center; +} + +.hamburger { + display: none; +} + +@media (max-width: 500px) { + .navLinks { + display: none; + position: fixed; + z-index: 10; + flex-direction: column; + top: 0; + left: 0; + bottom: 0; + right: 0; + padding: 1em; + align-items: flex-start; + + background: var(--color-background) var(--gradient); + } + + .navLinks-open { + display: flex; + } + + .lightSwitch { + margin-left: 25px; + } + + .hamburger { + display: flex; + justify-content: space-between; + position: relative; + z-index: 20; + height: 15px; + width: 20px; + border: none; + background: none; + padding: 0; + flex-direction: column; + cursor: pointer; + } + + .hamburger span { + background: var(--color-primary); + height: 2px; + width: 100%; + } +} + +.navLink { + padding: 10px; + margin-left: 16px; +} + +.navLink:last-of-type { + padding-right: 0; +} + +.main { + position: relative; + background: var(--color-background); +} + +.content { + max-width: 792px; + padding: 40px 10px; + margin: 0 auto; +} + +/* see @media min-width 500px */ + +.pageTop { + position: absolute; + width: 100%; + max-height: 52px; + height: 8vw; + bottom: 100%; + object-fit: fill; + color: var(--color-background, white); +} + +/* Blog */ +.blogLink { + color: inherit; +} + +.blogLinkTime, +.subtleText { + color: var(--gray); + font-size: smaller; +} + +/* Button */ +.button { + background-color: var(--color-primary); + border: none; + padding: 5px 10px; + box-shadow: 3px 5px rgba(0, 0, 0, 0.3); + cursor: pointer; + font-size: inherit; +} + +.button:hover { + opacity: 0.8; +} + +/* Light switch */ +.lightSwitchIcons { + display: grid; + grid-template-rows: 1fr 1fr; + grid-gap: 10px; + width: 1em; + transition: 320ms cubic-bezier(0.445, 0.05, 0.55, 0.95) transform; + transform: translateY(var(--light-switch-icon-start-pos)); +} + +.lightSwitch { + padding: 10px 10px 10px 0; + margin-left: 10px; + background: none; + border: none; + font-size: 24px; + cursor: pointer; + overflow: hidden; + box-sizing: content-box; + height: 24px; + color: var(--color-primary); +} + +.lightSwitch:hover .lightSwitchIcons { + transform: translateY(var(--light-switch-icon-end-pos)); +} + +/* Titles */ +.title { + font-size: 32px; + font-weight: normal; + text-align: center; + padding: 0 0 20px; + margin: 0; + font-family: var(--font-title); +} + +.subtitle { + font-size: 24px; + font-weight: normal; + padding: 26px 0 10px; + margin: 0; + font-family: var(--font-body); +} + +@media (min-width: 500px) { + .content { + padding: 40px; + } +} + +/* @TODO: move to css modules */ +.RCounter_counter { + background: #ddd; + color: black; + display: inline-block; + padding: 5px 10px; +} + +.heightTest { + height: 80vh; + background: url(https://cdn.corne.info/crop?type=auto&stripmeta=true&url=https://i.redd.it/hzfuwxc84h971.jpg&quality=95&width=1080&height=1080); + background-size: cover; + background-position: center center; + padding: 20px; +} + +.heightTest span { + background: white; + color: black; + padding: 2px; +} + +.heightTestSpacer { + height: 80vh; +} + +.heightTestFixedTop, +.heightTestFixedBottom { + position: fixed; + right: 10px; + padding: 10px; + background: red; + color: white; +} +.heightTestFixedTop { + top: 10px; +} + +.heightTestFixedBottom { + bottom: 10px; +} + +.siteFooter { + padding-top: 60px; + padding-bottom: 40px; + color: var(--gray); + text-align: center; + font-size: 14px; +} + +.commonIcons { + display: none; +} + +/* Fediverse */ +.fedi { + margin-left: 0; + margin-top: 20px; + + --avatar-size: 64px; + --content-offset: calc(0px - var(--avatar-size) - 20px); +} + +@media (min-width: 1200px) { + .fedi { + margin-left: -140px; + } +} + +.fedi_status { + flex-direction: row; + display: flex; + gap: 20px; + padding: 20px; + border: solid thin var(--color-secondary); + box-shadow: 0 2px 6px var(--color-secondary); + border-radius: 6px; + margin-bottom: 20px; +} + +.fedi_statusAvatarImg { + border-radius: 3px; + width: var(--avatar-size); + height: var(--avatar-size); +} + +.fedi_statusMedia { + margin-top: 10px; + display: flex; + flex-wrap: wrap; + gap: 10px; + margin-left: var(--content-offset); +} + +.fedi_statusMediaImg { + border-radius: 6px; + border: solid 2px var(--color-secondary); + object-fit: cover; + width: 100px; + height: auto; + aspect-ratio: 9 / 6; +} + +.fedi_statusMediaVideo { + border-radius: 6px; + border: solid 2px var(--color-secondary); + object-fit: cover; + width: 80%; + height: auto; + aspect-ratio: 9 / 6; +} + +.fedi_textWithIcon { + display: flex; + gap: 6px; + align-items: center; +} + +.fedi_statusReblogged { + font-size: smaller; + color: var(--color-green); +} + +.fedi_content { + margin-left: var(--content-offset); +} + +.fedi_content a { + word-break: break-word; +} + +.fedi_content p { + font-size: inherit; +} + +.fedi_meta { + display: flex; + gap: 20px; +} + +.fedi_statusContent { + flex: 1; +} + +.fedi_statusInfo { + min-height: calc(var(--avatar-size) + 20px); +} + +@media (min-width: 600px) { + .fedi { + --avatar-size: 100px; + } + + .fedi_statusMediaImg { + width: 200px; + } + + .fedi_statusReblogged { + float: right; + } + + .fedi_content { + margin-left: 0px; + } + + .fedi_statusMedia { + margin-left: 0px; + } + + .fedi_statusInfo { + min-height: auto; + } +} + +/* AOC22 */ + +.aoc22-crate { + width: 30px; + height: 30px; + border: black solid 1px; + background: #bd8a59; + font-weight: bolder; + text-align: center; + display: block; +} + +.aoc22-indicator { + width: 30px; + height: 30px; + border: transparent solid 2px; + background: #eee; + text-align: center; +} + +.aoc22-stack { + display: flex; + gap: 4px; + flex-direction: column; + justify-content: flex-start; + align-items: center; +} + +.aoc22-floating .aoc22-stack { + justify-content: flex-end; +} + +.aoc22-crate:first-child { + border: black solid 2px; + background: #ffa24b; + display: block; +} + +.aoc22-stacks { + display: flex; + gap: 4px; + flex-direction: row; +} + +/* Marketdata */ + +.marketdata { + display: flex; + flex-direction: row; + gap: 10px; + flex-wrap: no-wrap; + overflow: auto; + height: 500px; + margin: 40px auto; + max-width: 900px; + border: solid var(--color-secondary) 2px; + border-radius: 4px; + padding: 10px; +} + +.marketdata-bar { + background: var(--color-primary); + width: 30px; + position: absolute; + bottom: 0; +} + +.marketdata-date { + position: absolute; + transform-origin: bottom left; + transform: rotate(30deg); + bottom: -30px; + left: 0; + white-space: nowrap; +} + +.marketdata-price { + position: absolute; + transform-origin: bottom left; + transform: rotate(-90deg); + bottom: 10px; + left: 28px; + font-family: monospace; +} + +.marketdata-entry { + height: 400px; + width: 30px; + background: var(--color-secondary); + position: relative; + flex-shrink: 0; +} + +.marketdata-entry-past { + opacity: 0.4; +} diff --git a/app/layout.js b/app/layout.js new file mode 100644 index 0000000..66b886a --- /dev/null +++ b/app/layout.js @@ -0,0 +1,28 @@ +import './global.css' + +import Layout from '../components/Layout.bs' +import { body, title } from '../components/fonts' +import DarkModeManager from '../components/dark-mode-manager' + +export default function MainLayout({ + children, +}) { + return ( + + + + + + + + {children} + + + + ) +} diff --git a/app/page.mdx b/app/page.mdx new file mode 100644 index 0000000..e4800d3 --- /dev/null +++ b/app/page.mdx @@ -0,0 +1,20 @@ +Dear reader, + +Often i've had to hunt for little tricks I would use for certain tasks, +and sometimes those little tricks would include multiple steps. Other +times I invented my own little tricks. But often I would also lose those +little tricks. Thats why I’ve decided to start a blog. A place where I +can store those little tricks, and also share them with the world. But I +hope this will also be a place where I can share more that just a few +little tricks. + +This website will also be a platform for me to test out new technologies, +learn new languages and learn new ways to optimise it's speed, accesibility +and look. + +I hope find something interesting on this website, and maybe even learn +something. + +Yours faithfully + +Corné Dorrestijn diff --git a/components/DarkModeSwitcher.res b/components/DarkModeSwitcher.res index dd04e46..6ab1880 100644 --- a/components/DarkModeSwitcher.res +++ b/components/DarkModeSwitcher.res @@ -1,3 +1,5 @@ +@@directive("'use client';") + @val external localStorageSetItem: (string, string) => unit = "localStorage.setItem" @val external getLightOrDarkMode: unit => string = "global.getLightOrDarkMode" @val external updateDarkModeProperties: unit => unit = "global.updateDarkModeProperties" @@ -19,7 +21,10 @@ let handleLightSwitchClick = _ => { @react.component let make = () => { } diff --git a/components/Footer.res b/components/Footer.res index 519b3da..8cf9d3f 100644 --- a/components/Footer.res +++ b/components/Footer.res @@ -1,33 +1,11 @@ -type shareData = { - url: option, - title: option, -} - -type shareFn = shareData => unit -@val @scope("navigator") external share: option = "share" - @react.component let make = (~title) => { - let router = Next.Router.useRouter() - - let handleClick = _ => { - switch share { - | Some(_) => - let share = %raw("data => navigator.share(data).catch(() => {})") - share({ - url: Some(router.asPath), - title, - }) - | _ => Js.log("No shareing") - } - } - } diff --git a/components/FooterShare.res b/components/FooterShare.res new file mode 100644 index 0000000..fb5d4b6 --- /dev/null +++ b/components/FooterShare.res @@ -0,0 +1,31 @@ +@@directive("'use client';") + +type shareData = { + url: option, + title: option, +} + +type shareFn = shareData => unit +@val @scope("navigator") external share: option = "share" + +@react.component +let make = (~title) => { + // let router = Next.Router.useRouter() + let path = Next.Navigation.usePathname() + + let handleClick = _ => { + switch share { + | Some(_) => + let share = %raw("data => navigator.share(data).catch(() => {})") + share({ + // url: Some(router.asPath), + // TODO: fix this + url: Some(path), + title, + }) + | _ => Js.log("No shareing") + } + } + + {React.string("Share")} +} diff --git a/components/Layout.res b/components/Layout.res index df478d9..9926ea1 100644 --- a/components/Layout.res +++ b/components/Layout.res @@ -1,6 +1,5 @@ @react.component let make = (~children, ~title) => { - let (menuOpen, setMenuOpen) = React.useState(_ => false) // let router = Next.Router.useRouter()
@@ -12,18 +11,13 @@ let make = (~children, ~title) => { {React.string(j`Corné Dorrestijn`)} - - +
diff --git a/components/LayoutMenu.res b/components/LayoutMenu.res new file mode 100644 index 0000000..f8cec53 --- /dev/null +++ b/components/LayoutMenu.res @@ -0,0 +1,15 @@ +@@directive("'use client';") + +@react.component +let make = (~children) => { + let (menuOpen, setMenuOpen) = React.useState(_ => false) + + <> + + + +} diff --git a/components/MarketData.res b/components/MarketData.res new file mode 100644 index 0000000..c6120dd --- /dev/null +++ b/components/MarketData.res @@ -0,0 +1,22 @@ +let parseMarketData = json => { + open JsonCombinators.Json.Decode + + let price = object(field => + { + "price": field.required(. "price", JsonCombinators.Json.Decode.float), + "readingDate": field.required(. "readingDate", string), + } + ) + + let marketData = object(field => + { + "prices": field.required(. "Prices", array(price)), + "intervalType": field.required(. "intervalType", int), + "average": field.required(. "average", JsonCombinators.Json.Decode.float), + "fromDate": field.required(. "fromDate", string), + "tillDate": field.required(. "tillDate", string), + } + ) + + json->JsonCombinators.Json.decode(marketData) +} diff --git a/components/fonts.tsx b/components/fonts.tsx new file mode 100644 index 0000000..8defac2 --- /dev/null +++ b/components/fonts.tsx @@ -0,0 +1,11 @@ +import { Balsamiq_Sans, Pacifico } from 'next/font/google' + +export const title = Pacifico({ + weight: '400', + subsets: ['latin'], +}) + +export const body = Balsamiq_Sans({ + weight: ['400', '700'], + subsets: ['latin'], +}) diff --git a/mdx-components.js b/mdx-components.js new file mode 100644 index 0000000..64b6805 --- /dev/null +++ b/mdx-components.js @@ -0,0 +1,9 @@ +// This file is required to use @next/mdx in the `app` directory. +export function useMDXComponents(components) { + return components + // Allows customizing built-in components, e.g. to add styling. + // return { + // h1: ({ children }) =>

{children}

, + // ...components, + // } +} diff --git a/next-env.d.ts b/next-env.d.ts index 4f11a03..fd36f94 100644 --- a/next-env.d.ts +++ b/next-env.d.ts @@ -1,5 +1,6 @@ /// /// +/// // NOTE: This file should not be edited // see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/next.config.mjs b/next.config.mjs index a731122..d732ffa 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -14,18 +14,19 @@ import nextMdx from '@next/mdx' const transpileModules = ["rescript", 'refractor'].concat(bsconfig["bs-dependencies"]); -const withTM = nextTranspileModules(transpileModules) +// const withTM = nextTranspileModules(transpileModules) const withMDX = nextMdx({ extension: /\.mdx?$/, options: { remarkPlugins: [remarkFrontmatter], rehypePlugins: [], - providerImportSource: "@mdx-js/react", + // providerImportSource: "@mdx-js/react", }, }) -export default withTM(withSourceMaps(withMDX({ +export default withSourceMaps(withMDX({ + transpilePackages: transpileModules, pageExtensions: ['jsx', 'js', 'bs.js', 'ts', 'tsx', 'md', 'mdx'], -}))); +})); diff --git a/package-lock.json b/package-lock.json index 5089119..188303c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,9 +11,9 @@ "@glennsl/rescript-fetch": "^0.1.4", "@glennsl/rescript-json-combinators": "^1.0.0", "@loadable/component": "^5.15.2", - "@mdx-js/loader": "^2.2.1", - "@mdx-js/react": "^2.2.1", - "@next/mdx": "^13.1.1", + "@mdx-js/loader": "^2.3.0", + "@mdx-js/react": "^2.3.0", + "@next/mdx": "^13.4.1", "@opendevtools/rescript-intl": "^4.0.0", "@rescript/react": "^0.11.0", "@ryyppy/rescript-promise": "^2.1.0", @@ -27,7 +27,7 @@ "react-refractor": "^2.1.7", "refractor": "^4.8.0", "remark-frontmatter": "^4.0.1", - "rescript": "^10.0.1", + "rescript": "^10.1.4", "rescript-next": "^12.0.1" }, "devDependencies": { @@ -40,7 +40,7 @@ "concurrently": "^7.6.0", "gentype": "^4.5.0", "next-transpile-modules": "^10.0.0", - "typescript": "^5.0.4" + "typescript": "^4.9.3" } }, "node_modules/@babel/runtime": { @@ -148,9 +148,9 @@ } }, "node_modules/@mdx-js/loader": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@mdx-js/loader/-/loader-2.2.1.tgz", - "integrity": "sha512-J4E8A5H+xtk4otZiEZ5AXl61Tj04Avm5MqLQazITdI3+puVXVnTTuZUKM1oNHTtfDIfOl0uMt+o/Ij+x6Fvf+g==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@mdx-js/loader/-/loader-2.3.0.tgz", + "integrity": "sha512-IqsscXh7Q3Rzb+f5DXYk0HU71PK+WuFsEhf+mSV3fOhpLcEpgsHvTQ2h0T6TlZ5gHOaBeFjkXwB52by7ypMyNg==", "dependencies": { "@mdx-js/mdx": "^2.0.0", "source-map": "^0.7.0" @@ -193,9 +193,9 @@ } }, "node_modules/@mdx-js/react": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.2.1.tgz", - "integrity": "sha512-YdXcMcEnqZhzql98RNrqYo9cEhTTesBiCclEtoiQUbJwx87q9453GTapYU6kJ8ZZ2ek1Vp25SiAXEFy5O/eAPw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.3.0.tgz", + "integrity": "sha512-zQH//gdOmuu7nt2oJR29vFhDv88oGPmVw6BggmrHeMI+xgEkp1B2dX9/bMBSYtK0dyLX/aOmesKS09g222K1/g==", "dependencies": { "@types/mdx": "^2.0.0", "@types/react": ">=16" @@ -214,15 +214,23 @@ "integrity": "sha512-eD6WCBMFjLFooLM19SIhSkWBHtaFrZFfg2Cxnyl3vS3DAdFRfnx5TY2RxlkuKXdIRCC0ySbtK9JXXt8qLCqzZg==" }, "node_modules/@next/mdx": { - "version": "13.1.1", - "resolved": "https://registry.npmjs.org/@next/mdx/-/mdx-13.1.1.tgz", - "integrity": "sha512-a588olt++s7vcuhlgrNOBpZUqlbr9vr94NjA3ixM9AgL8fnwJ/GgxEMsrcsp2gPw91lzBlumBfjK6Lc3k3m23Q==", + "version": "13.4.1", + "resolved": "https://registry.npmjs.org/@next/mdx/-/mdx-13.4.1.tgz", + "integrity": "sha512-jYhj/23/zamwgaZhYHnLc6B6lM/YnTkW5g/L6AClkZ3/o/Kups0Jq5TdYRXQ85vpaGYCNTnLr4kxdtCNWxuYzA==", "dependencies": { "source-map": "^0.7.0" }, "peerDependencies": { "@mdx-js/loader": ">=0.15.0", - "@mdx-js/react": "*" + "@mdx-js/react": ">=0.15.0" + }, + "peerDependenciesMeta": { + "@mdx-js/loader": { + "optional": true + }, + "@mdx-js/react": { + "optional": true + } } }, "node_modules/@next/swc-darwin-arm64": { @@ -3225,11 +3233,10 @@ } }, "node_modules/rescript": { - "version": "10.0.1", - "resolved": "https://registry.npmjs.org/rescript/-/rescript-10.0.1.tgz", - "integrity": "sha512-XwO1GPDtoEU4H03xQE5bp0/qtSVR6YLaJRPxWKrfFgKc+LI36ODOCie7o9UJfgzQdoMYkkZyiTGZ4N9OQEaiUw==", + "version": "10.1.4", + "resolved": "https://registry.npmjs.org/rescript/-/rescript-10.1.4.tgz", + "integrity": "sha512-FFKlS9AG/XrLepWsyw7B+A9DtQBPWEPDPDKghV831Y2KGbie+eeFBOS0xtRHp0xbt7S0N2Dm6hhX+kTZQ/3Ybg==", "hasInstallScript": true, - "license": "SEE LICENSE IN LICENSE", "bin": { "bsc": "bsc", "bsrefmt": "bsrefmt", @@ -3600,16 +3607,16 @@ "license": "0BSD" }, "node_modules/typescript": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz", - "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==", + "version": "4.9.5", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", + "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", "dev": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" }, "engines": { - "node": ">=12.20" + "node": ">=4.2.0" } }, "node_modules/unified": { @@ -4125,9 +4132,9 @@ } }, "@mdx-js/loader": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@mdx-js/loader/-/loader-2.2.1.tgz", - "integrity": "sha512-J4E8A5H+xtk4otZiEZ5AXl61Tj04Avm5MqLQazITdI3+puVXVnTTuZUKM1oNHTtfDIfOl0uMt+o/Ij+x6Fvf+g==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@mdx-js/loader/-/loader-2.3.0.tgz", + "integrity": "sha512-IqsscXh7Q3Rzb+f5DXYk0HU71PK+WuFsEhf+mSV3fOhpLcEpgsHvTQ2h0T6TlZ5gHOaBeFjkXwB52by7ypMyNg==", "requires": { "@mdx-js/mdx": "^2.0.0", "source-map": "^0.7.0" @@ -4158,9 +4165,9 @@ } }, "@mdx-js/react": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.2.1.tgz", - "integrity": "sha512-YdXcMcEnqZhzql98RNrqYo9cEhTTesBiCclEtoiQUbJwx87q9453GTapYU6kJ8ZZ2ek1Vp25SiAXEFy5O/eAPw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.3.0.tgz", + "integrity": "sha512-zQH//gdOmuu7nt2oJR29vFhDv88oGPmVw6BggmrHeMI+xgEkp1B2dX9/bMBSYtK0dyLX/aOmesKS09g222K1/g==", "requires": { "@types/mdx": "^2.0.0", "@types/react": ">=16" @@ -4172,9 +4179,9 @@ "integrity": "sha512-eD6WCBMFjLFooLM19SIhSkWBHtaFrZFfg2Cxnyl3vS3DAdFRfnx5TY2RxlkuKXdIRCC0ySbtK9JXXt8qLCqzZg==" }, "@next/mdx": { - "version": "13.1.1", - "resolved": "https://registry.npmjs.org/@next/mdx/-/mdx-13.1.1.tgz", - "integrity": "sha512-a588olt++s7vcuhlgrNOBpZUqlbr9vr94NjA3ixM9AgL8fnwJ/GgxEMsrcsp2gPw91lzBlumBfjK6Lc3k3m23Q==", + "version": "13.4.1", + "resolved": "https://registry.npmjs.org/@next/mdx/-/mdx-13.4.1.tgz", + "integrity": "sha512-jYhj/23/zamwgaZhYHnLc6B6lM/YnTkW5g/L6AClkZ3/o/Kups0Jq5TdYRXQ85vpaGYCNTnLr4kxdtCNWxuYzA==", "requires": { "source-map": "^0.7.0" } @@ -6150,9 +6157,9 @@ "dev": true }, "rescript": { - "version": "10.0.1", - "resolved": "https://registry.npmjs.org/rescript/-/rescript-10.0.1.tgz", - "integrity": "sha512-XwO1GPDtoEU4H03xQE5bp0/qtSVR6YLaJRPxWKrfFgKc+LI36ODOCie7o9UJfgzQdoMYkkZyiTGZ4N9OQEaiUw==" + "version": "10.1.4", + "resolved": "https://registry.npmjs.org/rescript/-/rescript-10.1.4.tgz", + "integrity": "sha512-FFKlS9AG/XrLepWsyw7B+A9DtQBPWEPDPDKghV831Y2KGbie+eeFBOS0xtRHp0xbt7S0N2Dm6hhX+kTZQ/3Ybg==" }, "rescript-next": { "version": "12.0.1", @@ -6380,9 +6387,9 @@ "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==" }, "typescript": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz", - "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==", + "version": "4.9.5", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", + "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", "dev": true }, "unified": { diff --git a/package.json b/package.json index 426f931..cca1384 100644 --- a/package.json +++ b/package.json @@ -13,9 +13,9 @@ "@glennsl/rescript-fetch": "^0.1.4", "@glennsl/rescript-json-combinators": "^1.0.0", "@loadable/component": "^5.15.2", - "@mdx-js/loader": "^2.2.1", - "@mdx-js/react": "^2.2.1", - "@next/mdx": "^13.1.1", + "@mdx-js/loader": "^2.3.0", + "@mdx-js/react": "^2.3.0", + "@next/mdx": "^13.4.1", "@opendevtools/rescript-intl": "^4.0.0", "@rescript/react": "^0.11.0", "@ryyppy/rescript-promise": "^2.1.0", @@ -29,7 +29,7 @@ "react-refractor": "^2.1.7", "refractor": "^4.8.0", "remark-frontmatter": "^4.0.1", - "rescript": "^10.0.1", + "rescript": "^10.1.4", "rescript-next": "^12.0.1" }, "devDependencies": { @@ -47,4 +47,4 @@ "resolutions": { "@types/react": "^18.0.14" } -} +} \ No newline at end of file diff --git a/pages/_document.tsx b/pages/_document.tsx index 312c59d..aea36d4 100644 --- a/pages/_document.tsx +++ b/pages/_document.tsx @@ -1,5 +1,8 @@ import Document, { Head, Html, Main, NextScript } from 'next/document' import Script from 'next/script' +import { body, title } from '../components/fonts' +import { CSSProperties } from 'react' +import DarkModeManager from '../components/dark-mode-manager' export default class MyDocument extends Document { render() { diff --git a/pages/index.mdx b/pages/index.mdx.old similarity index 100% rename from pages/index.mdx rename to pages/index.mdx.old diff --git a/pages/marketdata.res b/pages/marketdata.res index 1f4f61b..cdbd9d6 100644 --- a/pages/marketdata.res +++ b/pages/marketdata.res @@ -69,29 +69,6 @@ let make = (~marketData: Js.Nullable.t, ~incorrectJson) => { let default = make -let parseMarketData = json => { - open JsonCombinators.Json.Decode - - let price = object(field => - { - "price": field.required(. "price", JsonCombinators.Json.Decode.float), - "readingDate": field.required(. "readingDate", string), - } - ) - - let marketData = object(field => - { - "prices": field.required(. "Prices", array(price)), - "intervalType": field.required(. "intervalType", int), - "average": field.required(. "average", JsonCombinators.Json.Decode.float), - "fromDate": field.required(. "fromDate", string), - "tillDate": field.required(. "tillDate", string), - } - ) - - json->JsonCombinators.Json.decode(marketData) -} - let getServerSideProps = () => { open Fetch @@ -142,7 +119,7 @@ let getServerSideProps = () => { ->Promise.then(Response.json) ->Promise.then(d => { Promise.resolve( - switch parseMarketData(d) { + switch MarketData.parseMarketData(d) { | Ok(d) => { "props": { "marketData": Js.Nullable.return(d), diff --git a/tsconfig.json b/tsconfig.json index a67aeb2..b2a7a89 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -17,7 +17,12 @@ "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", - "incremental": true + "incremental": true, + "plugins": [ + { + "name": "next" + } + ] }, "exclude": [ "node_modules" @@ -25,6 +30,7 @@ "include": [ "next-env.d.ts", "**/*.ts", - "**/*.tsx" + "**/*.tsx", + ".next/types/**/*.ts" ] }