App/vuets/reviews/fetch user details for review

client/nt.webclient/vue3withtypescript/nt/src/apiService/ApiServiceBase.ts

@@ -1,26 +1,32 @@
-import { IGraphQlResponseBase, IResponseBase } from "@/types/apirequestresponsetypes/Response";
-import { AxiosRequestConfig } from "axios";
-import HttpClient from "./HttpClient";
+import {
+  IGraphQlResponseBase,
+  IResponseBase,
+} from '@/types/apirequestresponsetypes/Response';
+import { AxiosRequestConfig } from 'axios';
+import HttpClient from './HttpClient';
 import { DocumentNode } from '@apollo/client/core';
 
+export abstract class ApiServiceBase {
+  private httpClient: HttpClient;
 
-export abstract class ApiServiceBase
-{
-    private httpClient : HttpClient;
+  constructor() {
+    this.httpClient = new HttpClient();
+  }
 
-    constructor(){
-        this.httpClient = new HttpClient();
-    }
+  protected async invoke<T extends IResponseBase>(
+    request: AxiosRequestConfig
+  ): Promise<T> {
+    return this.httpClient.invoke(request);
+  }
 
-    protected async invoke<T extends IResponseBase>(request:AxiosRequestConfig):Promise<T> {
-        return this.httpClient.invoke(request);
-    }
+  protected async getBlob<T>(request: AxiosRequestConfig): Promise<T | null> {
+    return this.httpClient.getBlob(request);
+  }
 
-    protected async getBlob<T>(request:AxiosRequestConfig):Promise<T|null> {
-        return this.httpClient.getBlob(request);
-    }
-
-    protected async queryGraphQl<T extends IGraphQlResponseBase>(query:DocumentNode,variable:object):Promise<T>{
-        return this.httpClient.queryGraphQl<T>(query,variable);
-    }
-}
+  protected async queryGraphQl<T extends IGraphQlResponseBase>(
+    query: DocumentNode,
+    variable: object
+  ): Promise<T> {
+    return this.httpClient.queryGraphQl<T>(query, variable);
+  }
+}

client/nt.webclient/vue3withtypescript/nt/src/apiService/HttpClient.ts

@@ -1,97 +1,100 @@
-import { IResponseBase, IGraphQlResponseBase } from "@/types/apirequestresponsetypes/Response";
-import axios, {AxiosInstance, AxiosRequestConfig} from "axios";
-import {useUserStore} from "@/stores/userStore";
+import {
+  IResponseBase,
+  IGraphQlResponseBase,
+} from '@/types/apirequestresponsetypes/Response';
+import axios, { AxiosInstance, AxiosRequestConfig } from 'axios';
+import { useUserStore } from '@/stores/userStore';
 import { DocumentNode, gql } from '@apollo/client/core';
-import  apolloClient  from '@/apolloClient'; 
+import apolloClient from '@/apolloClient';
 
