Skip to content

Commit

Permalink
feat(core): server actions
Browse files Browse the repository at this point in the history
move to server actions and new auth helpers

BREAKING CHANGE: implicit auth -> pkce
  • Loading branch information
imbhargav5 committed Jul 31, 2023
1 parent bd1b249 commit 4bc69f6
Show file tree
Hide file tree
Showing 79 changed files with 2,878 additions and 182,922 deletions.
26 changes: 18 additions & 8 deletions .eslintrc.cjs
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,9 @@ module.exports = {
},
plugins: ['@typescript-eslint', 'prettier'],
rules: {
'prettier/prettier': 'error',
'prettier/prettier': 1,
},
files: [
'src/**/*.ts',
'src/**/*.tsx',
'emails/**/*.ts',
'emails/**/*.tsx',
],
files: ['src/**/*.ts', 'src/**/*.tsx'],
},
{
extends: [
Expand All @@ -38,8 +33,8 @@ module.exports = {
},
plugins: [
'@typescript-eslint',
'prettier',
'plugin:playwright/playwright-test',
'prettier',
],
rules: {
'prettier/prettier': 'error',
Expand All @@ -51,11 +46,26 @@ module.exports = {
files: '*.mjs',
rules: ruleOverrides,
},
// make nextconfig.mjs node environment
{
extends: ['eslint:recommended', 'prettier', 'node'],
files: 'next.config.mjs',
rules: ruleOverrides,
},
{
extends: ['prettier'],
files: '*.js',
rules: ruleOverrides,
},
{
extends: ['prettier'],
files: '*.cjs',
rules: ruleOverrides,
parserOptions: {
ecmaVersion: 2020,
sourceType: 'module',
},
},
],
root: true,
};
1 change: 0 additions & 1 deletion next-env.d.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
/// <reference types="next/navigation-types/navigation" />

// NOTE: This file should not be edited
// see https://nextjs.org/docs/basic-features/typescript for more information.
1 change: 1 addition & 0 deletions next.config.mjs
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
export default {
experimental: {
appDir: true,
serverActions: true,
},
images: {
remotePatterns: [
Expand Down
23 changes: 20 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,17 +24,33 @@
"@commitlint/config-conventional": "^17.4.4",
"@headlessui/react": "^1.7.11",
"@heroicons/react": "^2.0.16",
"@supabase/auth-helpers-nextjs": "^0.5.4",
"@radix-ui/react-context-menu": "^2.1.3",
"@radix-ui/react-dialog": "^1.0.2",
"@radix-ui/react-dropdown-menu": "^2.0.2",
"@radix-ui/react-hover-card": "^1.0.5",
"@radix-ui/react-label": "^2.0.0",
"@radix-ui/react-navigation-menu": "^1.1.1",
"@radix-ui/react-popover": "^1.0.5",
"@radix-ui/react-select": "^1.2.0",
"@radix-ui/react-slider": "^1.1.1",
"@radix-ui/react-switch": "^1.0.2",
"@supabase/auth-helpers-nextjs": "^0.7.3",
"@supabase/auth-helpers-react": "^0.3.1",
"@supabase/supabase-js": "^2.8.0",
"@supabase/supabase-js": "^2.31.0",
"@tailwindcss/typography": "^0.5.9",
"@tanstack/react-query": "^4.24.10",
"next": "^13.2.1",
"class-variance-authority": "^0.7.0",
"clsx": "^2.0.0",
"lucide-react": "0.206.0",
"next": "^13.4.12",
"next-seo": "^5.15.0",
"next-sitemap": "^3.1.52",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-hot-toast": "^2.4.0",
"tailwind-merge": "^1.14.0",
"tailwindcss": "^3.2.7",
"tailwindcss-animate": "^1.0.6",
"url-join": "^5.0.0"
},
"devDependencies": {
Expand All @@ -56,6 +72,7 @@
"env-cmd": "^10.1.0",
"eslint": "^8.34.0",
"eslint-config-esnext": "^4.1.0",
"eslint-config-node": "^4.1.0",
"eslint-config-prettier": "^8.6.0",
"eslint-plugin-import": "^2.27.5",
"eslint-plugin-playwright": "^0.12.0",
Expand Down
8 changes: 1 addition & 7 deletions src/app/ItemsList.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,8 @@
'use client';
import { Table } from '@/types';
import Link from 'next/link';
import { useItems } from './utils/react-query-hooks';

export const ItemsList = ({
initialItems,
}: {
initialItems: Table<'items'>[];
}) => {
const { data: items } = useItems(initialItems);
export const ItemsList = ({ items }: { items: Table<'items'>[] }) => {
return (
<div className="space-y-8">
<div className="flex justify-between items-baseline">
Expand Down
48 changes: 48 additions & 0 deletions src/app/actions.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
'use server';

import { createSupabaseServerActionClient } from '@/supabase-clients/createSupabaseServerActionClient';
import {
deleteItem,
getAllItems,
getItem,
insertItem,
updateItem,
} from '../utils/supabase-queries';
import { revalidatePath } from 'next/cache';

export async function insertItemAction(payload: {
name: string;
description: string;
}) {
const supabaseClient = createSupabaseServerActionClient();
const data = await insertItem(supabaseClient, payload);
revalidatePath('/');
return data.id;
}

export async function getAllItemsAction() {
const supabaseClient = createSupabaseServerActionClient();
return await getAllItems(supabaseClient);
}

export async function getItemAction(id: string) {
const supabaseClient = createSupabaseServerActionClient();
return await getItem(supabaseClient, id);
}

export async function updateItemAction(payload: {
id: string;
name: string;
description: string;
}) {
const supabaseClient = createSupabaseServerActionClient();
const data = await updateItem(supabaseClient, payload);
revalidatePath('/');
return data;
}

export const deleteItemAction = async (id: string) => {
const supabaseClient = createSupabaseServerActionClient();
await deleteItem(supabaseClient, id);
revalidatePath('/');
};
80 changes: 79 additions & 1 deletion src/app/globals.css
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

html,
body {
Expand All @@ -14,7 +15,6 @@ body {
width: 100%;
}

@tailwind utilities;

.swiper {
width: 640px;
Expand All @@ -29,3 +29,81 @@ body {
font-weight: bold;

}

@layer base {
:root {
--background: 0 0% 100%;
--foreground: 222.2 47.4% 11.2%;

--muted: 210 40% 96.1%;
--muted-foreground: 215.4 16.3% 46.9%;

--popover: 0 0% 100%;
--popover-foreground: 222.2 47.4% 11.2%;

--border: 214.3 31.8% 91.4%;
--input: 214.3 31.8% 91.4%;

--card: 0 0% 100%;
--card-foreground: 222.2 47.4% 11.2%;

--primary: 222.2 47.4% 11.2%;
--primary-foreground: 210 40% 98%;

--secondary: 210 40% 96.1%;
--secondary-foreground: 222.2 47.4% 11.2%;

--accent: 210 40% 96.1%;
--accent-foreground: 222.2 47.4% 11.2%;

--destructive: 0 100% 50%;
--destructive-foreground: 210 40% 98%;

--ring: 215 20.2% 65.1%;

--radius: 0.5rem;
}

.dark {
--background: 224 71% 4%;
--foreground: 213 31% 91%;

--muted: 223 47% 11%;
--muted-foreground: 215.4 16.3% 56.9%;

--accent: 216 34% 17%;
--accent-foreground: 210 40% 98%;

--popover: 224 71% 4%;
--popover-foreground: 215 20.2% 65.1%;

--border: 216 34% 17%;
--input: 216 34% 17%;

--card: 224 71% 4%;
--card-foreground: 213 31% 91%;

--primary: 210 40% 98%;
--primary-foreground: 222.2 47.4% 1.2%;

--secondary: 222.2 47.4% 11.2%;
--secondary-foreground: 210 40% 98%;

--destructive: 0 63% 31%;
--destructive-foreground: 210 40% 98%;

--ring: 216 34% 17%;

--radius: 0.5rem;
}
}

@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
font-feature-settings: "rlig" 1, "calt" 1;
}
}
27 changes: 0 additions & 27 deletions src/app/item/ItemIdLayoutContext.tsx

This file was deleted.

93 changes: 93 additions & 0 deletions src/app/item/[itemId]/ConfirmDeleteItemDialog.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
'use client';
import { Button } from '@/components/ui/Button';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from '@/components/ui/Dialog';
import { useMutation } from '@tanstack/react-query';
import { useRouter } from 'next/navigation';
import { useRef, useState } from 'react';
import { toast } from 'react-hot-toast';
import Trash from 'lucide-react/dist/esm/icons/trash';

type Props = {
itemId: string;
deleteItemAction: (itemId: string) => Promise<void>;
};

export const ConfirmDeleteItemDialog = ({
itemId,
deleteItemAction,
}: Props) => {
const [open, setOpen] = useState(false);
const toastRef = useRef<string | null>(null);
const router = useRouter();
const { mutate, isLoading } = useMutation(
async (id: string) => {
return deleteItemAction(id);
},
{
onMutate: () => {
const toastId = toast.loading('Deleting item');
toastRef.current = toastId;
},
onSuccess: () => {
toast.success('Item deleted', { id: toastRef.current });
toastRef.current = null;
router.refresh();
router.push('/');
},
onError: () => {
toast.error('Failed to delete item', { id: toastRef.current });
toastRef.current = null;
},
onSettled: () => {
setOpen(false);
},
}
);
return (
<Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild>
<Button variant="destructive">
<Trash className="mr-1" /> Delete Item
</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<DialogTitle>Delete Item</DialogTitle>
<DialogDescription>
Are you sure you want to delete this item?
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button
type="button"
variant="destructive"
disabled={isLoading}
onClick={() => {
mutate(itemId);
}}
>
{isLoading ? `Deleting item...` : `Yes, delete`}
</Button>
<Button
disabled={isLoading}
type="button"
variant="outline"
onClick={() => {
setOpen(false);
}}
>
Cancel
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
);
};
Loading

0 comments on commit 4bc69f6

Please sign in to comment.