Modernization

[gauravmm]

The original project is great!

It relies on a lot of outdated dependencies, though. I've gone through the codebase and bumped dependencies, gotten rid of old code, and implemented a unified way to set the icons on the right bar and the bottom bar.

The key dependency react-notion-x is not altered here. I'm also working on that, but have hit some sort of a roadblock with some dependency.

[vercel]

@gauravmm is attempting to deploy a commit to the Saasify Team on Vercel.

A member of the Team first needs to authorize it.

[socket-security]

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package	New capabilities	Transitives	Size	Publisher
npm/@keyvhq/core@2.1.1	None	+1	12.7 kB	kikobeats
npm/@keyvhq/redis@2.1.4	Transitive: environment, network	+11	924 kB	kikobeats
npm/@next/bundle-analyzer@14.2.5	Transitive: environment, filesystem, network, shell	+17	2.3 MB	vercel-release-bot
npm/@trivago/prettier-plugin-sort-imports@4.3.0	Transitive: environment	+37	9.76 MB	behraang
npm/@types/node@20.14.12	None	+1	2.16 MB	types
npm/@types/react@18.3.3	None	+2	1.69 MB	types
npm/@vercel/og@0.6.2	environment, filesystem, network	+21	16.8 MB	vercel-release-bot
npm/classnames@2.5.1	None	0	23.6 kB	jedwatson
npm/date-fns@3.6.0	None	0	22.2 MB	kossnocorp
npm/eslint-config-prettier@9.1.0	None	0	20.8 kB	lydell
npm/eslint@9.7.0	environment Transitive: eval, filesystem, shell, unsafe	+86	9.87 MB	eslintbot
npm/fathom-client@3.7.2	None	0	26 kB	derrickreimer
npm/got@14.4.2	Transitive: network	+24	1.15 MB	sindresorhus
npm/isomorphic-unfetch@4.0.2	Transitive: network	+7	9.27 MB	developit
npm/lqip-modern@2.1.0	Transitive: environment, eval, filesystem, shell	+35	181 MB	fisch0920
npm/next@14.2.5	environment, filesystem, network, shell, unsafe	+23	1.2 GB	vercel-release-bot
npm/notion-client@6.16.0	Transitive: filesystem, network	+33	739 kB	fisch0920
npm/notion-types@6.16.0	None	0	77.4 kB	fisch0920
npm/notion-utils@6.16.0	None	+9	313 kB	fisch0920
npm/p-map@7.0.2	None	0	21 kB	sindresorhus
npm/p-memoize@7.1.1	None	+2	298 kB	sindresorhus
npm/posthog-js@1.150.0	None	+3	9.82 MB	timgl
npm/prettier@3.3.3	environment, filesystem, unsafe	0	7.7 MB	prettier-bot
npm/react-dom@18.3.1	environment	+3	4.63 MB	react-bot
npm/react-icons@5.2.1	None	0	85 MB	kamijin_fanta
npm/react-notion-x@6.16.0	eval Transitive: environment, filesystem, network, shell, unsafe	+111	61.2 MB	fisch0920
npm/react-use@17.5.1	environment	+34	8.2 MB	streamich
npm/react@18.3.1	environment	+2	339 kB	react-bot
npm/typescript@5.5.4	None	0	21.9 MB	typescript-bot

