✨ error handling and new start.sh-file

Co-authored-by: Sindre Kjelsrud <kjelsrudsindre@gmail.com>

backend/start.sh

@@ -1,4 +0,0 @@
-docker-compose up -d
-
-cd cinemateket
-dotnet run

frontend/src/App.tsx

@@ -14,6 +14,7 @@ function App() {
   const [totalPages, setTotalPages] = useState(0)
   const [modalOpen, setModalOpen] = useState(false)
   const [modalMovie, setModalMovie] = useState<movieObject | null>(null)
+  const [message, setMessage] = useState('Find a list of movies by searching above ☝️')
   const navigateToPage = useNavigateToPage()
   const searchParams = new URLSearchParams(window.location.search)
   const [movieTitle, setMovieTitle] = useState(searchParams.get('s') || '')
@@ -26,6 +27,14 @@ function App() {
     const handleFetchMovie = async () => {
       const response = await fetchMovie(title, page, type, year)
       console.log(year)
+      if (response == undefined) {
+        setMovies([])
+        setTotalPages(0)
+        setCurrentPage(1)
+        setLoading(false)
+        setMessage("We unfortunately didn't have any movies matching your search 😭")
+        return
+      }
       if (response.response == 'OK') {
         setMovies(response.search)
         setTotalPages(Number(response.totalResults))
@@ -118,7 +127,7 @@ function App() {
           ) : movies.length > 0 ? (
             <MovieTable {...{ handleModalOpen, sortHandler, movies }} />
           ) : (
-            <q.h2>Find a list of movies by searching above ☝️ </q.h2>
+            <q.h2>{message}</q.h2>
           )}
         </q.div>
       </q.div>

frontend/src/api/fetchMovie.ts

@@ -8,7 +8,7 @@ export const fetchMovie = async (
   type?: string,
   year?: string
 ): Promise<movieResponse>=> {
-  let query = `http://localhost:5212/movie?s=${title}&page=${page}`
+  let query = `http://localhost:5212/movie?s=${title}&pageNumber=${page}`
 
   if (type) query += `&type=${type}`
   if (year) query += `&y=${year}`

start.sh

@@ -0,0 +1,13 @@
+# backend
+cd backend
+docker-compose up -d
+
+cd cinemateket
+dotnet run &
+
+cd ../..
+
+# frontend
+cd frontend
+npm install
+npm run dev