Commit c17f8007 authored by jakub uhlarik's avatar jakub uhlarik
Browse files

Merge branch 'master' of https://gitlab.fi.muni.cz/xuhlarik/pcbuilder into fronte

parents 1cf5b134 eed8354a

frontend/src/components/AddPart/AddMemory.tsx

+82 −50
Original line number Diff line number Diff line 
import { Button, OutlinedInput } from '@mui/material';

import { useForm } from 'react-hook-form';

import { useNavigate } from 'react-router-dom';

import { Memory, Manufacturer, MemoryGeneration } from '@pcbuilder/common/api';

import { useMutation } from 'react-query';

import schema, { Manufacturer, MemoryGeneration } from '@pcbuilder/common/api';

import './AddPart.css';

import { z } from 'zod';

import { useState } from 'react';

import { ManufacturerAttr } from './PartAttributes/ManufacturerAttr.tsx';

import { MemoryGenerationAttr } from './PartAttributes/MemoryGenerationAttr.tsx';

import { createMemory } from '../../services/memoryApi';

import { ErrorView } from '../ErrorView.tsx';

import { uploadImage } from '../../services/uploadApi';



export function AddMemory() {

  const navigate = useNavigate();

  const { register, handleSubmit } = useForm<Memory>();

  function add(_memory: Memory) {

    // TODO: functionality

    navigate('/');

  }



  const [manufacturer, setManufacturer] = useState<Manufacturer>();

  const [memoryGeneration, setMemoryGeneration] = useState<MemoryGeneration>();



  const { register, handleSubmit, getValues } = useForm<Memory>();

  const {

    mutate,

    isLoading,

    error: responseError,

    isError,

  } = useMutation('createMemory', (memory: Memory) => createMemory(memory), {

    onSuccess: () => {

      navigate('/');

    },

  });



  type Memory = z.infer<typeof schema.memory.create>;



  async function add() {

    const stored = await uploadImage(getValues('image'));

    const memory = {

      name: getValues('name'),

      price: getValues('price'),

      manufacturerId: manufacturer.id,

      memoryGenerationId: memoryGeneration.id,

      image: stored[0].filename,

    };

    mutate(memory);

  }



  return (

    <>

      {isError === true && (

        <ErrorView dataType="Processor" error={responseError} />

      )}

      <form onSubmit={handleSubmit(add)} className="processor__formAdd">

        <h1 className="formAdd__title">Add Memory</h1>

        <div className="formAdd__item">
@@ -52,11 +82,12 @@ export function AddMemory() { 
          <input

            required

            type="file"

          {...register('name')}

            {...register('image')}

            className="formAdd__item--inputFile"

          />

        </div>

        <Button

          disabled={isLoading}

          type="submit"

          color="info"

          variant="contained"
@@ -65,5 +96,6 @@ export function AddMemory() { 
          Proceed

        </Button>

      </form>

    </>

  );

}

frontend/src/components/AddPart/AddVideoCard.tsx

+113 −77
Original line number Diff line number Diff line
@@ -8,26 +8,24 @@ import { 
} from '@mui/material';

import { useForm } from 'react-hook-form';

import { useNavigate } from 'react-router-dom';

import {

  VideoCard,

import schema, {

  Manufacturer,

  VideoChipset,

  PcieGeneration,

} from '@pcbuilder/common/api/api';

import './AddPart.css';

import { z } from 'zod';

import { useMutation, useQuery } from 'react-query';

import { useState } from 'react';

import { useQuery } from 'react-query';

import { ManufacturerAttr } from './PartAttributes/ManufacturerAttr.tsx';

import { readManyGenerations } from '../../services/pcieGenerationApi';

import { VideoChipsetAttr } from './PartAttributes/VideoChipsetAttr.tsx';

import { createVideoCard } from '../../services/videoCardApi';

import { ErrorView } from '../ErrorView.tsx';

import { uploadImage } from '../../services/uploadApi';



export function AddVideoCard() {

  const navigate = useNavigate();

  const { register, handleSubmit } = useForm<VideoCard>();

  function add(_videoCard: VideoCard) {

    // TODO: functionality

    navigate('/');

  }



  const [manufacturer, setManufacturer] = useState<Manufacturer>();

  const [videoChipset, setVideoChipset] = useState<VideoChipset>();
@@ -40,7 +38,43 @@ export function AddVideoCard() { 
    setGeneration(event.target.value as PcieGeneration);

  };



  const { register, handleSubmit, getValues } = useForm<VideoCard>();

  const {

    mutate,

    isLoading,

    error: responseError,

    isError,

  } = useMutation(

    'createVideoCard',

    (videoCard: VideoCard) => createVideoCard(videoCard),

    {

      onSuccess: () => {

        navigate('/');

      },

    }

  );



  type VideoCard = z.infer<typeof schema.videoCard.create>;



  async function add() {

    const stored = await uploadImage(getValues('image'));

    const processor = {

      name: getValues('name'),

      price: getValues('price'),

      manufacturerId: manufacturer.id,

      pcieGenerationId: generation.id,

      chipsetId: videoChipset.id,

      slotSize: getValues('slotSize'),

      image: stored[0].filename,

    };

    mutate(processor);

  }



  return (

    <>

      {isError === true && (

        <ErrorView dataType="Processor" error={responseError} />

      )}

      <form onSubmit={handleSubmit(add)} className="processor__formAdd">

        <h1 className="formAdd__title">Add Video Card</h1>

        <div className="formAdd__item">
@@ -99,11 +133,12 @@ export function AddVideoCard() { 
          <input

            required

            type="file"

          {...register('name')}

            {...register('image')}

            className="formAdd__item--inputFile"

          />

        </div>

        <Button

          disabled={isLoading}

          type="submit"

          color="info"

          variant="contained"
@@ -112,5 +147,6 @@ export function AddVideoCard() { 
          Proceed

        </Button>

      </form>

    </>

  );

}

frontend/src/services/memoryApi.ts

+17 −0
Original line number Diff line number Diff line
@@ -2,6 +2,13 @@ import { schema, Memory } from '@pcbuilder/common/api'; 
import { z } from 'zod';

import axios from './base';



export const createMemory = async (

  data: z.infer<typeof schema.memory.create>

) => {

  const response = await axios.post<Memory>('/memory', data);

  return response.data;

};



export const readManyMemories = async (

  data: z.infer<typeof schema.Memory.readMany> = {}

) => {
@@ -10,3 +17,13 @@ export const readManyMemories = async ( 
  });

  return response.data;

};



export const deleteMemory = async (

  id: string,

  data: z.infer<typeof schema.memory.delete>

) => {

  const response = await axios.delete<void>(`/memory/${id}`, {

    params: data,

  });

  return response.data;

};

frontend/src/services/motherboardApi.ts

+10 −0
Original line number Diff line number Diff line
@@ -17,3 +17,13 @@ export const readManyMotherboards = async ( 
  });

  return response.data;

};



export const deleteMotherboard = async (

  id: string,

  data: z.infer<typeof schema.motherboard.delete>

) => {

  const response = await axiosInstance.delete<void>(`/motherboard/${id}`, {

    params: data,

  });

  return response.data;

};

frontend/src/services/videoCardApi.ts

+17 −0
Original line number Diff line number Diff line
@@ -2,6 +2,13 @@ import { schema, VideoCard } from '@pcbuilder/common/api'; 
import { z } from 'zod';

import axios from './base';



export const createVideoCard = async (

  data: z.infer<typeof schema.videoCard.create>

) => {

  const response = await axios.post<VideoCard>('/video-card', data);

  return response.data;

};



export const readManyVideoCards = async (

  data: z.infer<typeof schema.VideoCard.readMany> = {}

) => {
@@ -10,3 +17,13 @@ export const readManyVideoCards = async ( 
  });

  return response.data;

};



export const deleteVideoCards = async (

  id: string,

  data: z.infer<typeof schema.videoCard.delete>

) => {

  const response = await axios.delete<void>(`/video-card/${id}`, {

    params: data,

  });

  return response.data;

};