feat/add-products-api

app/api/product-categories/route.ts

@@ -0,0 +1,76 @@
+import { NextResponse } from 'next/server';
+
+export async function GET(request: Request) {
+  try {
+    // Get the authorization header from the incoming request
+    const authHeader = request.headers.get('authorization');
+
+    const headers: HeadersInit = {
+      'Content-Type': 'application/json',
+    };
+
+    // Add the authorization header if it exists
+    if (authHeader) {
+      headers['Authorization'] = authHeader;
+    }
+
+    const response = await fetch(
+      process.env.NEXT_PUBLIC_API_URL + '/api/product-categories',
+      {
+        method: 'GET',
+        headers,
+      },
+    );
+
+    const data = await response.json();
+    return NextResponse.json(data);
+  } catch (error) {
+    return NextResponse.json(
+      { error: 'Failed to fetch product categories' },
+      { status: 500 },
+    );
+  }
+}
+
+export async function POST(request: Request) {
+  try {
+    const body = await request.json();
+
+    // Get the authorization header from the incoming request
+    const authHeader = request.headers.get('authorization');
+
+    const headers: HeadersInit = {
+      'Content-Type': 'application/json',
+    };
+
+    // Add the authorization header if it exists
+    if (authHeader) {
+      headers['Authorization'] = authHeader;
+    }
+
+    const response = await fetch(
+      process.env.NEXT_PUBLIC_API_URL + '/api/product-categories',
+      {
+        method: 'POST',
+        headers,
+        body: JSON.stringify(body),
+      },
+    );
+
+    const data = await response.json();
+
+    if (!response.ok) {
+      return NextResponse.json(
+        { error: 'Failed to create product category', details: data },
+        { status: response.status },
+      );
+    }
+
+    return NextResponse.json(data);
+  } catch (error) {
+    return NextResponse.json(
+      { error: 'Failed to create product category' },
+      { status: 500 },
+    );
+  }
+}

app/api/products/route.ts

@@ -0,0 +1,76 @@
+import { NextResponse } from 'next/server';
+
+export async function GET(request: Request) {
+  try {
+    // Get the authorization header from the incoming request
+    const authHeader = request.headers.get('authorization');
+
+    const headers: HeadersInit = {
+      'Content-Type': 'application/json',
+    };
+
+    // Add the authorization header if it exists
+    if (authHeader) {
+      headers['Authorization'] = authHeader;
+    }
+
+    const response = await fetch(
+      process.env.NEXT_PUBLIC_API_URL + '/api/products',
+      {
+        method: 'GET',
+        headers,
+      },
+    );
+
+    const data = await response.json();
+    return NextResponse.json(data);
+  } catch (error) {
+    return NextResponse.json(
+      { error: 'Failed to fetch products' },
+      { status: 500 },
+    );
+  }
+}
+
+export async function POST(request: Request) {
+  try {
+    const body = await request.json();
+
+    // Get the authorization header from the incoming request
+    const authHeader = request.headers.get('authorization');
+
+    const headers: HeadersInit = {
+      'Content-Type': 'application/json',
+    };
+
+    // Add the authorization header if it exists
+    if (authHeader) {
+      headers['Authorization'] = authHeader;
+    }
+
+    const response = await fetch(
+      process.env.NEXT_PUBLIC_API_URL + '/api/products',
+      {
+        method: 'POST',
+        headers,
+        body: JSON.stringify(body),
+      },
+    );
+
+    const data = await response.json();
+
+    if (!response.ok) {
+      return NextResponse.json(
+        { error: 'Failed to create product', details: data },
+        { status: response.status },
+      );
+    }
+
+    return NextResponse.json(data);
+  } catch (error) {
+    return NextResponse.json(
+      { error: 'Failed to create product' },
+      { status: 500 },
+    );
+  }
+}

app/apps/products/categories/components/NewCategoryDrawerProps.tsx

@@ -0,0 +1,118 @@
+'use client';
+
+import { useState } from 'react';
+
+import {
+  Button,
+  Drawer,
+  DrawerProps,
+  LoadingOverlay,
+  Stack,
+  TextInput,
+  Textarea,
+} from '@mantine/core';
+import { isNotEmpty, useForm } from '@mantine/form';
+import { notifications } from '@mantine/notifications';
+
+import { useAuth } from '@/hooks/useAuth';
+
+type NewCategoryDrawerProps = Omit<DrawerProps, 'title' | 'children'> & {
+  onCategoryCreated?: () => void;
+};
+
+export const NewCategoryDrawer = ({
+  onCategoryCreated,
+  ...drawerProps
+}: NewCategoryDrawerProps) => {
+  const { user, accessToken } = useAuth();
+  const [loading, setLoading] = useState(false);
+
+  const form = useForm({
+    mode: 'controlled',
+    initialValues: {
+      title: '',
+      description: '',
+    },
+    validate: {
+      title: isNotEmpty('Category title cannot be empty'),
+    },
+  });
+
+  const handleSubmit = async (values: typeof form.values) => {
+    setLoading(true);
+    try {
+      const payload = {
+        ...values,
+        createdById: user?.id,
+      };
+
+      const response = await fetch('/api/product-categories', {
+        method: 'POST',
+        headers: {
+          Authorization: 'Bearer ' + accessToken,
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(payload),
+      });
+
+      const data = await response.json();
+
+      if (!response.ok) {
+        throw new Error(data.error || 'Failed to create category');
+      }
+
+      notifications.show({
+        title: 'Success',
+        message: 'Category created successfully',
+        color: 'green',
+      });
+
+      form.reset();
+
+      if (drawerProps.onClose) {
+        drawerProps.onClose();
+      }
+
+      if (onCategoryCreated) {
+        onCategoryCreated();
+      }
+    } catch (error) {
+      notifications.show({
+        title: 'Error',
+        message:
+          error instanceof Error ? error.message : 'Failed to create category',
+        color: 'red',
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Drawer {...drawerProps} title="Create a new product category">
+      <LoadingOverlay visible={loading} />
+      <form onSubmit={form.onSubmit(handleSubmit)}>
+        <Stack>
+          <TextInput
+            label="Title"
+            placeholder="Category title"
+            key={form.key('title')}
+            {...form.getInputProps('title')}
+            required
+          />
+          <Textarea
+            label="Description"
+            placeholder="Category description"
+            key={form.key('description')}
+            {...form.getInputProps('description')}
+          />
+          <Button type="submit" mt="md" loading={loading}>
+            Create Category
+          </Button>
+        </Stack>
+      </form>
+    </Drawer>
+  );
+};
+
+export default NewCategoryDrawer;