diff --git a/.github/workflows/prettier.yml b/.github/workflows/prettier.yml index 1972d75eebf..c71fb46be16 100644 --- a/.github/workflows/prettier.yml +++ b/.github/workflows/prettier.yml @@ -14,7 +14,7 @@ jobs: # disable this check while we migrate to monorepo - name: Run prettier run: |- - npx prettier -c 'i18n/**/*.{js,jsx,ts,tsx,css,md,json}' + npx prettier -c 'apps/**/*.{js,jsx,ts,tsx,css,md,json}' # run: |- # function run_check() { # if $(grep -q '"prettier"' "$1") ; then diff --git a/.prettierignore b/.prettierignore index 2c0e30b971f..9ab0849d504 100644 --- a/.prettierignore +++ b/.prettierignore @@ -2,4 +2,5 @@ .next node_modules package-lock.json -docker* \ No newline at end of file +docker* +apps/**/out \ No newline at end of file diff --git a/.prettierrc b/.prettierrc index 8df6df7757c..76c3f65353b 100644 --- a/.prettierrc +++ b/.prettierrc @@ -3,5 +3,6 @@ "tabWidth": 2, "semi": false, "singleQuote": true, - "printWidth": 100 + "printWidth": 100, + "endOfLine": "lf" } diff --git a/DEVELOPERS.md b/DEVELOPERS.md index 465efd1a6ec..705a23d9171 100644 --- a/DEVELOPERS.md +++ b/DEVELOPERS.md @@ -9,14 +9,20 @@ - [Supabase Website Development Server](#supabase-website-development-server) - [Supabase Docs Development Server](#supabase-docs-development-server) - [Supabase Studio Development Server](#supabase-studio-development-server) +- [Monorepo](#monorepo) + - [Getting started](#getting-started) + - [Shared components](#shared-components) + - [Installing packages](#installing-packages) + - [Development](#development) - [Finally](#finally) - [Community Channels](#community-channels) -- [Monorepo](#monorepo) - - [Development](#development) ## Development Setup -First off, thanks for your interest in Supabase and for wanting to contribute! before you begin, read the [code of conduct](https://github.com/supabase/.github/blob/main/CODE_OF_CONDUCT.md) and check out the [existing issues](https://github.com/supabase/supabase/issues). This document describes how to set up your development environment to build and test Supabase. +First off, thanks for your interest in Supabase and for wanting to contribute! before you begin, read the +[code of conduct](https://github.com/supabase/.github/blob/main/CODE_OF_CONDUCT.md) and check out the +[existing issues](https://github.com/supabase/supabase/issues). +This document describes how to set up your development environment to build and test Supabase. ### Installing Dependencies @@ -94,25 +100,7 @@ To debug code, and to see changes in real time, it is often useful to have a loc ### Supabase Website Development Server -1. Start development server - - npm - - ```sh - npm run dev - ``` - - or with yarn - - ```sh - yarn dev - ``` - -2. To access the local server, enter the following URL into your web browser: - - ```sh - http://localhost:3000/ - ``` +The website is moving to a new monorepo setup. See the [Monorepo](#monorepo) section below. ### Supabase Docs Development Server @@ -174,6 +162,57 @@ To debug code, and to see changes in real time, it is often useful to have a loc For more information on Supabase Studio, see the [Supabase Studio readme](./studio/README.md). +## Monorepo + +We are in the process of migrating this repository to monorepo, using Turborepo. +Eventually, the docs and the Studio will be run using Turborepo, which will significantly improve the developer workflow. +You must be using NPM 7 or higher. + +### Getting started + +```sh +npm run install # install dependencies +npm run dev # start all the applications +``` + +Then edit and visit any of the following sites: + +- `/apps/www`: http://localhost:3000 + - The main website. +- `/apps/temp-docs`: http://localhost:3001 + - We are migrating the docs to a Next.js application. +- `/apps/temp-community-forum`: http://localhost:3002 + - pulls all our github discussions into a nextjs site. Temporary/POC +- `/apps/temp-community-tutorials`: http://localhost:3003 + - pulls all our DEV articles (which community members can write) into a nextjs site. Temporary/POC + + +### Shared components + +The monorepo has a set of shared components under `/packages`: + +- `/packages/common`: Common React code, shared between all sites. +- `/packages/config`: All shared config +- `/packages/tsconfig`: Shared Typescript settings +### Installing packages + +Installing a package with NPM workspaces requires you to add the `-w` flag to tell NPM which workspace you want to install into. + +The format is: `npm install -w=`. + +For example: + +- `npm install @supabase/ui -w common`: installs into `./packages/common` +- `npm install @supabase/ui -w www`: installs into `./apps/www` + +You do not need to install `devDependencies` in each workspace. These can all be installed in the root package. + +### Development + +`npm run dev` + + + ## Finally After making your changes to the file(s) you'd like to update, it's time to open a pull request. Once you submit your pull request, others from the Supabase team/community will review it with you. @@ -183,20 +222,3 @@ Did you have an issue, like a merge conflict, or don't know how to open a pull r ## Community Channels Stuck somewhere? Have any questions? please join the [Discord Community Server](https://discord.supabase.com/) or the [Github Discussions](https://github.com/supabase/supabase/discussions). We are here to help! - -## Monorepo - -This is a monorepo, using Turborepo. You must be using NPM 7 or higher. - -- Install a package: `npm install -w=`. eg: - - `npm install @supabase/ui -w ui`: installs into `./packages/ui` - - `npm install @supabase/ui -w docs`: installs into `./packages/docs` - -### Development - -`npm run dev` - -- www: http://localhost:3000 -- docs: http://localhost:3001 -- forum: http://localhost:3002 - pulls all our github discussions into a nextjs site. Temporary/POC -- tutorial: http://localhost:3003 - pulls all our DEV articles (which community members can write) into a nextjs site. Temporary/POC diff --git a/apps/docs/.eslintrc.js b/apps/docs/.eslintrc.js deleted file mode 100644 index dc369e9a848..00000000000 --- a/apps/docs/.eslintrc.js +++ /dev/null @@ -1 +0,0 @@ -module.exports = require("config/eslint-preset"); diff --git a/apps/docs/next.config.js b/apps/docs/next.config.js deleted file mode 100644 index 834bc1820e9..00000000000 --- a/apps/docs/next.config.js +++ /dev/null @@ -1,5 +0,0 @@ -const withTM = require('next-transpile-modules')(['ui']) - -module.exports = withTM({ - reactStrictMode: true, -}) diff --git a/apps/temp-community-forum/.eslintrc.js b/apps/temp-community-forum/.eslintrc.js index dc369e9a848..e0b422e408e 100644 --- a/apps/temp-community-forum/.eslintrc.js +++ b/apps/temp-community-forum/.eslintrc.js @@ -1 +1 @@ -module.exports = require("config/eslint-preset"); +module.exports = require('config/eslint-preset') diff --git a/apps/temp-community-forum/next.config.js b/apps/temp-community-forum/next.config.js index 53e0a424874..6e4744fdc65 100644 --- a/apps/temp-community-forum/next.config.js +++ b/apps/temp-community-forum/next.config.js @@ -1,5 +1,5 @@ -const withTM = require("next-transpile-modules")(["ui"]); +const withTM = require('next-transpile-modules')(['common']) module.exports = withTM({ reactStrictMode: true, -}); +}) diff --git a/apps/temp-community-forum/package.json b/apps/temp-community-forum/package.json index c52f04b2e49..8cb9bd85760 100644 --- a/apps/temp-community-forum/package.json +++ b/apps/temp-community-forum/package.json @@ -13,7 +13,7 @@ "next": "12.0.8", "react": "17.0.2", "react-dom": "17.0.2", - "ui": "*" + "common": "*" }, "devDependencies": { "@types/node": "^17.0.12", diff --git a/apps/temp-community-forum/src/pages/index.tsx b/apps/temp-community-forum/src/pages/index.tsx index a0283d42e9e..c7381379165 100644 --- a/apps/temp-community-forum/src/pages/index.tsx +++ b/apps/temp-community-forum/src/pages/index.tsx @@ -1,5 +1,5 @@ import { fetchDiscussions } from '../utils/api' -import { Button, Layouts } from 'ui' +import { Button, Layouts } from 'common' import { useEffect, useState } from 'react' export default function Main() { diff --git a/apps/temp-community-forum/src/styles/tailwind.css b/apps/temp-community-forum/src/styles/tailwind.css index bd6213e1dfe..b5c61c95671 100644 --- a/apps/temp-community-forum/src/styles/tailwind.css +++ b/apps/temp-community-forum/src/styles/tailwind.css @@ -1,3 +1,3 @@ @tailwind base; @tailwind components; -@tailwind utilities; \ No newline at end of file +@tailwind utilities; diff --git a/apps/temp-community-tutorials/.eslintrc.js b/apps/temp-community-tutorials/.eslintrc.js index dc369e9a848..e0b422e408e 100644 --- a/apps/temp-community-tutorials/.eslintrc.js +++ b/apps/temp-community-tutorials/.eslintrc.js @@ -1 +1 @@ -module.exports = require("config/eslint-preset"); +module.exports = require('config/eslint-preset') diff --git a/apps/temp-community-tutorials/next.config.js b/apps/temp-community-tutorials/next.config.js index 53e0a424874..6e4744fdc65 100644 --- a/apps/temp-community-tutorials/next.config.js +++ b/apps/temp-community-tutorials/next.config.js @@ -1,5 +1,5 @@ -const withTM = require("next-transpile-modules")(["ui"]); +const withTM = require('next-transpile-modules')(['common']) module.exports = withTM({ reactStrictMode: true, -}); +}) diff --git a/apps/temp-community-tutorials/package.json b/apps/temp-community-tutorials/package.json index 4d1b0985d4c..12164b923ca 100644 --- a/apps/temp-community-tutorials/package.json +++ b/apps/temp-community-tutorials/package.json @@ -12,7 +12,7 @@ "next": "12.0.8", "react": "17.0.2", "react-dom": "17.0.2", - "ui": "*" + "common": "*" }, "devDependencies": { "config": "*", diff --git a/apps/temp-community-tutorials/src/pages/index.tsx b/apps/temp-community-tutorials/src/pages/index.tsx index 185c1449e2a..2e5771c0ae1 100644 --- a/apps/temp-community-tutorials/src/pages/index.tsx +++ b/apps/temp-community-tutorials/src/pages/index.tsx @@ -1,5 +1,5 @@ import { fetchPosts, DevPost } from '../utils/api' -import { Button, Layouts } from 'ui' +import { Button, Layouts } from 'common' import { useEffect, useState } from 'react' export default function Main() { diff --git a/apps/temp-community-tutorials/src/styles/tailwind.css b/apps/temp-community-tutorials/src/styles/tailwind.css index bd6213e1dfe..b5c61c95671 100644 --- a/apps/temp-community-tutorials/src/styles/tailwind.css +++ b/apps/temp-community-tutorials/src/styles/tailwind.css @@ -1,3 +1,3 @@ @tailwind base; @tailwind components; -@tailwind utilities; \ No newline at end of file +@tailwind utilities; diff --git a/apps/temp-docs/.eslintrc.js b/apps/temp-docs/.eslintrc.js new file mode 100644 index 00000000000..e0b422e408e --- /dev/null +++ b/apps/temp-docs/.eslintrc.js @@ -0,0 +1 @@ +module.exports = require('config/eslint-preset') diff --git a/apps/docs/README.md b/apps/temp-docs/README.md similarity index 100% rename from apps/docs/README.md rename to apps/temp-docs/README.md diff --git a/apps/docs/next-env.d.ts b/apps/temp-docs/next-env.d.ts similarity index 100% rename from apps/docs/next-env.d.ts rename to apps/temp-docs/next-env.d.ts diff --git a/apps/temp-docs/next.config.js b/apps/temp-docs/next.config.js new file mode 100644 index 00000000000..6e4744fdc65 --- /dev/null +++ b/apps/temp-docs/next.config.js @@ -0,0 +1,5 @@ +const withTM = require('next-transpile-modules')(['common']) + +module.exports = withTM({ + reactStrictMode: true, +}) diff --git a/apps/docs/package.json b/apps/temp-docs/package.json similarity index 96% rename from apps/docs/package.json rename to apps/temp-docs/package.json index 33989c8ff84..a3b959bf083 100644 --- a/apps/docs/package.json +++ b/apps/temp-docs/package.json @@ -12,7 +12,7 @@ "next": "12.1.0", "react": "17.0.2", "react-dom": "17.0.2", - "ui": "*" + "common": "*" }, "devDependencies": { "@types/node": "^17.0.12", diff --git a/apps/docs/postcss.config.js b/apps/temp-docs/postcss.config.js similarity index 100% rename from apps/docs/postcss.config.js rename to apps/temp-docs/postcss.config.js diff --git a/apps/docs/src/components/Sidebar.tsx b/apps/temp-docs/src/components/Sidebar.tsx similarity index 100% rename from apps/docs/src/components/Sidebar.tsx rename to apps/temp-docs/src/components/Sidebar.tsx diff --git a/apps/docs/src/pages/_app.tsx b/apps/temp-docs/src/pages/_app.tsx similarity index 100% rename from apps/docs/src/pages/_app.tsx rename to apps/temp-docs/src/pages/_app.tsx diff --git a/apps/docs/src/pages/index.tsx b/apps/temp-docs/src/pages/index.tsx similarity index 85% rename from apps/docs/src/pages/index.tsx rename to apps/temp-docs/src/pages/index.tsx index e9aeb501c96..23642e79837 100644 --- a/apps/docs/src/pages/index.tsx +++ b/apps/temp-docs/src/pages/index.tsx @@ -1,4 +1,4 @@ -import { Button, Layouts } from 'ui' +import { Button, Layouts } from 'common' import Sidebar from '../components/Sidebar' export default function Docs() { diff --git a/apps/docs/src/styles/tailwind.css b/apps/temp-docs/src/styles/tailwind.css similarity index 64% rename from apps/docs/src/styles/tailwind.css rename to apps/temp-docs/src/styles/tailwind.css index bd6213e1dfe..b5c61c95671 100644 --- a/apps/docs/src/styles/tailwind.css +++ b/apps/temp-docs/src/styles/tailwind.css @@ -1,3 +1,3 @@ @tailwind base; @tailwind components; -@tailwind utilities; \ No newline at end of file +@tailwind utilities; diff --git a/apps/docs/tailwind.config.js b/apps/temp-docs/tailwind.config.js similarity index 100% rename from apps/docs/tailwind.config.js rename to apps/temp-docs/tailwind.config.js diff --git a/apps/docs/tsconfig.json b/apps/temp-docs/tsconfig.json similarity index 100% rename from apps/docs/tsconfig.json rename to apps/temp-docs/tsconfig.json diff --git a/apps/www/components/AdminAccess/tabs.tsx b/apps/www/components/AdminAccess/tabs.tsx index 753b2f85b44..95ba72ef503 100644 --- a/apps/www/components/AdminAccess/tabs.tsx +++ b/apps/www/components/AdminAccess/tabs.tsx @@ -14,7 +14,7 @@ function Tabs(props: Props) { } return ( -
+
*/}
-
-
+
+

