diff --git a/.github/ISSUE_TEMPLATE/doc_request.md b/.github/ISSUE_TEMPLATE/doc_request.md index b80d4b4fc8..3c4423198c 100644 --- a/.github/ISSUE_TEMPLATE/doc_request.md +++ b/.github/ISSUE_TEMPLATE/doc_request.md @@ -1,6 +1,6 @@ --- name: ✍ Documentation request or bug about: Report a content issue (incorrect content, spelling mistake, broken link), request new content, or suggest an improvement. -labels: 'docs' -assignees: '' +labels: "docs" +assignees: "" --- diff --git a/.github/ISSUE_TEMPLATE/website_request.md b/.github/ISSUE_TEMPLATE/website_request.md index 2614313882..5c39dee13d 100644 --- a/.github/ISSUE_TEMPLATE/website_request.md +++ b/.github/ISSUE_TEMPLATE/website_request.md @@ -1,5 +1,5 @@ --- name: ✨ Doc site request or bug about: Request a website feature or improvement, or report a bug. For documentation, please use documentation request. -labels: 'website' +labels: "website" --- diff --git a/.github/ISSUE_TEMPLATE/z_doc_release.md b/.github/ISSUE_TEMPLATE/z_doc_release.md index 8c3bc9a5d3..ccfbbdbacd 100644 --- a/.github/ISSUE_TEMPLATE/z_doc_release.md +++ b/.github/ISSUE_TEMPLATE/z_doc_release.md @@ -1,9 +1,9 @@ --- name: 🎉 Documentation release about: INTERNAL ONLY. Documentation release tasks. -title: 'Release:' -labels: 'docs,docs/task' -assignees: '' +title: "Release:" +labels: "docs,docs/task" +assignees: "" --- ## Release diff --git a/.github/actions/create-or-update-comment/action.yml b/.github/actions/create-or-update-comment/action.yml index d1f982515b..6c1f423127 100644 --- a/.github/actions/create-or-update-comment/action.yml +++ b/.github/actions/create-or-update-comment/action.yml @@ -10,7 +10,7 @@ inputs: body-includes: description: An optional string to search by (use this almost always) required: false - default: 'bot' + default: "bot" runs: using: composite steps: @@ -19,7 +19,7 @@ runs: id: find-existing with: issue-number: ${{ inputs.pull-request }} - comment-author: 'github-actions[bot]' + comment-author: "github-actions[bot]" body-includes: ${{ inputs.body-includes }} - name: Create comment diff --git a/.github/pre-commit b/.github/pre-commit new file mode 100644 index 0000000000..7887628561 --- /dev/null +++ b/.github/pre-commit @@ -0,0 +1,11 @@ +#!/bin/sh +FILES=$(git diff --cached --name-only --diff-filter=ACMR | sed 's| |\\ |g') +[ -z "$FILES" ] && exit 0 + +# Prettify all selected files +echo "$FILES" | xargs ./node_modules/.bin/prettier --ignore-unknown --write + +# Add back the modified/prettified files to staging +echo "$FILES" | xargs git add + +exit 0 diff --git a/.github/workflows/image-optimise.yml b/.github/workflows/image-optimise.yml index 03bde0284c..38daca6e1c 100644 --- a/.github/workflows/image-optimise.yml +++ b/.github/workflows/image-optimise.yml @@ -10,21 +10,21 @@ name: Compress images on: pull_request: paths: - - '**.jpg' - - '**.jpeg' - - '**.png' - - '**.webp' + - "**.jpg" + - "**.jpeg" + - "**.png" + - "**.webp" push: branches: - main paths: - - '**.jpg' - - '**.jpeg' - - '**.png' - - '**.webp' + - "**.jpg" + - "**.jpeg" + - "**.png" + - "**.webp" workflow_dispatch: schedule: - - cron: '00 23 * * 0' + - cron: "00 23 * * 0" jobs: build: name: calibreapp/image-actions diff --git a/.github/workflows/list-changed-pages.yml b/.github/workflows/list-changed-pages.yml index a9e1336d68..0e2a85ee70 100644 --- a/.github/workflows/list-changed-pages.yml +++ b/.github/workflows/list-changed-pages.yml @@ -4,11 +4,11 @@ on: branches: - main paths: - - 'content/**/*' + - "content/**/*" jobs: post-files-changed-comment: - name: 'Post files changed comment' + name: "Post files changed comment" runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 @@ -49,4 +49,4 @@ jobs: with: pull-request: ${{ github.event.pull_request.number }} body: ${{ steps.build-comment-body.outputs.body }} - body-includes: 'original | preview' + body-includes: "original | preview" diff --git a/.github/workflows/lost-pixel.yml b/.github/workflows/lost-pixel.yml index e70a57fa63..d49edf00e0 100644 --- a/.github/workflows/lost-pixel.yml +++ b/.github/workflows/lost-pixel.yml @@ -1,4 +1,4 @@ -name: 'Lost Pixel' +name: "Lost Pixel" on: [push] jobs: diff --git a/.github/workflows/spellcheck.yml b/.github/workflows/spellcheck.yml index 561628baaa..28bcd2766c 100644 --- a/.github/workflows/spellcheck.yml +++ b/.github/workflows/spellcheck.yml @@ -5,15 +5,15 @@ on: branches: - main paths: - - 'content/**/*' + - "content/**/*" pull_request: branches: - main paths: - - 'content/**/*' + - "content/**/*" jobs: spellcheck: - name: 'Docs: Spellcheck' + name: "Docs: Spellcheck" runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 @@ -21,7 +21,7 @@ jobs: - uses: actions/setup-node@v4 name: Setup node with: - node-version: '18' + node-version: "18" - run: npm install -g cspell name: Install cSpell - run: cspell --config ./cSpell.json "content/**/*.mdx" --no-progress diff --git a/.prettierignore b/.prettierignore index be9374d103..2dcbfc2cd2 100644 --- a/.prettierignore +++ b/.prettierignore @@ -2,6 +2,7 @@ node_modules/ public/ .cache/ static/ -out/ -history/ -*.mdx \ No newline at end of file +*.mdx +plugins/ +.husky/ +.docusaurus/ \ No newline at end of file diff --git a/.prettierrc b/.prettierrc index ca02b14427..c517583985 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,8 +1,10 @@ { - "printWidth": 100, - "jsxBracketSameLine": false, - "singleQuote": true, "tabWidth": 2, + "useTabs": false, + "singleQuote": false, "trailingComma": "es5", - "semi": true + "semi": true, + "singleAttributePerLine": false, + "proseWrap": "preserve", + "htmlWhitespaceSensitivity": "css" } diff --git a/README.md b/README.md index ecdf8e3558..aadb161df3 100644 --- a/README.md +++ b/README.md @@ -125,6 +125,23 @@ $ mdtool remove 2 # Result: 01-a, 02-b, 03-c, 04-d becomes 01-a, 02-b, 02-c, 03-d; 02-b is supposed to be manually deleted ``` +### Prettier + +To align with the current standards specified in our `.prettierc` configuration, it's recommended to include the `pre-commit` hook within the `/.github/` directory. This can be achieved by executing the following commands from the project's root: + +```bash +mv /.github/pre-commit /.git/hooks/ +``` + +After that, and upon executing a commit command, you may encounter the following message: + +``` +hint: The '.git/hooks/pre-commit' hook was ignored because it's not set as executable. +hint: You can disable this warning with `git config advice.ignoredHook false`. +``` + +To address this, you can follow the provided instructions to disable the `ignoredHook` flag. + #### Thanks Luca ![](https://res.cloudinary.com/prismaio/image/upload/v1628765536/docs/LJ0FGHk_u2jjxv.png) diff --git a/babel.config.js b/babel.config.js index e00595dae7..bfd75dbdfc 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,3 +1,3 @@ module.exports = { - presets: [require.resolve('@docusaurus/core/lib/babel/preset')], + presets: [require.resolve("@docusaurus/core/lib/babel/preset")], }; diff --git a/content/200-orm/050-overview/_category_.json b/content/200-orm/050-overview/_category_.json index 375c63862c..42c3080f16 100644 --- a/content/200-orm/050-overview/_category_.json +++ b/content/200-orm/050-overview/_category_.json @@ -1,5 +1,5 @@ { - "label": "Overview", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "Overview", + "collapsible": false, + "collapsed": false +} diff --git a/content/200-orm/100-prisma-schema/_category_.json b/content/200-orm/100-prisma-schema/_category_.json index 2cf70ba2bd..9ecbba8efe 100644 --- a/content/200-orm/100-prisma-schema/_category_.json +++ b/content/200-orm/100-prisma-schema/_category_.json @@ -1,5 +1,5 @@ { - "label": "Prisma Schema", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "Prisma Schema", + "collapsible": false, + "collapsed": false +} diff --git a/content/200-orm/200-prisma-client/_category_.json b/content/200-orm/200-prisma-client/_category_.json index 656f03be02..348f143950 100644 --- a/content/200-orm/200-prisma-client/_category_.json +++ b/content/200-orm/200-prisma-client/_category_.json @@ -1,5 +1,5 @@ { - "label": "Prisma Client", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "Prisma Client", + "collapsible": false, + "collapsed": false +} diff --git a/content/200-orm/300-prisma-migrate/_category_.json b/content/200-orm/300-prisma-migrate/_category_.json index fc1ab2e766..5e8a9ff255 100644 --- a/content/200-orm/300-prisma-migrate/_category_.json +++ b/content/200-orm/300-prisma-migrate/_category_.json @@ -1,5 +1,5 @@ { - "label": "Prisma Migrate", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "Prisma Migrate", + "collapsible": false, + "collapsed": false +} diff --git a/content/200-orm/400-tools/_category_.json b/content/200-orm/400-tools/_category_.json index 7453ee16c0..920f640b0f 100644 --- a/content/200-orm/400-tools/_category_.json +++ b/content/200-orm/400-tools/_category_.json @@ -1,5 +1,5 @@ { - "label": "Tools", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "Tools", + "collapsible": false, + "collapsed": false +} diff --git a/content/200-orm/500-reference/_category_.json b/content/200-orm/500-reference/_category_.json index 6a03fc6cc2..de25c25722 100644 --- a/content/200-orm/500-reference/_category_.json +++ b/content/200-orm/500-reference/_category_.json @@ -1,5 +1,5 @@ { - "label": "Reference", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "Reference", + "collapsible": false, + "collapsed": false +} diff --git a/content/200-orm/800-more/_category_.json b/content/200-orm/800-more/_category_.json index a4b01cc2ff..f354ac9996 100644 --- a/content/200-orm/800-more/_category_.json +++ b/content/200-orm/800-more/_category_.json @@ -1,5 +1,5 @@ { - "label": "More", - "collapsible": false, - "collapsed": false -} \ No newline at end of file + "label": "More", + "collapsible": false, + "collapsed": false +} diff --git a/content/400-pulse/250-database-setup/_category_.json b/content/400-pulse/250-database-setup/_category_.json index 47ccf8cefe..258ab00c98 100644 --- a/content/400-pulse/250-database-setup/_category_.json +++ b/content/400-pulse/250-database-setup/_category_.json @@ -1,4 +1,4 @@ { - "collapsed": false, - "collapsible": false -} \ No newline at end of file + "collapsed": false, + "collapsible": false +} diff --git a/content/500-platform/20-concepts/_category_.json b/content/500-platform/20-concepts/_category_.json index 47ccf8cefe..258ab00c98 100644 --- a/content/500-platform/20-concepts/_category_.json +++ b/content/500-platform/20-concepts/_category_.json @@ -1,4 +1,4 @@ { - "collapsed": false, - "collapsible": false -} \ No newline at end of file + "collapsed": false, + "collapsible": false +} diff --git a/content/500-platform/60-platform-cli/_category_.json b/content/500-platform/60-platform-cli/_category_.json index b353f0c5d1..d03b6184e6 100644 --- a/content/500-platform/60-platform-cli/_category_.json +++ b/content/500-platform/60-platform-cli/_category_.json @@ -4,4 +4,4 @@ "customProps": { "badge": "Early Access" } -} \ No newline at end of file +} diff --git a/content/500-platform/_category_.json b/content/500-platform/_category_.json index cf9e804f7d..325bcb0538 100644 --- a/content/500-platform/_category_.json +++ b/content/500-platform/_category_.json @@ -1,5 +1,5 @@ { - "collapsed": false, - "collapsible": false, - "className": "firstTitle" -} \ No newline at end of file + "collapsed": false, + "collapsible": false, + "className": "firstTitle" +} diff --git a/content/600-about/200-prisma-docs/_category_.json b/content/600-about/200-prisma-docs/_category_.json index 5d960195c8..258ab00c98 100644 --- a/content/600-about/200-prisma-docs/_category_.json +++ b/content/600-about/200-prisma-docs/_category_.json @@ -1,4 +1,4 @@ { "collapsed": false, "collapsible": false -} \ No newline at end of file +} diff --git a/docusaurus.config.ts b/docusaurus.config.ts index a32c2f034e..cc127d96e0 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -1,32 +1,32 @@ -import { themes as prismThemes } from 'prism-react-renderer'; -import type { Config } from '@docusaurus/types'; -import type * as Preset from '@docusaurus/preset-classic'; +import { themes as prismThemes } from "prism-react-renderer"; +import type { Config } from "@docusaurus/types"; +import type * as Preset from "@docusaurus/preset-classic"; -const DOCUSAURUS_BASE_URL = process.env.DOCUSAURUS_BASE_URL ?? '/'; +const DOCUSAURUS_BASE_URL = process.env.DOCUSAURUS_BASE_URL ?? "/"; const config: Config = { - title: 'Prisma Documentation', + title: "Prisma Documentation", tagline: "Get started with Prisma in the official documentation, and learn more about all Prisma's features with reference documentation, guides, and more.", - favicon: 'img/favicon.png', + favicon: "img/favicon.png", // Set the production url of your site here - url: 'https://www.prisma.io', + url: "https://www.prisma.io", // Set the // pathname under which your site is served // For GitHub pages deployment, it is often '//' baseUrl: DOCUSAURUS_BASE_URL, trailingSlash: false, - onBrokenLinks: 'throw', - onBrokenAnchors: 'throw', - onBrokenMarkdownLinks: 'throw', + onBrokenLinks: "throw", + onBrokenAnchors: "throw", + onBrokenMarkdownLinks: "throw", // Even if you don't use internationalization, you can use this field to set // useful metadata like html lang. For example, if your site is Chinese, you // may want to replace "en" with "zh-Hans". i18n: { - defaultLocale: 'en', - locales: ['en'], + defaultLocale: "en", + locales: ["en"], }, customFields: { BREVO_API_KEY: process.env.BREVO_API_KEY, @@ -34,233 +34,233 @@ const config: Config = { scripts: [ // kapa.ai script { - src: 'https://widget.kapa.ai/kapa-widget.bundle.js', + src: "https://widget.kapa.ai/kapa-widget.bundle.js", defer: true, - 'data-website-id': '1b51bb03-43cc-4ef4-95f1-93288a91b560', - 'data-project-name': 'Prisma', - 'data-project-color': '#2D3748', - 'data-project-logo': 'https://www.prisma.io/docs/ai_logo.png', - 'data-button-text': 'Ask AI', - 'data-modal-example-questions': + "data-website-id": "1b51bb03-43cc-4ef4-95f1-93288a91b560", + "data-project-name": "Prisma", + "data-project-color": "#2D3748", + "data-project-logo": "https://www.prisma.io/docs/ai_logo.png", + "data-button-text": "Ask AI", + "data-modal-example-questions": "How can I setup relations in my schema file?,What is the difference between the 'migrate dev' and 'db push' commands?,Which cache strategy should I use for my query with Prisma Accelerate?,How can I subscribe to database events with Prisma Pulse?", - 'data-button-image': 'https://www.prisma.io/docs/ai_button.svg', - 'data-button-text-color': '#71E8DF', - 'data-button-bg-color': '#2D3748', - 'data-button-border': '2px', - 'data-button-border-color': '#71e8df', - 'data-button-border-style': 'solid', - 'data-button-box-shadow': - 'drop-shadow(0px 0.724px 1.251px rgba(14, 18, 28, 0.02)) drop-shadow(0px 1.608px 2.909px rgba(14, 18, 28, 0.04)) drop-shadow(0px 2.793px 5.225px rgba(14, 18, 28, 0.06)) drop-shadow(0px 4.55px 8.671px rgba(14, 18, 28, 0.07)) drop-shadow(0px 7.485px 14.285px rgba(14, 18, 28, 0.08)) drop-shadow(0px 13.358px 24.966px rgba(14, 18, 28, 0.09)) drop-shadow(0px 33px 54px rgba(14, 18, 28, 0.07))', + "data-button-image": "https://www.prisma.io/docs/ai_button.svg", + "data-button-text-color": "#71E8DF", + "data-button-bg-color": "#2D3748", + "data-button-border": "2px", + "data-button-border-color": "#71e8df", + "data-button-border-style": "solid", + "data-button-box-shadow": + "drop-shadow(0px 0.724px 1.251px rgba(14, 18, 28, 0.02)) drop-shadow(0px 1.608px 2.909px rgba(14, 18, 28, 0.04)) drop-shadow(0px 2.793px 5.225px rgba(14, 18, 28, 0.06)) drop-shadow(0px 4.55px 8.671px rgba(14, 18, 28, 0.07)) drop-shadow(0px 7.485px 14.285px rgba(14, 18, 28, 0.08)) drop-shadow(0px 13.358px 24.966px rgba(14, 18, 28, 0.09)) drop-shadow(0px 33px 54px rgba(14, 18, 28, 0.07))", }, // Enzuzo Cookies Consent script for prisma.io { - src: 'https://app.enzuzo.com/apps/enzuzo/static/js/__enzuzo-cookiebar.js?uuid=5606ab18-eb9a-11ee-98cc-b303d4429aa8', + src: "https://app.enzuzo.com/apps/enzuzo/static/js/__enzuzo-cookiebar.js?uuid=5606ab18-eb9a-11ee-98cc-b303d4429aa8", }, // Tolt script { - src: 'https://cdn.tolt.io/tolt.js', - 'data-tolt': 'fda67739-7ed0-42d2-b716-6da0edbec191', + src: "https://cdn.tolt.io/tolt.js", + "data-tolt": "fda67739-7ed0-42d2-b716-6da0edbec191", }, ], - plugins: ['docusaurus-plugin-sass'], + plugins: ["docusaurus-plugin-sass"], presets: [ [ - 'classic', + "classic", { gtag: { - trackingID: 'G-YS7QHR40SL', + trackingID: "G-YS7QHR40SL", anonymizeIP: true, }, googleTagManager: { - containerId: 'GTM-KCGZPWB', + containerId: "GTM-KCGZPWB", }, sitemap: { // @ts-ignore - changefreq: 'daily', + changefreq: "daily", priority: 0.7, ignorePatterns: [ - '/search', + "/search", // Remove these from sitemap for SEO purposes as they're redirected - '/getting-started/quickstart', - '/getting-started/setup-prisma/add-to-existing-project', - '/getting-started/setup-prisma/start-from-scratch-prisma-migrate', - '/getting-started/setup-prisma/start-from-scratch-sql', + "/getting-started/quickstart", + "/getting-started/setup-prisma/add-to-existing-project", + "/getting-started/setup-prisma/start-from-scratch-prisma-migrate", + "/getting-started/setup-prisma/start-from-scratch-sql", ], - filename: 'sitemap.xml', + filename: "sitemap.xml", }, docs: { - routeBasePath: '/', - path: 'content', - sidebarPath: './sidebars.ts', + routeBasePath: "/", + path: "content", + sidebarPath: "./sidebars.ts", // Remove this to remove the "edit this page" links. - editUrl: 'https://github.com/prisma/docs/tree/main', + editUrl: "https://github.com/prisma/docs/tree/main", }, blog: false, theme: { customCss: [ - './src/css/custom.css', - './src/css/admonition.css', - './src/css/docsearch.css', - './src/css/all.css', - './src/css/theming.css', - './src/css/prism.css', + "./src/css/custom.css", + "./src/css/admonition.css", + "./src/css/docsearch.css", + "./src/css/all.css", + "./src/css/theming.css", + "./src/css/prism.css", ], }, } satisfies Preset.Options, ], ], themeConfig: { - image: '/docs/social/docs-social.png', + image: "/docs/social/docs-social.png", navbar: { logo: { - srcDark: 'img/logo-white.svg', - alt: 'Prisma logo', - src: 'img/logo.svg', - href: 'https://www.prisma.io/', - target: '_self', + srcDark: "img/logo-white.svg", + alt: "Prisma logo", + src: "img/logo.svg", + href: "https://www.prisma.io/", + target: "_self", }, items: [ { to: DOCUSAURUS_BASE_URL, - position: 'left', - label: '/docs', - className: 'logo-link', + position: "left", + label: "/docs", + className: "logo-link", }, { - type: 'docSidebar', - sidebarId: 'gettingStarted', - position: 'left', - label: 'Get Started', - className: 'indigo first-item', + type: "docSidebar", + sidebarId: "gettingStarted", + position: "left", + label: "Get Started", + className: "indigo first-item", }, { - type: 'docSidebar', - sidebarId: 'ormSidebar', - position: 'left', - className: 'indigo', - label: 'ORM', + type: "docSidebar", + sidebarId: "ormSidebar", + position: "left", + className: "indigo", + label: "ORM", }, { - type: 'docSidebar', - sidebarId: 'accelerateSidebar', - position: 'left', - className: 'teal', - label: 'Accelerate', + type: "docSidebar", + sidebarId: "accelerateSidebar", + position: "left", + className: "teal", + label: "Accelerate", }, { - type: 'docSidebar', - sidebarId: 'pulseSidebar', - position: 'left', - className: 'teal', - label: 'Pulse', + type: "docSidebar", + sidebarId: "pulseSidebar", + position: "left", + className: "teal", + label: "Pulse", }, { - href: 'https://github.com/prisma/', - position: 'right', - className: 'header-github-link', - 'aria-label': 'GitHub repository', + href: "https://github.com/prisma/", + position: "right", + className: "header-github-link", + "aria-label": "GitHub repository", }, { - href: 'https://console.prisma.io/login?utm_source=docs&utm_medium=login', - position: 'right', - label: 'Login', - className: 'navbar-login-btn internal teal-btn', + href: "https://console.prisma.io/login?utm_source=docs&utm_medium=login", + position: "right", + label: "Login", + className: "navbar-login-btn internal teal-btn", }, ], }, algolia: { - appId: 'MF58UJZ648', - apiKey: 'fd3d0a05bfe5d280348060ca5ea416be', - indexName: 'prisma', + appId: "MF58UJZ648", + apiKey: "fd3d0a05bfe5d280348060ca5ea416be", + indexName: "prisma", contextualSearch: false, replaceSearchResultPathname: { - from: '/docs/', + from: "/docs/", to: DOCUSAURUS_BASE_URL, }, }, footer: { - style: 'dark', + style: "dark", links: [ { - title: 'Product', + title: "Product", items: [ { - label: 'ORM', - href: 'https://www.prisma.io/orm', - target: '_self', + label: "ORM", + href: "https://www.prisma.io/orm", + target: "_self", customProps: { internal: true, }, }, { - label: 'Accelerate', - href: 'https://www.prisma.io/data-platform/accelerate', - target: '_self', + label: "Accelerate", + href: "https://www.prisma.io/data-platform/accelerate", + target: "_self", customProps: { internal: true, }, }, { - label: 'Pulse', - href: 'https://www.prisma.io/data-platform/pulse', - target: '_self', + label: "Pulse", + href: "https://www.prisma.io/data-platform/pulse", + target: "_self", customProps: { internal: true, }, }, { - label: 'Pricing', - href: 'https://www.prisma.io/pricing', - target: '_self', + label: "Pricing", + href: "https://www.prisma.io/pricing", + target: "_self", customProps: { internal: true, }, }, { - label: 'Changelog', - href: 'https://www.prisma.io/changelog', - target: '_self', + label: "Changelog", + href: "https://www.prisma.io/changelog", + target: "_self", customProps: { internal: true, }, }, { - label: 'Data Platform status', - href: 'https://www.prisma-status.com/', + label: "Data Platform status", + href: "https://www.prisma-status.com/", }, ], }, { - title: 'Resources', + title: "Resources", items: [ { - label: 'Docs', + label: "Docs", to: DOCUSAURUS_BASE_URL, }, { - label: 'Ecosystem', - href: 'https://www.prisma.io/ecosystem', - target: '_self', + label: "Ecosystem", + href: "https://www.prisma.io/ecosystem", + target: "_self", customProps: { internal: true, }, }, { - label: 'Playground', - href: 'https://playground.prisma.io/', + label: "Playground", + href: "https://playground.prisma.io/", }, { - label: 'Customer stories', - href: 'https://www.prisma.io/showcase', - target: '_self', + label: "Customer stories", + href: "https://www.prisma.io/showcase", + target: "_self", customProps: { internal: true, }, }, { - label: 'Data guide', - href: 'https://www.prisma.io/dataguide', - target: '_self', + label: "Data guide", + href: "https://www.prisma.io/dataguide", + target: "_self", customProps: { internal: true, }, @@ -268,44 +268,44 @@ const config: Config = { ], }, { - title: 'Contact us', + title: "Contact us", items: [ { - label: 'Community', - href: 'https://www.prisma.io/community', - target: '_self', + label: "Community", + href: "https://www.prisma.io/community", + target: "_self", customProps: { internal: true, }, }, { - label: 'Support', - href: 'https://www.prisma.io/support', - target: '_self', + label: "Support", + href: "https://www.prisma.io/support", + target: "_self", customProps: { internal: true, }, }, { - label: 'Enterprise', - href: 'https://www.prisma.io/enterprise', - target: '_self', + label: "Enterprise", + href: "https://www.prisma.io/enterprise", + target: "_self", customProps: { internal: true, }, }, { - label: 'Partners', - href: 'https://www.prisma.io/partners', - target: '_self', + label: "Partners", + href: "https://www.prisma.io/partners", + target: "_self", customProps: { internal: true, }, }, { - label: 'OSS Friends', - to: 'https://www.prisma.io/oss-friends', - target: '_self', + label: "OSS Friends", + to: "https://www.prisma.io/oss-friends", + target: "_self", customProps: { internal: true, }, @@ -313,85 +313,85 @@ const config: Config = { ], }, { - title: 'Company', + title: "Company", items: [ { - label: 'About', - href: 'https://www.prisma.io/about', - target: '_self', + label: "About", + href: "https://www.prisma.io/about", + target: "_self", customProps: { internal: true, }, }, { - label: 'Blog', - to: 'https://www.prisma.io/blog', - target: '_self', + label: "Blog", + to: "https://www.prisma.io/blog", + target: "_self", customProps: { internal: true, }, }, { - label: 'Data DX', - href: 'https://www.datadx.io/', + label: "Data DX", + href: "https://www.datadx.io/", }, { - label: 'Careers', - to: 'https://www.prisma.io/careers', - target: '_self', + label: "Careers", + to: "https://www.prisma.io/careers", + target: "_self", customProps: { internal: true, }, }, { - label: 'Terms & Privacy', - href: 'https://prismaio.notion.site/Terms-Privacy-5b5b9938b3a941ccb2ad97eaf5524c07', + label: "Terms & Privacy", + href: "https://prismaio.notion.site/Terms-Privacy-5b5b9938b3a941ccb2ad97eaf5524c07", }, { - label: 'Service Level Agreement', - href: 'https://pris.ly/sla', + label: "Service Level Agreement", + href: "https://pris.ly/sla", }, ], }, { items: [ { - label: ' ', - href: 'https://discord.gg/KQyTW2H5ca', + label: " ", + href: "https://discord.gg/KQyTW2H5ca", customProps: { - icon: 'fa-brands fa-discord', + icon: "fa-brands fa-discord", internal: true, }, }, { - label: ' ', - href: 'https://x.com/prisma', + label: " ", + href: "https://x.com/prisma", customProps: { - icon: 'fa-brands fa-x-twitter', + icon: "fa-brands fa-x-twitter", internal: true, }, }, { - label: ' ', - href: 'https://www.youtube.com/prismadata', + label: " ", + href: "https://www.youtube.com/prismadata", customProps: { - icon: 'fa-brands fa-youtube', + icon: "fa-brands fa-youtube", internal: true, }, }, { - label: ' ', - href: 'https://pris.ly/whatsapp', + label: " ", + href: "https://pris.ly/whatsapp", customProps: { - icon: 'fa-brands fa-whatsapp', + icon: "fa-brands fa-whatsapp", internal: true, }, }, { - label: ' ', - href: 'https://github.com/prisma', + label: " ", + href: "https://github.com/prisma", customProps: { - icon: 'fa-brands fa-github', + icon: "fa-brands fa-github", internal: true, }, }, @@ -399,11 +399,11 @@ const config: Config = { }, ], logo: { - srcDark: 'img/logo-white.svg', - alt: 'Prisma logo', - src: 'img/logo-white.svg', - href: 'https://www.prisma.io/', - target: '_self', + srcDark: "img/logo-white.svg", + alt: "Prisma logo", + src: "img/logo-white.svg", + href: "https://www.prisma.io/", + target: "_self", }, copyright: `© ${new Date().getFullYear()} Prisma Data, Inc.`, }, @@ -415,28 +415,28 @@ const config: Config = { prism: { theme: prismThemes.github, darkTheme: prismThemes.dracula, - additionalLanguages: ['json', 'bash'], + additionalLanguages: ["json", "bash"], magicComments: [ // Remember to extend the default highlight class name as well! { - className: 'theme-code-block-added-line added-line code-highlight', - line: 'add-next-line', - block: { start: 'add-start', end: 'add-end' }, + className: "theme-code-block-added-line added-line code-highlight", + line: "add-next-line", + block: { start: "add-start", end: "add-end" }, }, { - className: 'theme-code-block-deleted-line deleted-line code-highlight', - line: 'delete-next-line', - block: { start: 'delete-start', end: 'delete-end' }, + className: "theme-code-block-deleted-line deleted-line code-highlight", + line: "delete-next-line", + block: { start: "delete-start", end: "delete-end" }, }, { - className: 'theme-code-block-edited-line edited-line code-highlight', - line: 'edit-next-line', - block: { start: 'edit-start', end: 'edit-end' }, + className: "theme-code-block-edited-line edited-line code-highlight", + line: "edit-next-line", + block: { start: "edit-start", end: "edit-end" }, }, { - className: 'theme-code-block-highlighted-line highlighted-line', - line: 'highlight-next-line', - block: { start: 'highlight-start', end: 'highlight-end' }, + className: "theme-code-block-highlighted-line highlighted-line", + line: "highlight-next-line", + block: { start: "highlight-start", end: "highlight-end" }, }, ], }, diff --git a/lostpixel.config.ts b/lostpixel.config.ts index e81dc64626..453c8fe28c 100644 --- a/lostpixel.config.ts +++ b/lostpixel.config.ts @@ -1,12 +1,12 @@ -import { CustomProjectConfig } from 'lost-pixel'; +import { CustomProjectConfig } from "lost-pixel"; export const config: CustomProjectConfig = { pageShots: { pages: [], - pagesJsonUrl: './lost-pixel-pages.json', - baseUrl: 'http://172.17.0.1:3000', + pagesJsonUrl: "./lost-pixel-pages.json", + baseUrl: "http://172.17.0.1:3000", }, - lostPixelProjectId: 'clb5ek3mm1772001qqg7yban38', + lostPixelProjectId: "clb5ek3mm1772001qqg7yban38", apiKey: process.env.LOST_PIXEL_API_KEY, compareConcurrency: 10, shotConcurrency: 10, @@ -37,6 +37,6 @@ export const config: CustomProjectConfig = { vertical-align: baseline; } `, - }) - } + }); + }, }; diff --git a/package-lock.json b/package-lock.json index aa7d9f6d03..c39578bc9b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -30,6 +30,7 @@ "@docusaurus/module-type-aliases": "^3.2.1", "@docusaurus/tsconfig": "^3.3.2", "@docusaurus/types": "^3.2.1", + "prettier": "3.2.5", "typescript": "~5.4.5", "wrangler": "^3.53.1" }, @@ -13559,6 +13560,21 @@ "node": ">=4" } }, + "node_modules/prettier": { + "version": "3.2.5", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.5.tgz", + "integrity": "sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==", + "dev": true, + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, "node_modules/pretty-error": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-4.0.0.tgz", diff --git a/package.json b/package.json index afa555826e..dabc61c4d0 100644 --- a/package.json +++ b/package.json @@ -37,6 +37,7 @@ "@docusaurus/module-type-aliases": "^3.2.1", "@docusaurus/tsconfig": "^3.3.2", "@docusaurus/types": "^3.2.1", + "prettier": "3.2.5", "typescript": "~5.4.5", "wrangler": "^3.53.1" }, diff --git a/sidebars.ts b/sidebars.ts index 3eaaa8c3ce..9499130022 100644 --- a/sidebars.ts +++ b/sidebars.ts @@ -1,4 +1,4 @@ -import type { SidebarsConfig } from '@docusaurus/plugin-content-docs'; +import type { SidebarsConfig } from "@docusaurus/plugin-content-docs"; // workaround suggested by Docusaurus team: https://github.com/facebook/docusaurus/issues/9902#issuecomment-1972125804 type SidebarConfig = SidebarsConfig[string]; @@ -7,16 +7,16 @@ type SidebarItemConfigArray = OnlyArray; type SidebarItemConfig = SidebarItemConfigArray[number]; const platformCategory: SidebarItemConfig = { - type: 'category', - label: 'Platform', + type: "category", + label: "Platform", collapsed: false, collapsible: false, link: { - type: 'doc', - id: 'platform/index', + type: "doc", + id: "platform/index", }, className: "firstTitle", - items: [{ type: 'autogenerated', dirName: '500-platform' }], + items: [{ type: "autogenerated", dirName: "500-platform" }], }; /** @@ -33,300 +33,308 @@ const sidebars: SidebarsConfig = { // By default, Docusaurus generates a sidebar from the docs folder structure gettingStarted: [ { - type: 'category', + type: "category", collapsed: false, collapsible: false, - label: 'Get Started', + label: "Get Started", link: { - type: 'doc', - id: 'getting-started/index', + type: "doc", + id: "getting-started/index", }, className: "firstTitle", items: [ - 'getting-started/index', + "getting-started/index", { - type: 'doc', - id: 'getting-started/quickstart', - label: 'Quickstart', + type: "doc", + id: "getting-started/quickstart", + label: "Quickstart", }, { - type: 'category', - label: 'Set up Prisma ORM', + type: "category", + label: "Set up Prisma ORM", collapsed: false, collapsible: false, link: { - type: 'doc', - id: 'getting-started/setup-prisma/index', + type: "doc", + id: "getting-started/setup-prisma/index", }, items: [ { - type: 'category', - label: 'Start from scratch', + type: "category", + label: "Start from scratch", link: { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/index', + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/index", }, items: [ { - type: 'category', - label: 'Relational databases', + type: "category", + label: "Relational databases", customProps: { - badge: '15 Min' + badge: "15 Min", }, link: { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-postgresql', + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-postgresql", }, items: [ { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-postgresql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-postgresql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-mysql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-mysql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-planetscale', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-planetscale", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-sqlserver', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-sqlserver", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-cockroachdb', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-typescript-cockroachdb", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-node-postgresql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-node-postgresql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-node-mysql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-node-mysql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-node-planetscale', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-node-planetscale", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-node-sqlserver', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-node-sqlserver", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/relational-databases-node-cockroachdb', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/relational-databases-node-cockroachdb", + className: "hidden-sidebar", }, { - type: 'autogenerated', - dirName: '100-getting-started/02-setup-prisma/100-start-from-scratch/110-relational-databases', - } - ] + type: "autogenerated", + dirName: + "100-getting-started/02-setup-prisma/100-start-from-scratch/110-relational-databases", + }, + ], }, { - type: 'category', - label: 'MongoDB', + type: "category", + label: "MongoDB", customProps: { - badge: '15 Min' + badge: "15 Min", }, link: { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/mongodb-typescript-mongodb', + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/mongodb-typescript-mongodb", }, items: [ { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/mongodb-node-mongodb', - className: "hidden-sidebar" + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/mongodb-node-mongodb", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/start-from-scratch/mongodb-typescript-mongodb', - className: "hidden-sidebar" + type: "doc", + id: "getting-started/setup-prisma/start-from-scratch/mongodb-typescript-mongodb", + className: "hidden-sidebar", }, { - type: 'autogenerated', - dirName: '100-getting-started/02-setup-prisma/100-start-from-scratch/120-mongodb', - } - ] - } - ] + type: "autogenerated", + dirName: + "100-getting-started/02-setup-prisma/100-start-from-scratch/120-mongodb", + }, + ], + }, + ], }, { - type: 'category', + type: "category", label: "Add to existing project", link: { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/index', + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/index", }, items: [ { - type: 'category', - label: 'Relational databases', + type: "category", + label: "Relational databases", customProps: { - badge: '15 Min' + badge: "15 Min", }, link: { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-postgresql', + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-postgresql", }, items: [ { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-postgresql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-postgresql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-mysql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-mysql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-planetscale', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-planetscale", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-sqlserver', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-sqlserver", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-cockroachdb', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-typescript-cockroachdb", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-node-postgresql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-node-postgresql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-node-mysql', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-node-mysql", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-node-planetscale', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-node-planetscale", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-node-sqlserver', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-node-sqlserver", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/relational-databases-node-cockroachdb', - className: 'hidden-sidebar' + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/relational-databases-node-cockroachdb", + className: "hidden-sidebar", }, { - type: 'autogenerated', - dirName: '100-getting-started/02-setup-prisma/200-add-to-existing-project/110-relational-databases', - } - ] + type: "autogenerated", + dirName: + "100-getting-started/02-setup-prisma/200-add-to-existing-project/110-relational-databases", + }, + ], }, { - type: 'category', - label: 'MongoDB', + type: "category", + label: "MongoDB", customProps: { - badge: '15 Min' + badge: "15 Min", }, link: { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/mongodb-typescript-mongodb', + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/mongodb-typescript-mongodb", }, items: [ { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/mongodb-node-mongodb', - className: "hidden-sidebar" + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/mongodb-node-mongodb", + className: "hidden-sidebar", }, { - type: 'doc', - id: 'getting-started/setup-prisma/add-to-existing-project/mongodb-typescript-mongodb', - className: "hidden-sidebar" + type: "doc", + id: "getting-started/setup-prisma/add-to-existing-project/mongodb-typescript-mongodb", + className: "hidden-sidebar", }, { - type: 'autogenerated', - dirName: '100-getting-started/02-setup-prisma/200-add-to-existing-project/120-mongodb', - }] - } - ] - },] - } - ] - } + type: "autogenerated", + dirName: + "100-getting-started/02-setup-prisma/200-add-to-existing-project/120-mongodb", + }, + ], + }, + ], + }, + ], + }, + ], + }, ], - ormSidebar: [{ - type: 'category', - label: 'ORM', - collapsed: false, - collapsible: false, - link: { - type: 'doc', - id: 'orm/orm-index' + ormSidebar: [ + { + type: "category", + label: "ORM", + collapsed: false, + collapsible: false, + link: { + type: "doc", + id: "orm/orm-index", + }, + className: "firstTitle", + items: [{ type: "autogenerated", dirName: "200-orm" }], }, - className: 'firstTitle', - items: [{ type: 'autogenerated', dirName: '200-orm' }], - }], + ], accelerateSidebar: [ { - type: 'category', - label: 'Accelerate', + type: "category", + label: "Accelerate", collapsed: false, collapsible: false, link: { - type: 'doc', - id: 'accelerate/index' + type: "doc", + id: "accelerate/index", }, - className: 'firstTitle', - items: [{ type: 'autogenerated', dirName: '300-accelerate' }] + className: "firstTitle", + items: [{ type: "autogenerated", dirName: "300-accelerate" }], }, platformCategory, ], pulseSidebar: [ { - type: 'category', - label: 'Pulse', + type: "category", + label: "Pulse", collapsible: false, collapsed: false, link: { - type: 'doc', - id: 'pulse/index' + type: "doc", + id: "pulse/index", }, - className: 'firstTitle', - items: [{ type: 'autogenerated', dirName: '400-pulse' }] + className: "firstTitle", + items: [{ type: "autogenerated", dirName: "400-pulse" }], }, platformCategory, ], - platformSidebar: [ - platformCategory, - ], - aboutSidebar: [{ - type: 'category', - label: 'About', - collapsed: false, - collapsible: false, - link: { - type: 'doc', - id: 'about/index' + platformSidebar: [platformCategory], + aboutSidebar: [ + { + type: "category", + label: "About", + collapsed: false, + collapsible: false, + link: { + type: "doc", + id: "about/index", + }, + className: "firstTitle", + items: [{ type: "autogenerated", dirName: "600-about" }], }, - className: 'firstTitle', - items: [{ type: 'autogenerated', dirName: '600-about' }] - }], + ], }; export default sidebars; diff --git a/src/components/GettingStarted/index.tsx b/src/components/GettingStarted/index.tsx index 8377cb8f89..ffe5b383f3 100644 --- a/src/components/GettingStarted/index.tsx +++ b/src/components/GettingStarted/index.tsx @@ -1,67 +1,79 @@ -import React, { useRef, useState } from 'react' -import { Icon } from '../Icon' -import { Tooltip } from '../tooltip/Tooltip' -import styles from "../../css/gettingStarted.module.scss" -import Link from '@docusaurus/Link' -import useBaseUrl from '@docusaurus/useBaseUrl' +import React, { useRef, useState } from "react"; +import { Icon } from "../Icon"; +import { Tooltip } from "../tooltip/Tooltip"; +import styles from "../../css/gettingStarted.module.scss"; +import Link from "@docusaurus/Link"; +import useBaseUrl from "@docusaurus/useBaseUrl"; export const Database = ({ color, width, height }: any) => ( -) +); export const Bolt = ({ color, width, height }: any) => ( -) +); export const SignalStream = ({ color, height, width }: any) => ( -) +); -export const BorderBoxWrapper = ({children, ...props}) =>
{children}
+export const BorderBoxWrapper = ({ children, ...props }) => ( +
+ {children} +
+); -export const BoxTitle = ({children, ...props}) =>

