build(client): switch to react-jsx transform option (#386)

client/src/index.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import { useEffect } from 'react';
 import { createRoot } from 'react-dom/client';
 import { BrowserRouter } from 'react-router-dom';
 import { AppRoutes } from './router/AppRoutes';

client/src/pages/auth/AdminLayout.tsx

@@ -1,4 +1,4 @@
-import React, { FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 
 export const AdminLayout: FC<PropsWithChildren> = ({ children }) => {
   return (

client/src/pages/auth/AdminPage.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from 'react';
+import { ChangeEvent, FC, useEffect, useState } from 'react';
 import { UserData } from '../../interfaces/User';
 import { getAdminStatus, searchUsers } from '../../api/httpClient';
 import AdminLayout from './AdminLayout';
@@ -9,7 +9,7 @@ export const AdminPage: FC = () => {
   const [inputValue, setInputValue] = useState('');
   const [users, setUsers] = useState<UserData[]>([]);
 
-  const onInput = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const onInput = (e: ChangeEvent<HTMLInputElement>) => {
     setInputValue(e.target.value);
   };
 

client/src/pages/auth/AuthLayout.tsx

@@ -1,7 +1,7 @@
-import React, { useRef, useEffect, FC } from 'react';
+import { ReactNode, useRef, useEffect, FC } from 'react';
 
 type Props = {
-  children?: React.ReactNode;
+  children?: ReactNode;
   logoBgColor?: string;
 };
 

client/src/pages/auth/Dashboard.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import AuthLayout from './AuthLayout';
 
 export const Dashboard: FC = () => {

client/src/pages/auth/Login/Login.tsx

@@ -1,6 +1,6 @@
 import { AxiosRequestConfig } from 'axios';
 import getBrowserFingerprint from 'get-browser-fingerprint';
-import React, { FC, FormEvent, useEffect, useState } from 'react';
+import { FC, FormEvent, useEffect, useState } from 'react';
 import { Link, useLocation } from 'react-router-dom';
 import { OidcClient } from '../../../interfaces/Auth';
 import { RoutePath } from '../../../router/RoutePath';

client/src/pages/auth/Login/showLdapReponse.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { RegistrationUser } from '../../../interfaces/User';
 import showRegResponse from '../Register/showRegReponse';
 

client/src/pages/auth/Login/showLoginReponse.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import InnerHTML from 'dangerously-set-html-content';
 import { LoginResponse } from '../../../interfaces/User';
 

client/src/pages/auth/LoginNew/LoginNew.tsx

@@ -1,5 +1,5 @@
 import { AxiosRequestConfig } from 'axios';
-import React, { FC, FormEvent, useState } from 'react';
+import { FC, FormEvent, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { RoutePath } from '../../../router/RoutePath';
 import { getUserData } from '../../../api/httpClient';

client/src/pages/auth/LoginNew/PasswordCheck.tsx

@@ -1,5 +1,5 @@
 import { AxiosRequestConfig } from 'axios';
-import React, { FC, FormEvent, useEffect, useState } from 'react';
+import { FC, FormEvent, useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { RoutePath } from '../../../router/RoutePath';
 import { getUser, getUserData } from '../../../api/httpClient';

client/src/pages/auth/Register/Register.tsx

@@ -1,4 +1,4 @@
-import React, { FC, FormEvent, useState } from 'react';
+import { FC, FormEvent, useState } from 'react';
 import { postUser } from '../../../api/httpClient';
 import { RegistrationUser, LoginFormMode } from '../../../interfaces/User';
 import AuthLayout from '../AuthLayout';

client/src/pages/auth/Register/showRegReponse.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import InnerHTML from 'dangerously-set-html-content';
 import { RegistrationUser } from '../../../interfaces/User';
 

client/src/pages/chat/Chat.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import Header from '../main/Header/Header';
 import ChatWidget from './ChatWidget';
 

client/src/pages/chat/ChatWidget.tsx

@@ -1,4 +1,4 @@
-import React, {
+import {
   ChangeEvent,
   FC,
   KeyboardEvent,

client/src/pages/main/Contact.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import { useEffect } from 'react';
 import { sendSupportEmailRequest } from 'src/api/httpClient';
 
 export const Contact = (props: { mapTitle: string | null }) => {

client/src/pages/main/Counts.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 
 export const Counts: FC = () => {
   const counters = [

client/src/pages/main/FAQ.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 
 export const FAQ: FC = () => {
   const FAQItems = [

client/src/pages/main/Footer.tsx

@@ -1,4 +1,4 @@
-import React, { FC, FormEvent, useEffect, useState } from 'react';
+import { FC, FormEvent, useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import InnerHTML from 'dangerously-set-html-content';
 import { postRender, postSubscriptions } from '../../api/httpClient';

client/src/pages/main/Header/Header.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect } from 'react';
+import { FC, useEffect } from 'react';
 import { Link } from 'react-router-dom';
 import { goTo, postMetadata, getSpawnData } from '../../../api/httpClient';
 import Nav from './Nav';

client/src/pages/main/Header/Nav.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import { getAdminStatus } from '../../../api/httpClient';
 import { RoutePath } from '../../../router/RoutePath';
 interface MenuItem {

client/src/pages/main/Header/Sign.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, FC, useEffect, useState } from 'react';
+import { ChangeEvent, FC, useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { Buffer } from 'buffer';
 import { fileTypeFromBuffer } from 'file-type/core';

client/src/pages/main/Hero.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 
 export const Hero: FC = () => {
   return (

client/src/pages/main/Main.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import Marketplace from '../marketplace/Marketplace';
 import Counts from './Counts';
 import Hero from './Hero';

client/src/pages/main/Userprofile.tsx

@@ -1,4 +1,4 @@
-import React, { FormEvent, useEffect, useState } from 'react';
+import { FormEvent, useEffect, useState } from 'react';
 import { Navigate } from 'react-router';
 import {
   getAdminStatus,

client/src/pages/marketplace/DatePicker.tsx

@@ -1,12 +1,12 @@
-import React, { useState } from 'react';
+import { FC, useState } from 'react';
 import DatePicker from 'react-datepicker';
 import 'react-datepicker/dist/react-datepicker.css';
 
 interface DateRangePickerProps {
   onDatesChange: (dateFrom: Date, dateTo: Date) => void;
 }
 
-const DateRangePicker: React.FC<DateRangePickerProps> = ({ onDatesChange }) => {
+const DateRangePicker: FC<DateRangePickerProps> = ({ onDatesChange }) => {
   const [dates, setDates] = useState<{
     dateFrom: Date;
     dateTo: Date;

client/src/pages/marketplace/Marketplace.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, FC, useEffect, useState } from 'react';
+import { ChangeEvent, FC, MouseEvent, useEffect, useState } from 'react';
 import { Product } from '../../interfaces/Product';
 import {
   getProducts,
@@ -37,7 +37,7 @@ export const Marketplace: FC<Props> = (props: Props) => {
     });
   };
 
-  const onGetFile = (e: React.MouseEvent<HTMLElement>) => {
+  const onGetFile = (e: MouseEvent<HTMLElement>) => {
     e.preventDefault();
     getFile(`${path}${fileName}`).then((blob) => {
       const url = window.URL.createObjectURL(new Blob([blob]));

client/src/pages/marketplace/Partners/Partners.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from 'react';
+import { FC, useEffect, useState } from 'react';
 import { DOMParser } from 'xmldom';
 
 import OwlCarousel from 'react-owl-carousel';

client/src/pages/marketplace/ProductView.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect } from 'react';
+import { FC, useEffect } from 'react';
 import { Product } from '../../interfaces/Product';
 import { viewProduct } from '../../api/httpClient';
 

client/src/pages/marketplace/Testimonials/Testimonials.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from 'react';
+import { FC, useEffect, useState } from 'react';
 import { getTestimonials, getTestimonialsCount } from '../../../api/httpClient';
 import { Testimonial } from '../../../interfaces/Testimonial';
 import OwlCarousel from 'react-owl-carousel';

client/src/pages/marketplace/Testimonials/TestimonialsForm.tsx

@@ -1,10 +1,4 @@
-import React, {
-  Dispatch,
-  FC,
-  FormEvent,
-  SetStateAction,
-  useState
-} from 'react';
+import { Dispatch, FC, FormEvent, SetStateAction, useState } from 'react';
 import { postTestimonials } from '../../../api/httpClient';
 import { Testimonial } from '../../../interfaces/Testimonial';
 

client/src/pages/marketplace/Testimonials/TestimonialsItems.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import InnerHTML from 'dangerously-set-html-content';
 import { Testimonial } from '../../../interfaces/Testimonial';
 

client/src/router/AppRoutes.tsx

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import { FC } from 'react';
 import { Route, Routes, Navigate } from 'react-router-dom';
 import { RoutePath } from './RoutePath';
 import Main from '../pages/main/Main';

client/tsconfig.json

@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
     "typeRoots": ["./typings", "./node_modules/@types"],
-    "jsx": "react",
-    "target": "es5",
+    "jsx": "react-jsx",
+    "target": "es6",
     "module": "esnext",
     "baseUrl": ".",
     "strict": true,