or continue with

-
+
{/* diff --git a/apps/www/components/AuthWidget/AuthWidget.tsx b/apps/www/components/AuthWidget/AuthWidget.tsx index 87aa96947cf..d1d35e0fce4 100644 --- a/apps/www/components/AuthWidget/AuthWidget.tsx +++ b/apps/www/components/AuthWidget/AuthWidget.tsx @@ -45,7 +45,7 @@ function AuthPage() { return ( -
+

ReactJS Auth Widget

@@ -56,9 +56,9 @@ function AuthPage() {
-
+
-
+
diff --git a/apps/www/components/Blog/BlogHeader.tsx b/apps/www/components/Blog/BlogHeader.tsx index c1c494969c0..23bf06073f1 100644 --- a/apps/www/components/Blog/BlogHeader.tsx +++ b/apps/www/components/Blog/BlogHeader.tsx @@ -6,7 +6,7 @@ interface Props { export default function BlogHeader({ title }: Props) { return ( -
+

diff --git a/apps/www/components/Blog/BlogListItem.tsx b/apps/www/components/Blog/BlogListItem.tsx index b1a70d0abce..e68dee9049d 100644 --- a/apps/www/components/Blog/BlogListItem.tsx +++ b/apps/www/components/Blog/BlogListItem.tsx @@ -25,11 +25,11 @@ const BlogListItem = ({ post }: Props) => { return (
-
+
{ : `/images/blog/${post.thumb}` } objectFit="cover" - className="duration-100 ease-in transform scale-100 group-hover:scale-105" + className="scale-100 transform duration-100 ease-in group-hover:scale-105" />
-

{post.title}

- {post.date &&

{post.date}

} -

{post.description}

+

{post.title}

+ {post.date &&

{post.date}

} +

{post.description}

{author.map((author: any) => { return ( -
+
{author.author_image_url && ( {

What can you build with supabase?

There are many example apps and starter projects to get going

-
+
-
+
{Examples.slice(0, 6).map((example, i) => { return (
{ diff --git a/apps/www/components/CaseStudies/index.tsx b/apps/www/components/CaseStudies/index.tsx index 5093d3ecc36..4dc45f45fd2 100644 --- a/apps/www/components/CaseStudies/index.tsx +++ b/apps/www/components/CaseStudies/index.tsx @@ -20,7 +20,7 @@ const CaseStudies = () => { } />
-
+
{CaseStudiesData.map((caseStudy, idx: number) => ( {!props.hideCopy && props.children ? ( -
+
diff --git a/apps/www/components/EnterpriseContactForm.tsx b/apps/www/components/EnterpriseContactForm.tsx index af4c80eda3a..9d2176d451c 100644 --- a/apps/www/components/EnterpriseContactForm.tsx +++ b/apps/www/components/EnterpriseContactForm.tsx @@ -139,7 +139,7 @@ const EnterpriseContactForm = () => { />
-
+
) diff --git a/apps/www/components/ExampleCard.tsx b/apps/www/components/ExampleCard.tsx index ffa7ed10284..64bc41ceb32 100644 --- a/apps/www/components/ExampleCard.tsx +++ b/apps/www/components/ExampleCard.tsx @@ -5,15 +5,15 @@ function ExampleCard(props: any) { return ( <>
@@ -23,9 +23,9 @@ function ExampleCard(props: any) { {props.author - {props.author} + {props.author}
@@ -35,15 +35,15 @@ function ExampleCard(props: any) { className=" bg-scale-100 dark:bg-scale-400 - border border-scale-400 - border-b border-r border-l border-t-0 - p-5 - flex flex-col justify-between - rounded rounded-t-none" + border-scale-400 flex + flex-col justify-between rounded rounded-t-none + border + border-b border-r border-l + border-t-0 p-5" > {props.repo_name} @@ -53,7 +53,7 @@ function ExampleCard(props: any) { -
+
{props.vercel_deploy_url && ( diff --git a/apps/www/components/FeatureColumn.tsx b/apps/www/components/FeatureColumn.tsx index 745f97561bc..e7607c9d253 100644 --- a/apps/www/components/FeatureColumn.tsx +++ b/apps/www/components/FeatureColumn.tsx @@ -1,8 +1,8 @@ function FeatureColumn({ icon, title, text }: any) { return ( <> - {icon &&
{icon}
} -

{title}

+ {icon &&
{icon}
} +

{title}

{text}

) diff --git a/apps/www/components/Features/index.tsx b/apps/www/components/Features/index.tsx index 21dbc854381..3687e6bb269 100644 --- a/apps/www/components/Features/index.tsx +++ b/apps/www/components/Features/index.tsx @@ -10,10 +10,10 @@ const Features = () => { const IconSections = Object.values(Solutions).map((solution: any) => { const { name, description, icon, label, url } = solution return ( -
+
-
{name}
+
{name}

{description}

@@ -29,9 +29,9 @@ const Features = () => { }) return ( - +

Build faster and focus on your products

-
+
{IconSections}
diff --git a/apps/www/components/FloatingIcons/FloatingIcons.module.css b/apps/www/components/FloatingIcons/FloatingIcons.module.css index 9c8c30e4398..7345dcc4a98 100644 --- a/apps/www/components/FloatingIcons/FloatingIcons.module.css +++ b/apps/www/components/FloatingIcons/FloatingIcons.module.css @@ -1,35 +1,35 @@ .icon-react-one { - @apply absolute w-20 z-10; + @apply absolute z-10 w-20; right: 13%; top: 8%; } .icon-electron { - @apply absolute w-16 z-0; + @apply absolute z-0 w-16; left: 17%; top: 25%; } .icon-vue { - @apply absolute w-16 z-10; + @apply absolute z-10 w-16; right: 33%; top: 3%; } .icon-angular { - @apply absolute w-12 z-10; + @apply absolute z-10 w-12; right: 21%; top: 28%; } .icon-flutter { - @apply absolute w-16 z-10; + @apply absolute z-10 w-16; left: 5%; top: 15%; } .icon-nuxt { - @apply absolute w-12 z-10; + @apply absolute z-10 w-12; right: 5%; top: 28%; } .icon-redwood { - @apply absolute w-14 z-10; + @apply absolute z-10 w-14; /* background-color: yellow; */ left: 15%; top: 5%; diff --git a/apps/www/components/FloatingIcons/FloatingIcons.tsx b/apps/www/components/FloatingIcons/FloatingIcons.tsx index d5d95f60697..b0e6aa6ffba 100644 --- a/apps/www/components/FloatingIcons/FloatingIcons.tsx +++ b/apps/www/components/FloatingIcons/FloatingIcons.tsx @@ -7,8 +7,8 @@ function FloatingIcons() { const { basePath } = useRouter() return ( -
-
+
+ -
+
{FooterLinks.map((segment: any) => { return ( -
+
© Supabase Inc
diff --git a/apps/www/components/Hero.tsx b/apps/www/components/Hero.tsx index 516d79c7c8d..807149110cb 100644 --- a/apps/www/components/Hero.tsx +++ b/apps/www/components/Hero.tsx @@ -13,22 +13,22 @@ const Hero = () => {
-
+

The Open Source - Firebase Alternative + Firebase Alternative

@@ -38,7 +38,7 @@ const Hero = () => {

-
+
-
-
-
-
-
-
+
+
+
+
+
+