🚮 Removed packages: npm/@babel/code-frame@7.18.6, npm/@babel/compat-data@7.19.4, npm/@babel/core@7.17.8, npm/@babel/generator@7.19.5, npm/@babel/helper-compilation-targets@7.19.3, npm/@babel/helper-environment-visitor@7.18.9, npm/@babel/helper-function-name@7.19.0, npm/@babel/helper-hoist-variables@7.18.6, npm/@babel/helper-module-imports@7.18.6, npm/@babel/helper-module-transforms@7.19.0, npm/@babel/helper-simple-access@7.19.4, npm/@babel/helper-split-export-declaration@7.18.6, npm/@babel/helper-string-parser@7.19.4, npm/@babel/helper-validator-identifier@7.19.1, npm/@babel/helper-validator-option@7.18.6, npm/@babel/helpers@7.19.4, npm/@babel/highlight@7.18.6, npm/@babel/parser@7.19.4, npm/@babel/runtime@7.18.9, npm/@babel/template@7.18.10, npm/@babel/traverse@7.19.4, npm/@babel/types@7.19.4, npm/@eslint/eslintrc@1.3.3, npm/@fisch0920/use-dark-mode@2.4.0, npm/@humanwhocodes/config-array@0.10.7, npm/@humanwhocodes/object-schema@1.2.1, npm/@ioredis/commands@1.1.1, npm/@jridgewell/gen-mapping@0.3.2, npm/@jridgewell/resolve-uri@3.1.0, npm/@jridgewell/set-array@1.1.2, npm/@jridgewell/sourcemap-codec@1.4.14, npm/@jridgewell/trace-mapping@0.3.17, npm/@keyvhq/core@1.6.9, npm/@keyvhq/redis@1.6.10, npm/@next/bundle-analyzer@12.3.1, npm/@next/env@12.3.4, npm/@next/swc-android-arm-eabi@12.3.4, npm/@next/swc-android-arm64@12.3.4, npm/@next/swc-darwin-arm64@12.3.4, npm/@next/swc-darwin-x64@12.3.4, npm/@next/swc-freebsd-x64@12.3.4, npm/@next/swc-linux-arm-gnueabihf@12.3.4, npm/@next/swc-linux-arm64-gnu@12.3.4, npm/@next/swc-linux-arm64-musl@12.3.4, npm/@next/swc-linux-x64-gnu@12.3.4, npm/@next/swc-linux-x64-musl@12.3.4, npm/@next/swc-win32-arm64-msvc@12.3.4, npm/@next/swc-win32-ia32-msvc@12.3.4, npm/@next/swc-win32-x64-msvc@12.3.4, npm/@polka/url@1.0.0-next.21, npm/@react-icons/all-files@4.1.0, npm/@resvg/resvg-wasm@2.0.0-alpha.4, npm/@sentry/types@7.22.0, npm/@swc/helpers@0.4.11, npm/@trivago/prettier-plugin-sort-imports@3.3.1, npm/@types/cacheable-request@6.0.2, npm/@types/http-cache-semantics@4.0.1, npm/@types/json-buffer@3.0.0, npm/@types/json-schema@7.0.11, npm/@types/node@18.8.5, npm/@types/prop-types@15.7.5, npm/@types/react@18.0.21, npm/@types/responselike@1.0.0, npm/@types/scheduler@0.16.2, npm/@types/yoga-layout@1.9.2, npm/@typescript-eslint/eslint-plugin@5.40.0, npm/@typescript-eslint/parser@5.40.0, npm/@typescript-eslint/scope-manager@5.40.0, npm/@typescript-eslint/type-utils@5.40.0, npm/@typescript-eslint/types@5.40.0, npm/@typescript-eslint/typescript-estree@5.40.0, npm/@typescript-eslint/utils@5.40.0, npm/@typescript-eslint/visitor-keys@5.40.0, npm/@use-it/event-listener@0.1.7, npm/@vercel/og@0.0.19, npm/acorn-walk@8.2.0, npm/acorn@8.8.0, npm/array-includes@3.1.5, npm/array-union@2.1.0, npm/array.prototype.flatmap@1.3.0, npm/base64-js@1.5.1, npm/bl@4.1.0, npm/braces@3.0.2, npm/browserslist@4.21.4, npm/buffer@5.7.1, npm/cacheable-lookup@6.0.4, npm/cacheable-request@7.0.2, npm/call-bind@1.0.2, npm/caniuse-lite@1.0.30001419, npm/chownr@1.1.4, npm/classnames@2.3.1, npm/clone-response@1.0.2, npm/cluster-key-slot@1.1.0, npm/compress-brotli@1.3.6, npm/convert-source-map@1.9.0, npm/copy-to-clipboard@3.3.1, npm/css-in-js-utils@2.0.1, npm/css-to-react-native@3.0.0, npm/csstype@3.0.11, npm/date-fns@2.28.0, npm/debug@4.3.4, npm/deep-extend@0.6.0, npm/define-properties@1.1.3, npm/denque@2.0.1, npm/detect-libc@2.0.2, npm/dir-glob@3.0.1, npm/doctrine@3.0.0, npm/electron-to-chromium@1.4.283, npm/error-stack-parser@2.0.7, npm/es-abstract@1.19.2, npm/es-shim-unscopables@1.0.0, npm/escalade@3.1.1, npm/eslint-config-prettier@8.5.0, npm/eslint-plugin-react-hooks@4.6.0, npm/eslint-plugin-react@7.31.10, npm/eslint-utils@3.0.0, npm/eslint-visitor-keys@2.1.0, npm/eslint@8.25.0, npm/espree@9.4.0, npm/esquery@1.4.0, npm/eventemitter3@4.0.7, npm/expand-template@2.0.3, npm/fast-glob@3.2.11, npm/fastq@1.13.0, npm/fathom-client@3.4.1, npm/file-entry-cache@6.0.1, npm/fill-range@7.0.1, npm/flat-cache@3.0.4, npm/flatted@3.2.5, npm/form-data-encoder@1.7.1, npm/fs-constants@1.0.0, npm/fs.realpath@1.0.0, npm/function-bind@1.1.1, npm/function.prototype.name@1.1.5, npm/gensync@1.0.0-beta.2, npm/get-intrinsic@1.1.3, npm/get-symbol-description@1.0.0, npm/github-from-package@0.0.0, npm/glob-parent@5.1.2, npm/glob@7.2.0, npm/globby@11.1.0, npm/got@12.0.3, npm/graceful-fs@4.2.9, npm/grapheme-splitter@1.0.4, npm/has-bigints@1.0.1, npm/has-property-descriptors@1.0.0, npm/has-tostringtag@1.0.0, npm/has@1.0.3, npm/hotkeys-js@3.8.7, npm/http-cache-semantics@4.1.0, npm/http2-wrapper@2.1.10, npm/hyphenate-style-name@1.0.4, npm/ieee754@1.2.1, npm/ignore@5.2.0, npm/inflight@1.0.6, npm/inherits@2.0.4, npm/ini@1.3.8, npm/inline-style-prefixer@6.0.1, npm/internal-slot@1.0.3, npm/ioredis@5.0.3, npm/is-callable@1.2.4, npm/is-core-module@2.8.1, npm/is-negative-zero@2.0.2, npm/is-number-object@1.0.6, npm/is-number@7.0.0, npm/is-shared-array-buffer@1.0.1, npm/isobject@3.0.1, npm/isomorphic-unfetch@3.1.0, npm/js-sdsl@4.1.5, npm/json5@2.2.1, npm/jsx-ast-utils@3.2.1, npm/katex@0.15.3, npm/keyv@4.2.2, npm/loader-utils@2.0.2, npm/lqip-modern@2.0.0, npm/lru-cache@6.0.0, npm/make-cancellable-promise@1.1.0, npm/make-event-props@1.3.0, npm/merge-refs@1.0.0, npm/merge2@1.4.1, npm/micromatch@4.0.5, npm/minimist@1.2.6, npm/mkdirp-classic@0.5.3, npm/mrmime@1.0.0, npm/nano-css@5.3.4, npm/nanoid@3.3.4, npm/napi-build-utils@1.0.2, npm/next@12.3.4, npm/node-abi@3.52.0, npm/node-addon-api@5.1.0, npm/node-fetch@2.6.7, npm/node-releases@2.0.6, npm/notion-client@6.15.6, npm/notion-types@6.15.6, npm/notion-utils@6.15.6, npm/object-inspect@1.12.0, npm/object.assign@4.1.4, npm/object.entries@1.1.5, npm/object.fromentries@2.0.5, npm/object.hasown@1.1.1, npm/object.values@1.1.5, npm/optionator@0.9.1, npm/p-cancelable@3.0.0, npm/p-event@4.2.0, npm/p-finally@1.0.0, npm/p-map@5.3.0, npm/p-memoize@6.0.1, npm/p-queue@7.2.0, npm/p-timeout@3.2.0, npm/path-is-absolute@1.0.1, npm/path-type@4.0.0, npm/picocolors@1.0.0, npm/picomatch@2.3.1, npm/postcss@8.4.14, npm/posthog-js@1.36.1, npm/prebuild-install@7.1.1, npm/prettier@2.7.1, npm/prismjs@1.27.0, npm/punycode@2.1.1, npm/rc@1.2.8, npm/react-dom@18.2.0, npm/react-fast-compare@3.2.0, npm/react-hotkeys-hook@3.4.4, npm/react-image@4.0.3, npm/react-modal@3.14.4, npm/react-notion-x@6.15.6, npm/react-side-effect@2.1.1, npm/react-use@17.4.2, npm/react@18.2.0, npm/readable-stream@3.6.0, npm/regenerator-runtime@0.13.9, npm/regexp.prototype.flags@1.4.3, npm/regexpp@3.2.0, npm/resolve@2.0.0-next.3, npm/responselike@2.0.0, npm/rimraf@3.0.2, npm/rrweb-snapshot@1.1.14, npm/rtl-css-js@1.15.0, npm/safe-buffer@5.1.2, npm/safe-regex-test@1.0.0, npm/satori@0.0.42, npm/scheduler@0.23.0, npm/schema-utils@3.1.1, npm/semver@7.5.4, npm/sharp@0.31.3, npm/shell-quote@1.7.3, npm/side-channel@1.0.4, npm/simple-concat@1.0.1, npm/simple-get@4.0.1, npm/sirv@1.0.19, npm/slash@3.0.0, npm/source-map-js@1.0.2, npm/sourcemap-codec@1.4.8, npm/spdx-correct@3.1.1, npm/spdx-exceptions@2.3.0, npm/spdx-license-ids@3.0.11, npm/stack-generator@2.0.5, npm/stackframe@1.2.1, npm/stacktrace-gps@3.0.4, npm/string.prototype.matchall@4.0.7, npm/string.prototype.padend@3.1.3, npm/string.prototype.trimend@1.0.4, npm/string.prototype.trimstart@1.0.4, npm/string_decoder@1.1.1, npm/strip-json-comments@2.0.1, npm/styled-jsx@5.0.7, npm/stylis@4.0.13, npm/tar-fs@2.1.1, npm/tar-stream@2.2.0, npm/tiny-invariant@1.2.0, npm/to-regex-range@5.0.1, npm/totalist@1.1.0, npm/tr46@0.0.3, npm/tslib@2.4.0, npm/tsutils@3.21.0, npm/tunnel-agent@0.6.0, npm/typescript@4.8.4, npm/unbox-primitive@1.0.1, npm/unfetch@4.2.0, npm/update-browserslist-db@1.0.10, npm/use-persisted-state@0.3.3, npm/use-sync-external-store@1.2.0, npm/util-deprecate@1.0.2, npm/webidl-conversions@3.0.1, npm/webpack-bundle-analyzer@4.3.0, npm/whatwg-url@5.0.0, npm/word-wrap@1.2.3, npm/ws@7.5.7, npm/yallist@4.0.0, npm/yoga-layout-prebuilt@1.10.0, npm/yoga-wasm-web@0.1.2

