From 09ad3dd4829bcd44e17f2e50f396536d189fe6a0 Mon Sep 17 00:00:00 2001
From: AlexCode-dot <alle7000.andersson@gmail.com>
Date: Wed, 4 Jun 2025 12:25:38 +0200
Subject: [PATCH] fix(screening/admin) - Filter out expired screening for
 detailed moviepage - Added user feedback on admin data

---
 src/app/admin/page.jsx                 |  6 +++++-
 src/app/movies/[id]/page.jsx           |  4 ++--
 src/components/MovieDetailCard.jsx     |  6 +++++-
 src/components/admin/AdminList.jsx     | 14 ++++++++++++--
 src/components/admin/AdminRoomList.jsx | 11 +++++++++--
 src/hooks/useAdminData.js              |  8 +++++---
 src/lib/db/screeningDbService.js       |  6 ++++++
 src/styles/admin/AdminPage.scss        | 14 ++++++++++++++
 8 files changed, 58 insertions(+), 11 deletions(-)

diff --git a/src/app/admin/page.jsx b/src/app/admin/page.jsx
index 4f3ea63..4a61174 100644
--- a/src/app/admin/page.jsx
+++ b/src/app/admin/page.jsx
@@ -38,6 +38,7 @@ export default function AdminPanel() {
     roomError,
     setRoomError,
     confirmDeleteRoom,
+    loading,
   } = useAdminData()
 
   return (
@@ -56,12 +57,14 @@ export default function AdminPanel() {
                 screenings={screenings}
                 onDeleteMovie={confirmDeleteMovie}
                 onDeleteScreening={confirmDeleteScreening}
+                loading={loading}
               />
               <ErrorMessage message={deleteError} onClose={() => setDeleteError(null)} />
             </section>
 
             <section className="admin-page__section">
-              <AdminRoomList rooms={rooms} onDeleteRoom={confirmDeleteRoom} />
+              <h3 className="admin-room__list-title">Alla salonger</h3>
+              <AdminRoomList rooms={rooms} onDeleteRoom={confirmDeleteRoom} loading={loading} />
               <ErrorMessage message={roomError} onClose={() => setRoomError(null)} />
             </section>
           </>
@@ -111,6 +114,7 @@ export default function AdminPanel() {
             </section>
 
             <section className="admin-page__section">
+              <h3 className="admin-room__list-title">Alla salonger</h3>
               <AdminRoomList rooms={rooms} onDeleteRoom={confirmDeleteRoom} />
               <ErrorMessage message={roomError} onClose={() => setRoomError(null)} />
             </section>
diff --git a/src/app/movies/[id]/page.jsx b/src/app/movies/[id]/page.jsx
index 88ec342..17c7293 100644
--- a/src/app/movies/[id]/page.jsx
+++ b/src/app/movies/[id]/page.jsx
@@ -1,7 +1,7 @@
 import mongoose from 'mongoose'
 import MovieDetailCard from '@/components/MovieDetailCard'
 import { findMovieById } from '@/lib/db/movieDbService'
-import { getAllScreeningsWithMovieInfo } from '@/lib/db/screeningDbService'
+import { getActiveScreeningsWithMovieInfo } from '@/lib/db/screeningDbService'
 import { notFound } from 'next/navigation'
 import { translatePlot } from '@/lib/services/translateApiService'
 
@@ -25,7 +25,7 @@ export default async function MovieDetailPage({ params }) {
     : 'Ursäkta, ingen filmbeskrivning finns tillgänglig just nu.'
 
   //filter screenings for only one specific movie and group them by date
-  const allScreenings = await getAllScreeningsWithMovieInfo()
+  const allScreenings = await getActiveScreeningsWithMovieInfo()
   const screenings = allScreenings
     .filter((s) => s.movie._id.toString() === movieId)
     .reduce((acc, curr) => {
diff --git a/src/components/MovieDetailCard.jsx b/src/components/MovieDetailCard.jsx
index ab08efe..06fa761 100644
--- a/src/components/MovieDetailCard.jsx
+++ b/src/components/MovieDetailCard.jsx
@@ -51,7 +51,11 @@ export default function MovieDetailCard({
           {/*Booking tickets*/}
           <div className={styles.booking}>
             <div className={styles['booking-header']}>Boka biljetter</div>
-            <ShowtimesTabs screenings={screenings} />
+            {screenings.length > 0 ? (
+              <ShowtimesTabs screenings={screenings} />
+            ) : (
+              <p className={styles.noScreenings}>Inga kommande visningar tillgängliga just nu.</p>
+            )}
           </div>
         </div>
       </div>
diff --git a/src/components/admin/AdminList.jsx b/src/components/admin/AdminList.jsx
index c25b6c4..49b830e 100644
--- a/src/components/admin/AdminList.jsx
+++ b/src/components/admin/AdminList.jsx
@@ -3,9 +3,17 @@
 import { useAdminList } from '@/hooks/useAdminList'
 import { formatTime, formatDate, formatDateTime } from '@/lib/utils/formatDateTime'
 
-export default function AdminList({ movies, screenings, onDeleteMovie, onDeleteScreening }) {
+export default function AdminList({ movies, screenings, onDeleteMovie, onDeleteScreening, loading }) {
   const { isExpanded, toggle } = useAdminList()
 
+  if (loading) {
+    return <p className="admin-page__loading">Laddar filmer...</p>
+  }
+
+  if (movies.length === 0) {
+    return <p className="admin-page__empty">Inga filmer tillgängliga</p>
+  }
+
   return (
     <ul className="admin-list">
       {movies.map((movie) => {
@@ -34,7 +42,9 @@ export default function AdminList({ movies, screenings, onDeleteMovie, onDeleteS
                     return (
                       <li
                         key={screening._id}
-                        className={`admin-list__screening ${isExpired ? 'admin-list__screening--expired' : 'admin-list__screening--active'}`}
+                        className={`admin-list__screening ${
+                          isExpired ? 'admin-list__screening--expired' : 'admin-list__screening--active'
+                        }`}
                       >
                         <span className="admin-list__screening-info">
                           {formatTime(screening.date)} – {formatTime(screening.endTime)} ({formatDate(screening.date)})
diff --git a/src/components/admin/AdminRoomList.jsx b/src/components/admin/AdminRoomList.jsx
index 7eed93d..0dd0a11 100644
--- a/src/components/admin/AdminRoomList.jsx
+++ b/src/components/admin/AdminRoomList.jsx
@@ -3,12 +3,19 @@
 import { useState } from 'react'
 import AdminRoomModal from './AdminRoomModal'
 
-export default function AdminRoomList({ rooms, onDeleteRoom }) {
+export default function AdminRoomList({ rooms, onDeleteRoom, loading }) {
   const [selectedRoom, setSelectedRoom] = useState(null)
 
+  if (loading) {
+    return <p className="admin-page__loading">Laddar salonger...</p>
+  }
+
+  if (rooms.length === 0) {
+    return <p className="admin-page__empty">Inga salonger tillgängliga</p>
+  }
+
   return (
     <div className="admin-room__list">
-      <h3 className="admin-room__list-title">Alla salonger</h3>
       <ul>
         {rooms.map((room) => (
           <li key={room._id} className="admin-room__item">
diff --git a/src/hooks/useAdminData.js b/src/hooks/useAdminData.js
index e9ea133..585eee1 100644
--- a/src/hooks/useAdminData.js
+++ b/src/hooks/useAdminData.js
@@ -13,11 +13,12 @@ export function useAdminData() {
   const [deleteError, setDeleteError] = useState(null)
   const [rooms, setRooms] = useState([])
   const [roomError, setRoomError] = useState(null)
+  const [loading, setLoading] = useState(true)
 
   useEffect(() => {
-    loadMovies()
-    loadScreenings()
-    loadRooms()
+    Promise.all([loadMovies(), loadScreenings(), loadRooms()]).finally(() => {
+      setLoading(false)
+    })
   }, [])
 
   const loadMovies = async () => {
@@ -140,5 +141,6 @@ export function useAdminData() {
     roomError,
     setRoomError,
     confirmDeleteRoom,
+    loading,
   }
 }
diff --git a/src/lib/db/screeningDbService.js b/src/lib/db/screeningDbService.js
index 7d2ecc6..5d3bff2 100644
--- a/src/lib/db/screeningDbService.js
+++ b/src/lib/db/screeningDbService.js
@@ -9,6 +9,12 @@ export async function getAllScreeningsWithMovieInfo() {
   return await Screening.find().populate('movie', 'title runtime').populate('room', 'name').lean()
 }
 
+export async function getActiveScreeningsWithMovieInfo() {
+  await markExpiredScreenings()
+
+  return await Screening.find({ status: 'active' }).populate('movie', 'title runtime').populate('room', 'name').lean()
+}
+
 export async function getUpcomingScreenings() {
   const today = new Date()
   const fiveDaysFromNow = new Date(today)
diff --git a/src/styles/admin/AdminPage.scss b/src/styles/admin/AdminPage.scss
index 51bbd0b..6bcebd0 100644
--- a/src/styles/admin/AdminPage.scss
+++ b/src/styles/admin/AdminPage.scss
@@ -57,4 +57,18 @@
       cursor: pointer;
     }
   }
+
+  &__loading {
+    text-align: center;
+    color: #1b3a57;
+    font-weight: bold;
+    font-size: 1.3rem;
+  }
+
+  &__empty {
+    text-align: center;
+    color: #1b3a57;
+    font-weight: bold;
+    font-size: 1.3rem;
+  }
 }