./src/services/serviceHelper.ts

The serviceHelper is used in order to decrease redundancy in different pages/components and augment raw requests. We do not want to interfere with the minimalist request functions in the service files themselves to guarantee maximum customization. Therefore often occurring data processing logic, error handling, toast displays etc. (redundancy) will be defined inside the serviceHelper.

Example serviceHelper.checkAdmin():

const checkAdmin = async () => {
    try {
        const res = await user.checkAdmin(); // import and use user service function

        if (res.ok) {
            const { isAdmin } = await res.json(); // process data
            return isAdmin; // change return type
        }
    } catch (err) { // error handling
        toast.showToast(ToastType.ERROR, 'Connection error. Try again later.'); // display toast
    }

    return null; // change return type
};

In this case we augmented the user.checkAdmin() function by error handling with a Toast and extracting the needed response object in order to directly return it.

Questions regarding serviceHelper: @cwsyth

./src/services/toast.ts

The toast service is used to throw toast messages in any page. It uses the react-toastify npm package.

• The toast container is rendered at the same level as the router so any page or component can display toast messages
• Toast messages stack, have a time to live and can be closed by clicking them or their respective close button
• Toast messages time to live freezes when hovering them

The showToast function throws the actual toast.

type: ToastType: Specifies the type of toast that should be rendered.

• INFO shows a blue colored toast with in info icon.
• ERROR throws a red toast with an exclamation mark icon.
• SUCCESS throws a green toast with a checkmark icon.

message: string | JSX.Element: Specifies the toasts body. This can either be a simple string or a custom JSX component.

ttl: number: Specifies the time to live for the toast message in milliseconds.

The httpError function combines a HTTP status code as number with a custom message and returns the concatenated string.

Questions regarding toastService: @MysterionAutotronic

./src/services/passwordService.ts

The passwordServices check function checks if the provided string meets the criteria to be used as a password. It returns a PasswordStatus object.

• length: the password has to be 8 characters long
• special character: the password has to contain at least one special character. This is checked with /[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]+/

Questions regarding passwordService: @MysterionAutotronic

./src/services/*.ts

The other services are self-explanatory (e.g. user service for CRUD operations regarding the user model) and the function implementations depend solely on the backend. As mentioned in serviceHelper section the requests are kept minimalist as possible and do not implement any data processing or error handling.