Repository: jhipster/jhipster-lite
Pull request #10306 (2024-07-17 18:44:59)

Prettier: fix warnings on React generated app
Related to #10279 


Patch:
diff --git a/src/main/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactory.java b/src/main/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactory.java
index 4dcabd348..51f0775c1 100644
--- a/src/main/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactory.java
+++ b/src/main/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactory.java
@@ -35,7 +35,7 @@ public class ReactJwtModuleFactory {
       -moz-osx-font-smoothing: grayscale;
       display: flex;
       flex-direction: column;
-      justify-content:center;
+      justify-content: center;
       align-items: center;\
     """;
 
@@ -88,7 +88,7 @@ public class ReactJwtModuleFactory {
         .in(path("src/main/webapp/app/index.tsx"))
           .add(lineBeforeText("import { createRoot } from 'react-dom/client';"), "import { NextUIProvider } from '@nextui-org/react';")
           .add(lineBeforeText(APP), properties.indentation().times(2) + "<NextUIProvider>")
-          .add(lineBeforeText("</React.StrictMode>"), properties.indentation().times(2) + "</NextUIProvider>")
+          .add(lineBeforeText("</React.StrictMode>,"), properties.indentation().times(2) + "</NextUIProvider>")
           .add(text(APP), properties.indentation().times(1) + APP)
           .and()
         .in(path("src/main/webapp/app/index.css"))
diff --git a/src/main/resources/generator/client/react/src/main/webapp/app/common/primary/app/App.css.mustache b/src/main/resources/generator/client/react/src/main/webapp/app/common/primary/app/App.css.mustache
index ff420f707..d7b8746ad 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/app/common/primary/app/App.css.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/app/common/primary/app/App.css.mustache
@@ -8,7 +8,7 @@
 }
 
 a {
-  color: #045F77;
+  color: #045f77;
   text-decoration: underline;
 }
 
diff --git a/src/main/resources/generator/client/react/src/main/webapp/app/index.tsx.mustache b/src/main/resources/generator/client/react/src/main/webapp/app/index.tsx.mustache
index 44a79759b..af4681159 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/app/index.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/app/index.tsx.mustache
@@ -8,5 +8,5 @@ const root = createRoot(container!);
 root.render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>
+  </React.StrictMode>,
 );
diff --git a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginForm/index.tsx.mustache b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginForm/index.tsx.mustache
index f3d72dcf1..d52ed16bd 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginForm/index.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginForm/index.tsx.mustache
@@ -15,7 +15,7 @@ const LoginForm = () => {
       setUsername,
       setToken,
     }),
-    []
+    [],
   );
 
   const onPressLoginButton = useCallback(() => setOpen(true), []);
@@ -26,24 +26,20 @@ const LoginForm = () => {
 
   return (
     <div>
-      {!token ?
-        (
-          <Button data-testid="login-button" variant="shadow" onPress={onPressLoginButton}>
-            Log in
+      {!token ? (
+        <Button data-testid="login-button" variant="shadow" onPress={onPressLoginButton}>
+          Log in
+        </Button>
+      ) : (
+        <>
+          <p>
+            Welcome <strong>{username}</strong>!
+          </p>
+          <Button variant="shadow" onPress={onPressLogoutButton}>
+            Log out
           </Button>
-        )
-      :
-        (
-          <>
-            <p>
-              Welcome <strong>{username}</strong>!
-            </p>
-            <Button variant="shadow" onPress={onPressLogoutButton}>
-              Log out
-            </Button>
-          </>
-        )
-      }
+        </>
+      )}
       <UserInfoContext.Provider value={userInfoContextValues}>
         <LoginModal open={open} onClose={onCloseModal} />
       </UserInfoContext.Provider>
diff --git a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeFilledIcon.tsx.mustache b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeFilledIcon.tsx.mustache
index efddd3886..f0a2a41c6 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeFilledIcon.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeFilledIcon.tsx.mustache
@@ -1,13 +1,5 @@
 export const EyeFilledIcon = (props: { className: string }) => (
-  <svg
-    aria-hidden="true"
-    fill="none"
-    focusable="false"
-    height="1em"
-    viewBox="0 0 24 24"
-    width="1em"
-    {...props}
-  >
+  <svg aria-hidden="true" fill="none" focusable="false" height="1em" viewBox="0 0 24 24" width="1em" {...props}>
     <path
       d="M21.25 9.14969C18.94 5.51969 15.56 3.42969 12 3.42969C10.22 3.42969 8.49 3.94969 6.91 4.91969C5.33 5.89969 3.91 7.32969 2.75 9.14969C1.75 10.7197 1.75 13.2697 2.75 14.8397C5.06 18.4797 8.44 20.5597 12 20.5597C13.78 20.5597 15.51 20.0397 17.09 19.0697C18.67 18.0897 20.09 16.6597 21.25 14.8397C22.25 13.2797 22.25 10.7197 21.25 9.14969ZM12 16.0397C9.76 16.0397 7.96 14.2297 7.96 11.9997C7.96 9.76969 9.76 7.95969 12 7.95969C14.24 7.95969 16.04 9.76969 16.04 11.9997C16.04 14.2297 14.24 16.0397 12 16.0397Z"
       fill="currentColor"
diff --git a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeSlashFilledIcon.tsx.mustache b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeSlashFilledIcon.tsx.mustache
index 6ad615318..4d3c79be1 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeSlashFilledIcon.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/EyeSlashFilledIcon.tsx.mustache
@@ -1,13 +1,5 @@
 export const EyeSlashFilledIcon = (props: { className: string }) => (
-  <svg
-    aria-hidden="true"
-    fill="none"
-    focusable="false"
-    height="1em"
-    viewBox="0 0 24 24"
-    width="1em"
-    {...props}
-  >
+  <svg aria-hidden="true" fill="none" focusable="false" height="1em" viewBox="0 0 24 24" width="1em" {...props}>
     <path
       d="M21.2714 9.17834C20.9814 8.71834 20.6714 8.28834 20.3514 7.88834C19.9814 7.41834 19.2814 7.37834 18.8614 7.79834L15.8614 10.7983C16.0814 11.4583 16.1214 12.2183 15.9214 13.0083C15.5714 14.4183 14.4314 15.5583 13.0214 15.9083C12.2314 16.1083 11.4714 16.0683 10.8114 15.8483C10.8114 15.8483 9.38141 17.2783 8.35141 18.3083C7.85141 18.8083 8.01141 19.6883 8.68141 19.9483C9.75141 20.3583 10.8614 20.5683 12.0014 20.5683C13.7814 20.5683 15.5114 20.0483 17.0914 19.0783C18.7014 18.0783 20.1514 16.6083 21.3214 14.7383C22.2714 13.2283 22.2214 10.6883 21.2714 9.17834Z"
       fill="currentColor"
diff --git a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/index.tsx.mustache b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/index.tsx.mustache
index 8c26d8f19..8a03feca7 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/index.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/app/login/primary/loginModal/index.tsx.mustache
@@ -14,8 +14,8 @@ const LoginModal = ({ open, onClose }: LoginModalType) => {
   const { register, handleSubmit } = useForm<LoginFunctionType>();
   const [error, setError] = useState<boolean>(false);
   const [isVisible, setIsVisible] = useState(false);
-  const [usernameForm, setUsernameForm] = useState<string | undefined>("");
-  const [passwordForm, setPasswordForm] = useState<string | undefined>("");
+  const [usernameForm, setUsernameForm] = useState<string | undefined>('');
+  const [passwordForm, setPasswordForm] = useState<string | undefined>('');
   const { setUsername, setToken } = useContext(UserInfoContext);
 
   const toggleVisibility = () => setIsVisible(!isVisible);
@@ -36,7 +36,7 @@ const LoginModal = ({ open, onClose }: LoginModalType) => {
   }, []);
 
   return (
-    <Modal backdrop='blur' isOpen={open} onClose={handleClose} aria-labelledby="modal-login">
+    <Modal backdrop="blur" isOpen={open} onClose={handleClose} aria-labelledby="modal-login">
       <ModalContent>
         <ModalHeader>
           <span>Connect</span>
@@ -66,7 +66,7 @@ const LoginModal = ({ open, onClose }: LoginModalType) => {
               color="primary"
               size="lg"
               placeholder="Mot de passe"
-              type={isVisible ? "text" : "password"}
+              type={isVisible ? 'text' : 'password'}
               value={passwordForm}
               onValueChange={setPasswordForm}
               endContent={
diff --git a/src/main/resources/generator/client/react/src/main/webapp/index.html.mustache b/src/main/resources/generator/client/react/src/main/webapp/index.html.mustache
index 6cfccbfc7..2da7942ee 100644
--- a/src/main/resources/generator/client/react/src/main/webapp/index.html.mustache
+++ b/src/main/resources/generator/client/react/src/main/webapp/index.html.mustache
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />


Test patch:
diff --git a/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginForm/index.test.tsx.mustache b/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginForm/index.test.tsx.mustache
index acc559ff0..862e95951 100644
--- a/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginForm/index.test.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginForm/index.test.tsx.mustache
@@ -11,31 +11,31 @@ const mockPost = () => {
 };
 
 const login = async () => {
-  const { getByText, getByPlaceholderText, getByTestId } = render(<LoginForm/>);
+  const { getByText, getByPlaceholderText, getByTestId } = render(<LoginForm />);
   const loginButton = getByText('Log in');
-    fireEvent.click(loginButton);
-    await act(async () => {
-      fireEvent.change(getByPlaceholderText("Nom d'utilisateur"), {
-        target: {value: 'admin'},
-      });
-      fireEvent.change(getByPlaceholderText('Mot de passe'), {
-        target: {value: 'admin'},
-      });
-      const submitButton = getByTestId('submit-button');
-      fireEvent.click(submitButton);
+  fireEvent.click(loginButton);
+  await act(async () => {
+    fireEvent.change(getByPlaceholderText("Nom d'utilisateur"), {
+      target: { value: 'admin' },
+    });
+    fireEvent.change(getByPlaceholderText('Mot de passe'), {
+      target: { value: 'admin' },
+    });
+    const submitButton = getByTestId('submit-button');
+    fireEvent.click(submitButton);
   });
   return { getByText, getByPlaceholderText, getByTestId };
 };
 
 describe('loginForm', () => {
   it('render button should contain "Log in"', () => {
-    const {getByText} = render(<LoginForm/>);
+    const { getByText } = render(<LoginForm />);
     const loginButton = getByText('Log in');
     expect(loginButton).toBeTruthy();
   });
 
   it('render the modal on login button click and close it', async () => {
-    const {getByText, getByTestId} = render(<LoginForm/>);
+    const { getByText, getByTestId } = render(<LoginForm />);
     const loginButton = getByText('Log in');
     fireEvent.click(loginButton);
     expect(getByText('Connect')).toBeTruthy();
diff --git a/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginModal/index.test.tsx.mustache b/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginModal/index.test.tsx.mustache
index 0f051d44d..8dcb3de2f 100644
--- a/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginModal/index.test.tsx.mustache
+++ b/src/main/resources/generator/client/react/src/test/javascript/spec/login/primary/loginModal/index.test.tsx.mustache
@@ -8,10 +8,12 @@ import { UserInfoContext } from '@/login/primary/loginForm';
 const setUsername = vi.fn();
 const setToken = vi.fn();
 
-const LoginModalRender = (open: boolean) => render(
-<UserInfoContext.Provider value={{ setUsername, setToken }}>
-  <LoginModal open={open} onClose={() => {}} />
-</UserInfoContext.Provider>);
+const LoginModalRender = (open: boolean) =>
+  render(
+    <UserInfoContext.Provider value={{ setUsername, setToken }}>
+      <LoginModal open={open} onClose={() => {}} />
+    </UserInfoContext.Provider>,
+  );
 
 describe('test login modal', () => {
   it('should contain login title', () => {
diff --git a/src/main/resources/generator/client/react/src/test/javascript/spec/login/services/login.test.ts.mustache b/src/main/resources/generator/client/react/src/test/javascript/spec/login/services/login.test.ts.mustache
index 1033b82ab..90ad34338 100644
--- a/src/main/resources/generator/client/react/src/test/javascript/spec/login/services/login.test.ts.mustache
+++ b/src/main/resources/generator/client/react/src/test/javascript/spec/login/services/login.test.ts.mustache
@@ -17,7 +17,7 @@ describe('login function', () => {
     spy.mockImplementationOnce(() => Promise.reject(new Error('error')));
     const setUsername = vi.fn();
     const setToken = vi.fn();
-    expect(login({...data, setToken, setUsername})).toBeInstanceOf(Promise);
+    expect(login({ ...data, setToken, setUsername })).toBeInstanceOf(Promise);
   });
 
   it('should set token and username', async () => {
@@ -25,7 +25,7 @@ describe('login function', () => {
     spy.mockImplementationOnce((): Promise<any> => Promise.resolve({ data: { id_token: idToken } }));
     const setUsername = vi.fn();
     const setToken = vi.fn();
-    await login({...data, setToken, setUsername});
+    await login({ ...data, setToken, setUsername });
     expect(setUsername).toHaveBeenCalledWith(data.username);
     expect(setToken).toHaveBeenCalledWith(idToken);
   });
diff --git a/src/test/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactoryTest.java b/src/test/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactoryTest.java
index e06a80513..447f973c0 100644
--- a/src/test/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactoryTest.java
+++ b/src/test/java/tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactoryTest.java
@@ -30,7 +30,7 @@ class ReactJwtModuleFactoryTest {
           -moz-osx-font-smoothing: grayscale;
           display: flex;
           flex-direction: column;
-          justify-content:center;
+          justify-content: center;
           align-items: center;
         """
       )