Commit d7b364a9 authored by Jakub Uhlárik's avatar Jakub Uhlárik
Browse files

feat(frontend): edit, add error

parent 398001cd

frontend/src/hooks/configurationHook.ts

+81 −33
Original line number Diff line number Diff line
@@ -7,7 +7,6 @@ import { 
  VideoCard,

} from '@pcbuilder/common/api';



import { Conflict } from '@pcbuilder/backend/src/errors';

import { useMutation } from 'react-query';

import { useRecoilState, useResetRecoilState } from 'recoil';

import { configurationAtom } from '../state/atoms';
@@ -29,17 +28,25 @@ export function useConfiguration() { 


  const reset = useResetRecoilState(configurationAtom);



  const { mutate: addConfigutation, isLoading: loadingAddConfig } = useMutation<

    Preset,

    ApiError,

    AddPresetType

  >(['addPreset'], (preset: AddPresetType) => presetApi.create(preset));

  const {

    mutate: addConfigutation,

    isLoading: loadingAddConfig,

    isError: isAddConfigError,

    error: addConfigError,

  } = useMutation<Preset, ApiError, AddPresetType>(

    ['addPreset'],

    (preset: AddPresetType) => presetApi.create(preset)

  );



  const { mutate: addBuildServer, isLoading: loadingAddBuild } = useMutation<

    Build,

    ApiError,

    AddBuildType

  >(['addBuild'], (build: AddBuildType) => buildApi.create(build), {

  const {

    mutate: addBuildServer,

    isLoading: loadingAddBuild,

    isError: isAddBuildError,

    error: addBuildError,

  } = useMutation<Build, ApiError, AddBuildType>(

    ['addBuild'],

    (build: AddBuildType) => buildApi.create(build),

    {

      onSuccess: (b: Build) =>

        addConfigutation({

          buildId: b.id,
@@ -47,18 +54,25 @@ export function useConfiguration() { 
          description: configuration.preset.description ?? '',

          categoryId: configuration.preset.categoryId ?? '',

        }),

  });

    }

  );



  const { mutate: editBuildServer, isLoading: loadingEditBuild } = useMutation<

    Build,

    ApiError,

    EditBuildType

  >(['editBuild'], (editBuild: EditBuildType) =>

    buildApi.update(editBuild.id, editBuild.data)

  const {

    mutate: editBuildServer,

    isLoading: loadingEditBuild,

    isError: isEditBuildError,

    error: editBuildError,

  } = useMutation<Build, ApiError, EditBuildType>(

    ['editBuild'],

    (editBuild: EditBuildType) => buildApi.update(editBuild.id, editBuild.data)

  );



  const { mutate: editConfiguration, isLoading: loadingEditConfig } =

    useMutation<Preset, ApiError, EditConfigType>(

  const {

    mutate: editConfiguration,

    isLoading: loadingEditConfig,

    isError: isEditConfigError,

    error: editConfigError,

  } = useMutation<Preset, ApiError, EditConfigType>(

    ['editPreset'],

    (editConfig: EditConfigType) =>

      presetApi.update(editConfig.id, editConfig.data)
@@ -180,6 +194,37 @@ export function useConfiguration() { 
    });

  }



  function isError() {

    return (

      isAddBuildError ||

      isAddConfigError ||

      isEditBuildError ||

      isEditConfigError

    );

  }



  function error() {

    if (!isError()) {

      return undefined;

    }

    if (addBuildError) {

      return addBuildError;

    }



    if (addConfigError) {

      return addConfigError;

    }



    if (editBuildError) {

      return editBuildError;

    }



    if (editConfigError) {

      return editConfigError;

    }

    return undefined;

  }



  return {

    addCategory,

    addMotherboard,
@@ -201,6 +246,9 @@ export function useConfiguration() { 
      loadingAddConfig ||

      loadingEditBuild ||

      loadingEditConfig,



    configuration,

    isError: isError(),

    error: error(),

  };

}

frontend/src/pages/Summary/Summary.tsx

+12 −1
Original line number Diff line number Diff line
@@ -6,12 +6,23 @@ import { priceToString, calculatePrice } from '../../services/helperFunctions'; 
import './Summary.css';

import { auth } from '../../state/atoms';

import { LinkButton } from '../../components/LinkButton.tsx';

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



export function Summary() {

  const { configuration, isAdd, isFull, send, loading } = useConfiguration();

  const { configuration, isAdd, isFull, send, loading, isError, error } =

    useConfiguration();

  const admin = useRecoilValue(auth);

  return (

    <div className="summary">

      {isError && error !== undefined ? (

        <>

          {' '}

          <ErrorView dataType="build" error={error} />

          {console.log(error)}

        </>

      ) : (

        ''

      )}

      <h1 className="summary__title">Here is your build</h1>

      <div className="summary__build">

        {configuration.processor !== null && (