🚧 replacing api in frontend

Co-authored-by: haraldnilsen <harald_998@hotmail.com>

backend/Program.cs

@@ -11,6 +11,18 @@ var builder = WebApplication.CreateBuilder(args);
 // Add services to the container.
 
 builder.Services.AddControllers();
+
+var  MyAllowSpecificOrigins = "_myAllowSpecificOrigins";
+
+builder.Services.AddCors(options =>
+{
+    options.AddPolicy(name: MyAllowSpecificOrigins,
+                      policy  =>
+                      {
+                          policy.WithOrigins("http://localhost:5173");
+                      });
+});
+
 // Learn more about configuring Swagger/OpenAPI at https://aka.ms/aspnetcore/swashbuckle
 builder.Services.AddEndpointsApiExplorer();
 builder.Services.AddSwaggerGen();
@@ -50,6 +62,8 @@ if (app.Environment.IsDevelopment())
 
 app.UseHttpsRedirection();
 
+app.UseCors(MyAllowSpecificOrigins);
+
 app.UseAuthorization();
 
 app.MapControllers();

frontend/src/App.tsx

@@ -16,8 +16,8 @@ function App() {
   const [modalMovie, setModalMovie] = useState<movieObject | null>(null)
   const navigateToPage = useNavigateToPage()
   const searchParams = new URLSearchParams(window.location.search)
-  const [movieTitle, setMovieTitle] = useState(searchParams.get('title') || '')
+  const [movieTitle, setMovieTitle] = useState(searchParams.get('s') || '')
-  const [movieYear, setMovieYear] = useState(searchParams.get('year') || '')
+  const [movieYear, setMovieYear] = useState(searchParams.get('y') || '')
   const [movieType, setMovieType] = useState(searchParams.get('type') || '')
   const [sortAscending, setSortAscending] = useState(true)
   const location = useLocation()
@@ -34,10 +34,10 @@ function App() {
       }
     }
     const searchParams = new URLSearchParams(location.search)
-    const title = searchParams.get('title') || ''
+    const title = searchParams.get('s') || ''
     const page = searchParams.get('page') || ''
     const type = searchParams.get('type') || ''
-    const year = searchParams.get('year') || ''
+    const year = searchParams.get('y') || ''
 
     if (title) {
       handleFetchMovie()
@@ -63,14 +63,14 @@ function App() {
   const sortHandler = (sortType: string) => {
     let sortedMovies: movieObject[] = []
 
-    if (sortType === 'title') {
+    if (sortType === 's') {
       sortedMovies = [...movies].sort((m1, m2) =>
         sortAscending
           ? m1.Title.localeCompare(m2.Title)
           : m2.Title.localeCompare(m1.Title)
       )
     }
-    if (sortType === 'year') {
+    if (sortType === 'y') {
       sortedMovies = [...movies].sort((m1, m2) =>
         sortAscending
           ? m1.Year.localeCompare(m2.Year)

frontend/src/api/fetchMovie.ts

@@ -1,6 +1,6 @@
 import { movieResponse } from '../types/movie'
 
-const API_MOVIE_KEY = import.meta.env.VITE_MOVIE_API_KEY
+//const API_MOVIE_KEY = import.meta.env.VITE_MOVIE_API_KEY
 
 export const fetchMovie = async (
   title: string,
@@ -8,7 +8,7 @@ export const fetchMovie = async (
   type?: string,
   year?: string
 ): Promise<movieResponse> => {
-  let query = `http://www.omdbapi.com/?apikey=${API_MOVIE_KEY}&s=${title}&page=${page}`
+  let query = `http://localhost:5212/movie?s=${title}&page=${page}`
 
   if (type) query += `&type=${type}`
   if (year) query += `&y=${year}`

frontend/src/util/navigate.ts

@@ -8,10 +8,10 @@ export const useNavigateToPage = () => {
       navigate('')
       window.location.reload()
     } else {
-      let query = `?title=${title}&page=${page}`
+      let query = `?s=${title}&page=${page}`
 
       if (type) query += `&type=${type}`
-      if (year) query += `&year=${year}`
+      if (year) query += `&y=${year}`
 
       navigate(query)
     }