From 26a9639589536a4b82efdbe0ffce11bad6836b3a Mon Sep 17 00:00:00 2001 From: Max Leiter Date: Tue, 22 Mar 2022 21:37:27 -0700 Subject: [PATCH] client: nprogress --- client/components/edit-document/index.tsx | 3 +-- client/package.json | 4 ++++ client/pages/_app.tsx | 17 ++++++++++++++ client/styles/markdown.css | 6 ++++- client/yarn.lock | 27 +++++++++++++++++++++++ 5 files changed, 54 insertions(+), 3 deletions(-) diff --git a/client/components/edit-document/index.tsx b/client/components/edit-document/index.tsx index 222a8730..4d6ab562 100644 --- a/client/components/edit-document/index.tsx +++ b/client/components/edit-document/index.tsx @@ -66,7 +66,7 @@ const Document = ({ remove, title, content, setTitle, setContent, initialTab = ' const onTitleChange = useCallback((event: ChangeEvent) => setTitle ? setTitle(event.target.value) : null, [setTitle]) - const removeFile = useCallback((remove?: () => void) => () => { + const removeFile = useCallback((remove?: () => void) => { if (remove) { if (content && content.trim().length > 0) { const confirmed = window.confirm("Are you sure you want to remove this file?") @@ -95,7 +95,6 @@ const Document = ({ remove, title, content, setTitle, setContent, initialTab = ' } - return ( <> diff --git a/client/package.json b/client/package.json index 332b25a7..2c39cfe9 100644 --- a/client/package.json +++ b/client/package.json @@ -18,8 +18,10 @@ "cookie": "^0.4.2", "dotenv": "^16.0.0", "js-cookie": "^3.0.1", + "lodash.debounce": "^4.0.8", "marked": "^4.0.12", "next": "^12.1.1-canary.15", + "nprogress": "^0.2.0", "prism-react-renderer": "^1.3.1", "react": "17.0.2", "react-dom": "17.0.2", @@ -35,8 +37,10 @@ }, "devDependencies": { "@next/bundle-analyzer": "^12.1.0", + "@types/lodash.debounce": "^4.0.6", "@types/marked": "^4.0.3", "@types/node": "17.0.21", + "@types/nprogress": "^0.2.0", "@types/react": "17.0.39", "@types/react-dom": "^17.0.14", "@types/react-syntax-highlighter": "^13.5.2", diff --git a/client/pages/_app.tsx b/client/pages/_app.tsx index 2a11ca68..ebbb9535 100644 --- a/client/pages/_app.tsx +++ b/client/pages/_app.tsx @@ -7,6 +7,23 @@ import Head from 'next/head'; import useTheme from '@lib/hooks/use-theme'; import { CssBaseline, GeistProvider } from '@geist-ui/core'; +import nprogress from 'nprogress' +import debounce from 'lodash.debounce' +import Router from 'next/router'; + +// Only show nprogress after 500ms (slow loading) +const start = debounce(nprogress.start, 500) +Router.events.on('routeChangeStart', start) +Router.events.on('routeChangeComplete', () => { + start.cancel() + nprogress.done() + window.scrollTo(0, 0) +}) +Router.events.on('routeChangeError', () => { + start.cancel() + nprogress.done() +}) + type AppProps

= { pageProps: P; } & Omit, "pageProps">; diff --git a/client/styles/markdown.css b/client/styles/markdown.css index dc4fdabc..ec6c58a6 100644 --- a/client/styles/markdown.css +++ b/client/styles/markdown.css @@ -100,6 +100,11 @@ article *:not(pre) > code { font-size: 1rem; } +article li > p { + font-family: var(--font-mono); + display: inline-block; +} + article pre { overflow-x: auto; background: var(--lightest-gray); @@ -120,7 +125,6 @@ article pre { opacity: 0; content: "#"; margin-left: var(--gap-half); - color: var(--gray); } .header-link:hover::after { diff --git a/client/yarn.lock b/client/yarn.lock index 69809e3a..b69056c8 100644 --- a/client/yarn.lock +++ b/client/yarn.lock @@ -197,6 +197,18 @@ resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee" integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4= +"@types/lodash.debounce@^4.0.6": + version "4.0.6" + resolved "https://registry.yarnpkg.com/@types/lodash.debounce/-/lodash.debounce-4.0.6.tgz#c5a2326cd3efc46566c47e4c0aa248dc0ee57d60" + integrity sha512-4WTmnnhCfDvvuLMaF3KV4Qfki93KebocUF45msxhYyjMttZDQYzHkO639ohhk8+oco2cluAFL3t5+Jn4mleylQ== + dependencies: + "@types/lodash" "*" + +"@types/lodash@*": + version "4.14.180" + resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.180.tgz#4ab7c9ddfc92ec4a887886483bc14c79fb380670" + integrity sha512-XOKXa1KIxtNXgASAnwj7cnttJxS4fksBRywK/9LzRV5YxrF80BXZIGeQSuoESQ/VkUj30Ae0+YcuHc15wJCB2g== + "@types/marked@^4.0.3": version "4.0.3" resolved "https://registry.yarnpkg.com/@types/marked/-/marked-4.0.3.tgz#2098f4a77adaba9ce881c9e0b6baf29116e5acc4" @@ -224,6 +236,11 @@ resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.21.tgz#864b987c0c68d07b4345845c3e63b75edd143644" integrity sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ== +"@types/nprogress@^0.2.0": + version "0.2.0" + resolved "https://registry.yarnpkg.com/@types/nprogress/-/nprogress-0.2.0.tgz#86c593682d4199212a0509cc3c4d562bbbd6e45f" + integrity sha512-1cYJrqq9GezNFPsWTZpFut/d4CjpZqA0vhqDUPFWYKF1oIyBz5qnoYMzR+0C/T96t3ebLAC1SSnwrVOm5/j74A== + "@types/parse5@^6.0.0": version "6.0.3" resolved "https://registry.yarnpkg.com/@types/parse5/-/parse5-6.0.3.tgz#705bb349e789efa06f43f128cef51240753424cb" @@ -1759,6 +1776,11 @@ lodash.camelcase@^4.3.0: resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6" integrity sha1-soqmKIorn8ZRA1x3EfZathkDMaY= +lodash.debounce@^4.0.8: + version "4.0.8" + resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af" + integrity sha1-gteb/zCmfEAF/9XiUVMArZyk168= + lodash.merge@^4.6.2: version "4.6.2" resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a" @@ -2325,6 +2347,11 @@ normalize-path@^3.0.0, normalize-path@~3.0.0: resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65" integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA== +nprogress@^0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/nprogress/-/nprogress-0.2.0.tgz#cb8f34c53213d895723fcbab907e9422adbcafb1" + integrity sha1-y480xTIT2JVyP8urkH6UIq28r7E= + object-assign@^4.0.1, object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"