adds prod container and fixes build issues

backend/playlist/views/api/profile.py

@@ -4,7 +4,15 @@ from rest_framework.views import APIView
 from rest_framework.response import Response
 from playlist.serializers import ProfileSerializer, ProfileUpdateSerializer, BackgroundSerializer
 from playlist.models import Profile, Background
+from drf_spectacular.utils import extend_schema
 
+@extend_schema(
+    summary="Get the current user's profile",
+    description="Retrieve the profile information of the currently authenticated user.",
+    responses={
+        200: ProfileSerializer,
+    },
+)
 class ProfileMeView(APIView):
     def get(self, request):
         profile = request.user.profile

backend/playlist/views/api/user.py

@@ -2,7 +2,9 @@ from rest_framework.views import APIView
 from rest_framework.response import Response
 from django.contrib.auth.models import User
 from playlist.serializers import UserSerializer
+from drf_spectacular.utils import extend_schema
 
+@extend_schema(responses={200: UserSerializer})
 class UserListView(APIView):
     def get(self, request):
         users = User.objects.all()

docker-compose.yml

@@ -20,6 +20,16 @@ services:
       - "3001:3000"
     networks:
       - app_network
+  prod:
+    image: node:20
+    working_dir: /app/frontend
+    volumes:
+      - ./frontend:/app/frontend
+    command: sh -c "npm install && npx next build && npx next start"
+    ports:
+      - "3003:3000"
+    networks:
+      - app_network
 
 networks:
   app_network:

frontend/src/app/users/page.tsx

@@ -9,7 +9,7 @@ export default function Page() {
   useEffect(() => {
     async function getUsers() {
       const { data: users } = await api.users.list({});
-      setUserData(users);
+      setUserData(Array.isArray(users) ? users : [users]);
     }
     getUsers();
   }, []);

frontend/src/components/Quota.tsx

@@ -18,7 +18,7 @@ export default function Quota({
   async function getProfile() {
     if (!auth.isLoading && !auth.error && auth.isAuthenticated) {
       const { data: profile } = await api?.profiles?.me({});
-      setQuota(profile?.quota);
+      setQuota((profile as Profile)?.quota);
     }
   }
   useEffect(() => {

frontend/src/data/fetcher.ts

@@ -4,7 +4,8 @@ import { getUser } from "./fetch";
 import { paths, components } from "muzak/data/types";
 
 const fetcher = Fetcher.for<paths>();
-const BASE_URL = process.env.BACKEND_HOST!;
+const BASE_URL = process.env.NEXT_PUBLIC_BACKEND_HOST!;
+console.log("beest url", BASE_URL);
 
 // Configure the fetcher
 fetcher.configure({
@@ -19,7 +20,7 @@ fetcher.configure({
     async (url, init, next) => {
       const user = getUser();
       if (user?.access_token) {
-        init.headers = {
+        (init.headers as any) = {
           ...init.headers,
           Authorization: `Bearer ${user.access_token}`,
           "Content-Type": "application/json",
@@ -76,7 +77,6 @@ export const api = {
 export type User = components["schemas"]["User"];
 export type Track = components["schemas"]["Track"];
 export type Album = components["schemas"]["Album"];
-export type Vote = components["schemas"]["Vote"];
 export type Profile = components["schemas"]["Profile"];
 
 export default api;