-class HttpClient{
+class HttpClient {
+  private axiosInstance: AxiosInstance;
 
-    private axiosInstance : AxiosInstance;
-
-    constructor(){
-        const headers = {
-           //"Access-Control-Allow-Origin": "*",
-            //"Access-Control-Allow-Headers": "*", // this will allow all CORS requests
-            //"Access-Control-Allow-Methods": "OPTIONS,POST,GET", // this states the allowed methods
-            "Content-Type": "application/json", // this shows the expected content type
-          };
+  constructor() {
+    const headers = {
+      //"Access-Control-Allow-Origin": "*",
+      //"Access-Control-Allow-Headers": "*", // this will allow all CORS requests
+      //"Access-Control-Allow-Methods": "OPTIONS,POST,GET", // this states the allowed methods
+      'Content-Type': 'application/json', // this shows the expected content type
+    };
 
-          console.log('base URL' + import.meta.env.VITE_APP_API_URL)
-        this.axiosInstance = axios.create({baseURL: import.meta.env.VITE_APP_API_URL, headers:headers});
-
-        this.axiosInstance.interceptors.request.use(function (config) 
-        {
-            const userStoreInstance = useUserStore();
-            if(userStoreInstance.Token){
-                console.log("Submitting with token " + userStoreInstance.Token)
-                config.headers.Authorization  = `Bearer ${userStoreInstance.Token}`; 
-            }
-            else{
-                console.log("Token not available")
-            }
-            return config;
-        });
-    }
-
-    public async invoke<T extends IResponseBase>(config:AxiosRequestConfig):Promise<T> {
+    console.log('base URL' + import.meta.env.VITE_APP_API_URL);
+    this.axiosInstance = axios.create({
+      baseURL: import.meta.env.VITE_APP_API_URL,
+      headers: headers,
+    });
 
-        try{
-            const response =await this.axiosInstance.request<T>(config); 
-            console.log(response.data)
-            return response.data;
-        }catch(error : unknown){
+    this.axiosInstance.interceptors.request.use(function (config) {
+      const userStoreInstance = useUserStore();
+      if (userStoreInstance.Token) {
+        console.log('Submitting with token ' + userStoreInstance.Token);
+        config.headers.Authorization = `Bearer ${userStoreInstance.Token}`;
+      } else {
+        console.log('Token not available');
+      }
+      return config;
+    });
+  }
 
-            if(axios.isAxiosError(error)){
-                return <T>{
-                    status : error.response?.status,
-                    hasError : true,
-                    errors : error.response?.data.errors
-                } 
-            }
-            else{
-                console.log("Some other error ?? " + error);
-            }
-        } 
-        return <T>{};
+  public async invoke<T extends IResponseBase>(
+    config: AxiosRequestConfig
+  ): Promise<T> {
+    try {
+      const response = await this.axiosInstance.request<T>(config);
+      return response.data;
+    } catch (error: unknown) {
+      if (axios.isAxiosError(error)) {
+        return <T>{
+          status: error.response?.status,
+          hasError: true,
+          errors: error.response?.data.errors,
+        };
+      } else {
+        console.log('Some other error ?? ' + error);
+      }
     }
-    public async getBlob<T>(config:AxiosRequestConfig):Promise<T|null>
-    {
-        try{
-            const response =await this.axiosInstance.request<T>(config); 
-
-            if(response.status == 204){
-                // No Content
-                return null;
-            }
+    return <T>{};
+  }
+  public async getBlob<T>(config: AxiosRequestConfig): Promise<T | null> {
+    try {
+      console.log('Sending profile image request for:', config);
+      const response = await this.axiosInstance.request<T>(config);
 
-            return response.data;
-        }catch(error : unknown){
+      if (response.status == 204) {
+        // No Content
+        return null;
+      }
 
-            if(axios.isAxiosError(error)){
-                return null;
-            }
-            else{
-                console.log("Some other error ?? " + error);
-            }
-        } 
-        return <T>{};
+      return response.data;
+    } catch (error: unknown) {
+      if (axios.isAxiosError(error)) {
+        return null;
+      } else {
+        console.log('Some other error ?? ' + error);
+      }
     }
+    return <T>{};
+  }
 
-    public async queryGraphQl<T extends IGraphQlResponseBase>(query:DocumentNode,variable:object):Promise<T>{
-
-        try {
-
-            console.log("GraphQL Query:", query.loc?.source.body); // Shows full query string
-console.log("Variables:", JSON.stringify(variable, null, 2));
+  public async queryGraphQl<T extends IGraphQlResponseBase>(
+    query: DocumentNode,
+    variable: object
+  ): Promise<T> {
+    try {
+      console.log('GraphQL Query:', query.loc?.source.body); // Shows full query string
+      console.log('Variables:', JSON.stringify(variable, null, 2));
 
-            const result = await apolloClient.query<T>({ query, variables: variable });
-            console.log(result.data);
-            return result.data;
-          } catch (err) {
-            console.error("GraphQL request failed:", err);
-            throw err;
-          }
+      const result = await apolloClient.query<T>({
+        query,
+        variables: variable,
+      });
+      console.log(result.data);
+      return result.data;
+    } catch (err) {
+      console.error('GraphQL request failed:', err);
+      throw err;
     }
+  }
 }
 
-export default HttpClient;
+export default HttpClient;

client/nt.webclient/vue3withtypescript/nt/src/apiService/MovieApiService.ts

@@ -1,5 +1,6 @@
 import { ApiServiceBase } from './ApiServiceBase';
 import {
+  IGetMovieInfoResponse,
   IRecentMoviesResponse,
   ISearchMoviesResponse,
   MovieResponse,
@@ -62,6 +63,37 @@ class MovieApiService extends ApiServiceBase {
     );
     return movies;
   }
+
+  public async GetMovieById(id: string): Promise<Movie> {
+    console.log('query recent movie');
+    const movieById: DocumentNode = gql`
+      query movieByIdQuery($id: String) {
+        movieById(id: $id) {
+          id
+          title
+          description
+          movieLanguage
+          releaseDate
+          cast {
+            name
+          }
+          crew {
+            key
+            value {
+              name
+            }
+          }
+        }
+      }
+    `;
+
+    const response = await this.queryGraphQl<IGetMovieInfoResponse>(movieById, {
+      id,
+    });
+
+    console.log(response);
+    return ConvertToMovieDto(response.movieById);
+  }
 }
 
 function ConvertToMovieDto(movieResponse: MovieResponse): Movie {