├── components ├── ui │ ├── Footer │ │ ├── Footer.module.css │ │ ├── index.ts │ │ └── Footer.tsx │ ├── Input │ │ ├── index.ts │ │ ├── Input.module.css │ │ └── Input.tsx │ ├── Navbar │ │ ├── index.ts │ │ ├── Navbar.module.css │ │ └── Navbar.tsx │ ├── Button │ │ ├── index.ts │ │ ├── Button.module.css │ │ └── Button.tsx │ └── Spinner │ │ ├── index.ts │ │ └── Spinner.tsx ├── icons │ ├── Logo.tsx │ └── GitHub.tsx └── Layout.tsx ├── supabase ├── .gitignore └── config.toml ├── public ├── og.png ├── demo.png ├── favicon.ico ├── vercel-deploy.png ├── stripe.svg ├── vercel.svg ├── github.svg ├── nextjs.svg ├── supabase.svg └── architecture_diagram.svg ├── styles ├── Layout.module.css ├── main.css └── chrome-bug.css ├── next-env.d.ts ├── pages ├── index.tsx ├── _document.tsx ├── _app.tsx ├── api │ └── webhook.ts ├── signin.tsx ├── account.tsx └── pricing.tsx ├── .env.local.example ├── utils ├── paddleLoader.tsx ├── constants.ts ├── helpers.ts ├── paddleApi.ts ├── supabase-client.ts └── useUser.tsx ├── .gitignore ├── tsconfig.json ├── notes.txt ├── LICENSE ├── package.json ├── types.ts ├── schema.sql └── yarn.lock /components/ui/Footer/Footer.module.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /supabase/.gitignore: -------------------------------------------------------------------------------- 1 | # Supabase 2 | .branches 3 | .temp 4 | -------------------------------------------------------------------------------- /components/ui/Input/index.ts: -------------------------------------------------------------------------------- 1 | export { default } from './Input'; 2 | -------------------------------------------------------------------------------- /components/ui/Navbar/index.ts: -------------------------------------------------------------------------------- 1 | export { default } from './Navbar' 2 | -------------------------------------------------------------------------------- /components/ui/Button/index.ts: -------------------------------------------------------------------------------- 1 | export { default } from './Button'; 2 | -------------------------------------------------------------------------------- /components/ui/Footer/index.ts: -------------------------------------------------------------------------------- 1 | export { default } from './Footer'; 2 | -------------------------------------------------------------------------------- /components/ui/Spinner/index.ts: -------------------------------------------------------------------------------- 1 | export { default } from './Spinner'; 2 | -------------------------------------------------------------------------------- /public/og.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/saumya66/NextJs-Supabase-PaddleHQ-Starter/HEAD/public/og.png -------------------------------------------------------------------------------- /public/demo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/saumya66/NextJs-Supabase-PaddleHQ-Starter/HEAD/public/demo.png -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/saumya66/NextJs-Supabase-PaddleHQ-Starter/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/vercel-deploy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/saumya66/NextJs-Supabase-PaddleHQ-Starter/HEAD/public/vercel-deploy.png -------------------------------------------------------------------------------- /styles/Layout.module.css: -------------------------------------------------------------------------------- 1 | .main{ 2 | width : 100%; 3 | } 4 | 5 | @media only screen and (max-width: 600px) { 6 | 7 | } -------------------------------------------------------------------------------- /next-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | 4 | // NOTE: This file should not be edited 5 | // see https://nextjs.org/docs/basic-features/typescript for more information. 6 | -------------------------------------------------------------------------------- /components/ui/Input/Input.module.css: -------------------------------------------------------------------------------- 1 | .root { 2 | @apply bg-black py-2 px-3 w-full appearance-none transition duration-150 ease-in-out border border-zinc-500 text-zinc-200; 3 | } 4 | 5 | .root:focus { 6 | @apply outline-none; 7 | } 8 | -------------------------------------------------------------------------------- /pages/index.tsx: -------------------------------------------------------------------------------- 1 | import { Product } from 'types'; 2 | 3 | interface Props { 4 | products: Product[]; 5 | } 6 | 7 | export default function PricingPage({ products }: Props) { 8 | return( 9 | <> 10 |

yo page

11 | 12 | ) 13 | } 14 | -------------------------------------------------------------------------------- /components/ui/Spinner/Spinner.tsx: -------------------------------------------------------------------------------- 1 | import { Spinner } from '@chakra-ui/react'; 2 | 3 | const SpinnerIcon = () => { 4 | return ( 5 | 12 | ); 13 | }; 14 | 15 | export default SpinnerIcon; 16 | -------------------------------------------------------------------------------- /styles/main.css: -------------------------------------------------------------------------------- 1 | 2 | html,body { 3 | padding: 0; 4 | margin: 0; 5 | height: 100%; 6 | width: 100%; 7 | box-sizing: border-box; 8 | } 9 | 10 | html, 11 | body { 12 | font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Helvetica Neue', 13 | 'Helvetica', sans-serif; 14 | text-rendering: optimizeLegibility; 15 | -moz-osx-font-smoothing: grayscale; 16 | } 17 | 18 | -------------------------------------------------------------------------------- /styles/chrome-bug.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Chrome has a bug with transitions on load since 2012! 3 | * 4 | * To prevent a "pop" of content, you have to disable all transitions until 5 | * the page is done loading. 6 | * 7 | * https://lab.laukstein.com/bug/input 8 | * https://twitter.com/timer150/status/1345217126680899584 9 | */ 10 | body.loading * { 11 | transition: none !important; 12 | } 13 | -------------------------------------------------------------------------------- /pages/_document.tsx: -------------------------------------------------------------------------------- 1 | import Document, { Head, Html, Main, NextScript } from 'next/document'; 2 | 3 | class MyDocument extends Document { 4 | render() { 5 | return ( 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | ); 14 | } 15 | } 16 | 17 | export default MyDocument; 18 | -------------------------------------------------------------------------------- /.env.local.example: -------------------------------------------------------------------------------- 1 | # Update these with your Supabase details from your project settings > API 2 | NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co 3 | NEXT_PUBLIC_SUPABASE_ANON_KEY= 4 | SUPABASE_SERVICE_ROLE_KEY= 5 | 6 | # Update these with your Stripe credentials from https://dashboard.stripe.com/apikeys 7 | NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_1234 8 | STRIPE_SECRET_KEY=sk_test_1234 9 | STRIPE_WEBHOOK_SECRET=whsec_1234 -------------------------------------------------------------------------------- /utils/paddleLoader.tsx: -------------------------------------------------------------------------------- 1 | import Script from "next/script" 2 | 3 | export function PaddleLoader(){ 4 | return ( 5 | <> 6 |