{children}

+export const BoxTitle = ({ children, ...props }) => ( +

+ {children} +

+); export const BorderBox = ({ border, ...props }: any) => ( {props.children} -) +); -export const Grid = ({children, ...props}) =>
{children}
+export const Grid = ({ children, ...props }) => ( +
+ {children} +
+); export const LinkCard = ({ icon, title, desc, link }: any) => { - const linkCardRef = useRef(null) + const linkCardRef = useRef(null); return (
@@ -70,15 +82,19 @@ export const LinkCard = ({ icon, title, desc, link }: any) => {

{desc}

- ) -} + ); +}; -export const Tab = ({children, ...props}) =>
{children}
+export const Tab = ({ children, ...props }) => ( +
+ {children} +
+); export const SquareLogo = ({ image, tech, url }: any) => { - const squareCardRef = useRef(null) - const imgUrl = useBaseUrl(image) - const [visibleTooltip, setVisibleTooltip] = useState(false) + const squareCardRef = useRef(null); + const imgUrl = useBaseUrl(image); + const [visibleTooltip, setVisibleTooltip] = useState(false); return ( <> { )} - ) -} + ); +}; -export const List = ({children, ...props}) =>
{children}
+export const List = ({ children, ...props }) => ( +
+ {children} +
+); diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx index 8c5b72e698..0c24fbc76b 100644 --- a/src/components/Icon.tsx +++ b/src/components/Icon.tsx @@ -1,48 +1,49 @@ -import React, { useEffect, useRef, useState } from 'react' +import clsx from "clsx"; +import React, { useEffect, useRef, useState } from "react"; interface IconProps { - icon: string - color?: string - className?: string - size?: string - btn?: 'left' | 'right' - fit?: 'width' | 'height' + icon: string; + color?: string; + className?: string; + size?: string; + btn?: "left" | "right"; + fit?: "width" | "height"; } export const Icon = ({ icon, color, className, size, btn, fit }: IconProps) => { - const iconRef = useRef(null) - const [font, setFontSize] = useState(0) - const [measure, setMeasure] = useState('vw') + const iconRef = useRef(null); + const [font, setFontSize] = useState(0); + const [measure, setMeasure] = useState("vw"); useEffect(() => { if (iconRef && iconRef.current) { - setFont() + setFont(); } - }, [iconRef.current]) + }, [iconRef.current]); const setFont = () => { - const parentElement = iconRef.current.parentElement.getBoundingClientRect() + const parentElement = iconRef.current.parentElement.getBoundingClientRect(); setFontSize( - (100 * parentElement[parentElement.width > parentElement.height ? 'height' : 'width']) / - window[parentElement.width > parentElement.height ? 'innerHeight' : 'innerWidth'] - + (100 * parentElement[parentElement.width > parentElement.height ? "height" : "width"]) / + window[parentElement.width > parentElement.height ? "innerHeight" : "innerWidth"] - 0.6 - ) - setMeasure(parentElement.width > parentElement.height ? 'vh' : 'vw') - } + ); + setMeasure(parentElement.width > parentElement.height ? "vh" : "vw"); + }; useEffect(() => { - window.addEventListener('resize', setFont) - return () => window.removeEventListener('resize', setFont) - }, []) + window.addEventListener("resize", setFont); + return () => window.removeEventListener("resize", setFont); + }, []); return ( - ) -} \ No newline at end of file + ); +}; diff --git a/src/components/collapsible.tsx b/src/components/collapsible.tsx index 9b6b5ba5ca..a4f0041504 100644 --- a/src/components/collapsible.tsx +++ b/src/components/collapsible.tsx @@ -1,26 +1,29 @@ -import * as React from 'react' -import styles from "../css/collapsible.module.scss" +import * as React from "react"; +import styles from "../css/collapsible.module.scss"; -type CollapseProps = React.ReactNode -let index = 0 +type CollapseProps = React.ReactNode; +let index = 0; const getRemainingChildren = (children: any) => - children.filter((child: any) => !(child.props && child.props.originalType === 'summary')) + children.filter((child: any) => !(child.props && child.props.originalType === "summary")); //@ts-ignore const CollapseBox = ({ children, ...props }: CollapseProps) => { const titleChild = - children && children.find((child: any) => child.props && child.props.originalType === 'summary') - const title = titleChild && titleChild.props.children + children && + children.find((child: any) => child.props && child.props.originalType === "summary"); + const title = titleChild && titleChild.props.children; return (
- +
{getRemainingChildren(children)}
- ) -} + ); +}; -export default CollapseBox \ No newline at end of file +export default CollapseBox; diff --git a/src/components/newsletter/FooterNewsletterForm.tsx b/src/components/newsletter/FooterNewsletterForm.tsx index 4370d6a56d..139bfcd59e 100644 --- a/src/components/newsletter/FooterNewsletterForm.tsx +++ b/src/components/newsletter/FooterNewsletterForm.tsx @@ -1,59 +1,65 @@ -import React, { useRef, useState } from 'react' -import styles from "./styles.module.scss" -import { Icon } from '../Icon' -import useDocusaurusContext from '@docusaurus/useDocusaurusContext' +import React, { useRef, useState } from "react"; +import styles from "./styles.module.scss"; +import { Icon } from "../Icon"; +import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -namespace S { -} +namespace S {} -const icon = (name: string) => -type ColorType = 'indigo' | 'teal' | 'white' | undefined +const icon = (name: string) => ; +type ColorType = "indigo" | "teal" | "white" | undefined; type FooterNewsletterFormProps = { - theme?: any - color?: ColorType -} + theme?: any; + color?: ColorType; +}; -export const FooterNewsletterForm = ({ theme, color = 'indigo' }: FooterNewsletterFormProps) => { - const [email, setEmail] = useState('') - const [submitted, setSubmitted] = useState(false) - const mailchimpForm = useRef(null) - const { siteConfig: { customFields } } = useDocusaurusContext(); +export const FooterNewsletterForm = ({ theme, color = "indigo" }: FooterNewsletterFormProps) => { + const [email, setEmail] = useState(""); + const [submitted, setSubmitted] = useState(false); + const mailchimpForm = useRef(null); + const { + siteConfig: { customFields }, + } = useDocusaurusContext(); const setFormSubmitted = (event: any) => { const options = { - method: 'POST', + method: "POST", headers: { - accept: 'application/json', - 'content-type': 'application/json', + accept: "application/json", + "content-type": "application/json", // Add API key to cloudfare deployment - 'api-key': customFields.BREVO_API_KEY, + "api-key": customFields.BREVO_API_KEY, }, body: JSON.stringify({ email: email, attributes: { EMAIL: email, - SOURCE: 'website', + SOURCE: "website", }, includeListIds: [15], templateId: 36, - redirectionUrl: 'https://prisma.io', + redirectionUrl: "https://prisma.io", }), - } + }; //@ts-ignore - fetch('https://api.brevo.com/v3/contacts/doubleOptinConfirmation', options) + fetch("https://api.brevo.com/v3/contacts/doubleOptinConfirmation", options); setTimeout(() => { - setEmail('') - setSubmitted(true) - }, 200) - } + setEmail(""); + setSubmitted(true); + }, 200); + }; return (
-
+ -
- +
- ) -} + ); +}; diff --git a/src/components/newsletter/styles.module.scss b/src/components/newsletter/styles.module.scss index 583fd087e0..3e684f3f2e 100644 --- a/src/components/newsletter/styles.module.scss +++ b/src/components/newsletter/styles.module.scss @@ -1,46 +1,62 @@ .formBtn { - display: inline-flex; - -webkit-box-pack: center; - padding: 16px 24px; - justify-content: center; - max-width: 100%; - text-align: left; - z-index: 1; - margin: 4px; - -webkit-box-align: center; - align-items: center; - box-sizing: border-box; - border-radius: 6px; - text-decoration: none; + display: inline-flex; + -webkit-box-pack: center; + padding: 16px 24px; + justify-content: center; + max-width: 100%; + text-align: left; + z-index: 1; + margin: 4px; + -webkit-box-align: center; + align-items: center; + box-sizing: border-box; + border-radius: 6px; + text-decoration: none; + cursor: pointer; + position: relative; + line-height: 1; + transition: + background-color 0.1s ease 0s, + color 0.2s ease 0s; + font-family: + Inter, + system-ui, + -apple-system, + BlinkMacSystemFont, + "Segoe UI", + Roboto, + "Helvetica Neue", + Arial, + "Noto Sans", + sans-serif, + "Apple Color Emoji", + "Segoe UI Emoji", + "Segoe UI Symbol", + "Noto Color Emoji"; + font-weight: 700; + font-size: 18px; + border: 1px solid rgb(90, 103, 216); + background-color: rgb(90, 103, 216); + color: white; + content: "Subscribe for updates"; + max-height: 48px; + white-space: nowrap; + width: 100%; + @media only screen and (min-width: 768px) { + width: max-content; + } + .button { + background-color: transparent; + background-image: none; + color: inherit; cursor: pointer; - position: relative; - line-height: 1; - transition: background-color 0.1s ease 0s, color 0.2s ease 0s; - font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; - font-weight: 700; - font-size: 18px; - border: 1px solid rgb(90, 103, 216); - background-color: rgb(90, 103, 216); - color: white; - content: 'Subscribe for updates'; - max-height: 48px; - white-space: nowrap; - width: 100%; - @media only screen and (min-width: 768px) { - width: max-content; - } - .button { - background-color: transparent; - background-image: none; - color: inherit; - cursor: pointer; - font-weight: inherit; - line-height: inherit; - font-size: 100%; - margin: 0; - padding: 0; - border: 0; - } + font-weight: inherit; + line-height: inherit; + font-size: 100%; + margin: 0; + padding: 0; + border: 0; + } } .form { position: relative; @@ -100,6 +116,6 @@ padding: 12px 25px 12px 58px; &:focus { - outline: 1px solid + outline: 1px solid; } -} \ No newline at end of file +} diff --git a/src/components/shadow-card/index.tsx b/src/components/shadow-card/index.tsx index 84edb335de..5742dd07cb 100644 --- a/src/components/shadow-card/index.tsx +++ b/src/components/shadow-card/index.tsx @@ -1,10 +1,11 @@ -import React from 'react' -import styles from "./styles.module.scss" +import React from "react"; +import styles from "./styles.module.scss"; +import clsx from "clsx"; const ShadowCard = ({ starter, className, ...rest }: any) => ( -
+
{rest.children}
-) +); -export default ShadowCard +export default ShadowCard; diff --git a/src/components/shadow-card/styles.module.scss b/src/components/shadow-card/styles.module.scss index ef0c858e05..b2217fd670 100644 --- a/src/components/shadow-card/styles.module.scss +++ b/src/components/shadow-card/styles.module.scss @@ -1,28 +1,30 @@ .cardLibWrapper { - box-shadow: 0px 5px 3px rgba(23, 43, 77, 0.04), 0px 8px 5px rgba(23, 43, 77, 0.08); - background: var(--shadow-card-bg); - border-radius: 8px; - overflow: hidden; - width: 100%; - cursor: pointer; - max-width: 100%; - margin: 0; - &:hover { - transform: scale(1.02); + box-shadow: + 0px 5px 3px rgba(23, 43, 77, 0.04), + 0px 8px 5px rgba(23, 43, 77, 0.08); + background: var(--shadow-card-bg); + border-radius: 8px; + overflow: hidden; + width: 100%; + cursor: pointer; + max-width: 100%; + margin: 0; + &:hover { + transform: scale(1.02); + } + transition: transform 100ms ease; + .content { + padding: 32px 24px; + text-align: left; + p { + color: #4a5568; } - transition: transform 100ms ease; - .content { - padding: 32px 24px; - text-align: left; - p { - color: #4a5568; - } - a { - text-decoration: none; - } - - &:hover .link > span:first-of-type { - text-decoration: underline; - } + a { + text-decoration: none; } -} \ No newline at end of file + + &:hover .link > span:first-of-type { + text-decoration: underline; + } + } +} diff --git a/src/components/shortcodes/select.tsx b/src/components/shortcodes/select.tsx index ad26acf4e0..d7da0621d3 100644 --- a/src/components/shortcodes/select.tsx +++ b/src/components/shortcodes/select.tsx @@ -1,15 +1,15 @@ -import * as React from 'react' -import Select, { components } from 'react-select' +import * as React from "react"; +import Select, { components } from "react-select"; interface SelectProps { - items: any[] - onChange: (item: any) => void - selectedItem: any - width?: number - DropdownIndicator: any - IndicatorSeperator: any - Option: any - SingleValue: any + items: any[]; + onChange: (item: any) => void; + selectedItem: any; + width?: number; + DropdownIndicator: any; + IndicatorSeperator: any; + Option: any; + SingleValue: any; } const SelectComponent = (props: SelectProps) => { @@ -21,24 +21,24 @@ const SelectComponent = (props: SelectProps) => { IndicatorSeperator, Option, SingleValue, - } = props - const width = props.width || 160 + } = props; + const width = props.width || 160; const handleChange = (newValue: any) => { - onChange({ technology: newValue.value }) - } + onChange({ technology: newValue.value }); + }; - const options = items.map((it) => ({ value: it.technology, label: it.technology })) + const options = items.map((it) => ({ value: it.technology, label: it.technology })); - const selectedOption = options.filter((ff) => ff.value === selectedItem.technology) + const selectedOption = options.filter((ff) => ff.value === selectedItem.technology); const SelectContainer = (props: any) => { return ( {props.children} - ) - } + ); + }; return (