View full report↗︎

[socket-security]

🚨 Potential security issues detected. Learn more about Socket for GitHub ↗︎

To accept the risk, merge this PR and you will not be notified again.

Alert	Package	Note	Source	CI
Install scripts	npm/sharp@0.33.4	Install script: install Source: node install/check	package-lock.json package.json	🚫

View full report↗︎

Next steps

What is an install script?

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Packages should not be running non-essential scripts during install and there are often solutions to problems people solve with install scripts that can be run at publish time instead.

Take a deeper look at the dependency

Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support [AT] socket [DOT] dev.

Remove the package

If you happen to install a dependency that Socket reports as Known Malware you should immediately remove it and select a different dependency. For other alert types, you may may wish to investigate alternative packages or consider if there are other ways to mitigate the specific risk posed by the dependency.

Mark a package as acceptable risk

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of ecosystem/package-name@version specifiers. e.g. @SocketSecurity ignore npm/foo@1.0.0 or ignore all packages with @SocketSecurity ignore-all

• @SocketSecurity ignore npm/sharp@0.33.4

[onnimonni]

Thanks @gauravmm for this! While we are waiting for @transitive-bullshit to decide how to continue with this starter I created my own fork with updated react-notion-x dependency.

See more here:
onnimonni#2

You can see the forked react-notion-x here: https://github.com/onnimonni/react-notion-x/tree/publish-forked-versions

It works perfectly but few tests are still failing which are written with ts and try to import the internal packages eg `import "notion-utils"' are not working and fail with:

Uncaught exception in src/notion-api-universal.test.ts

  Error [ERR_MODULE_NOT_FOUND]: Cannot find package '@onnimonni/notion-utils' imported from /Users/onnimonni/Projects/react-notion-x/packages/notion-client/src/notion-api.ts

I'm happy to add you as contributor to both of these forks if you want to help out 👍.

[transitive-bullshit]

Fixed in #641