generator-jhipster 8.5.0 → 8.7.0

package/dist/generators/react/templates/src/main/webapp/app/modules/administration/user-management/user-management.tsx.ejs

@@ -42,7 +42,7 @@ export const UserManagement = () => {
   const navigate = useNavigate();
 
   const [pagination, setPagination] = useState(
-    overridePaginationStateWithQueryParams(getPaginationState(pageLocation, ITEMS_PER_PAGE, 'id'), pageLocation.search)
+    overridePaginationStateWithQueryParams(getPaginationState(pageLocation, ITEMS_PER_PAGE, 'id'), pageLocation.search),
   );
 
   const getUsersFromProps = () => {
@@ -51,7 +51,7 @@ export const UserManagement = () => {
         page: pagination.activePage - 1,
         size: pagination.itemsPerPage,
         sort: `${pagination.sort},${pagination.order}`,
-      })
+      }),
     );
     const endURL = `?page=${pagination.activePage}&sort=${pagination.sort},${pagination.order}`;
     if (pageLocation.search !== endURL) {
@@ -73,7 +73,7 @@ export const UserManagement = () => {
         ...pagination,
         activePage: +page,
         sort: sortSplit[0],
-        order: sortSplit[1]
+        order: sortSplit[1],
       });
     }
   }, [pageLocation.search]);
@@ -82,13 +82,13 @@ export const UserManagement = () => {
     setPagination({
       ...pagination,
       order: pagination.order === ASC ? DESC : ASC,
-      sort: p
+      sort: p,
     });
 
   const handlePagination = currentPage =>
     setPagination({
       ...pagination,
-      activePage: currentPage
+      activePage: currentPage,
     });
 
   const handleSyncList = () => {
@@ -100,7 +100,7 @@ export const UserManagement = () => {
       updateUser({
         ...user,
         activated: !user.activated,
-      })
+      }),
     );
   };
 
@@ -114,7 +114,7 @@ export const UserManagement = () => {
     if (sortFieldName !== fieldName) {
       return faSort;
     } else {
-      return (order === ASC) ? faSortUp : faSortDown;
+      return order === ASC ? faSortUp : faSortDown;
     }
   };
 
@@ -124,7 +124,8 @@ export const UserManagement = () => {
         <Translate contentKey="userManagement.home.title">Users</Translate>
         <div className="d-flex justify-content-end">
           <Button className="me-2" color="info" onClick={handleSyncList} disabled={loading}>
-            <FontAwesomeIcon icon="sync" spin={loading} /> <Translate contentKey="userManagement.home.refreshListLabel">Refresh List</Translate>
+            <FontAwesomeIcon icon="sync" spin={loading} />{' '}
+            <Translate contentKey="userManagement.home.refreshListLabel">Refresh List</Translate>
           </Button>
           <Link to="new" className="btn btn-primary jh-create-entity">
             <FontAwesomeIcon icon="plus" /> <Translate contentKey="userManagement.home.createLabel">Create a new user</Translate>
@@ -155,8 +156,7 @@ export const UserManagement = () => {
           </tr>
         </thead>
         <tbody>
-          {
-          users.map((user, i) => (
+          {users.map((user, i) => (
             <tr id={user.login} key={`user-${i}`}>
               <td>
                 <Button tag={Link} to={user.login} color="link" size="sm">
@@ -167,11 +167,11 @@ export const UserManagement = () => {
               <td>{user.email}</td>
               <td>
                 {user.activated ? (
-                  <Button color="success" onClick={toggleActive(user) }>
+                  <Button color="success" onClick={toggleActive(user)}>
                     <Translate contentKey="userManagement.activated">Activated</Translate>
                   </Button>
                 ) : (
-                  <Button color="danger" onClick={toggleActive(user) }>
+                  <Button color="danger" onClick={toggleActive(user)}>
                     <Translate contentKey="userManagement.deactivated">Deactivated</Translate>
                   </Button>
                 )}
@@ -180,14 +180,13 @@ export const UserManagement = () => {
               <td>{user.langKey}</td>
 <%_ } _%>
               <td>
-                {
-                  user.authorities ? (
-                  user.authorities.map((authority, j) => (
-                    <div key={`user-auth-${i}-${j}`}>
-                      <Badge color="info">{authority}</Badge>
-                    </div>
-                  ))) : null
-                }
+                {user.authorities
+                  ? user.authorities.map((authority, j) => (
+                      <div key={`user-auth-${i}-${j}`}>
+                        <Badge color="info">{authority}</Badge>
+                      </div>
+                    ))
+                  : null}
               </td>
 <%_ if (!databaseTypeCassandra) { _%>
               <td>
@@ -203,13 +202,22 @@ export const UserManagement = () => {
               <td className="text-end">
                 <div className="btn-group flex-btn-group-container">
                   <Button tag={Link} to={user.login} color="info" size="sm">
-                    <FontAwesomeIcon icon="eye" /> <span className="d-none d-md-inline"><Translate contentKey="entity.action.view">View</Translate></span>
+                    <FontAwesomeIcon icon="eye" />{' '}
+                    <span className="d-none d-md-inline">
+                      <Translate contentKey="entity.action.view">View</Translate>
+                    </span>
                   </Button>
                   <Button tag={Link} to={`${user.login}/edit`} color="primary" size="sm">
-                    <FontAwesomeIcon icon="pencil-alt" /> <span className="d-none d-md-inline"><Translate contentKey="entity.action.edit">Edit</Translate></span>
+                    <FontAwesomeIcon icon="pencil-alt" />{' '}
+                    <span className="d-none d-md-inline">
+                      <Translate contentKey="entity.action.edit">Edit</Translate>
+                    </span>
                   </Button>
                   <Button tag={Link} to={`${user.login}/delete`} color="danger" size="sm" disabled={account.login === user.login}>
-                    <FontAwesomeIcon icon="trash" /> <span className="d-none d-md-inline"><Translate contentKey="entity.action.delete">Delete</Translate></span>
+                    <FontAwesomeIcon icon="trash" />{' '}
+                    <span className="d-none d-md-inline">
+                      <Translate contentKey="entity.action.delete">Delete</Translate>
+                    </span>
                   </Button>
                 </div>
               </td>

package/dist/generators/react/templates/src/main/webapp/app/modules/home/home.tsx.ejs

@@ -23,7 +23,11 @@ import React, { useEffect } from 'react';
 <%_ } else { _%>
 import React from 'react';
 <%_ } _%>
+<%_ if (authenticationTypeOauth2) { _%>
+import { useLocation, useNavigate } from 'react-router-dom';
+<%_ } else { _%>
 import { Link } from 'react-router-dom';
+<%_ } _%>
 import { Translate } from 'react-jhipster';
 import { Row, Col, Alert } from 'reactstrap';
 
@@ -35,6 +39,9 @@ import { useAppSelector } from 'app/config/store';
 export const Home = () => {
   const account = useAppSelector(state => state.authentication.account);
 <%_ if (authenticationTypeOauth2) { _%>
+  const pageLocation = useLocation();
+  const navigate = useNavigate();
+
   useEffect(() => {
     const redirectURL = localStorage.getItem(REDIRECT_URL);
     if (redirectURL) {
@@ -65,7 +72,14 @@ export const Home = () => {
                 <Translate contentKey="global.messages.info.authenticated.prefix">If you want to </Translate>
                 <% if (!enableTranslation) { %><span>&nbsp;</span><% } %>
 <%_ if (authenticationTypeOauth2) { _%>
-                <a href={getLoginUrl()} className="alert-link">
+                <a
+                  className="alert-link"
+                  onClick={() =>
+                    navigate(getLoginUrl(), {
+                      state: { from: pageLocation },
+                    })
+                  }
+                >
                   <Translate contentKey="global.messages.info.authenticated.link">sign in</Translate>
                 </a>
 <%_ } else { _%>

package/dist/generators/react/templates/src/main/webapp/app/modules/login/login-redirect.tsx.ejs

@@ -7,7 +7,11 @@ export const LoginRedirect = () => {
 
   useEffect(() => {
     localStorage.setItem(REDIRECT_URL, pageLocation.state.from.pathname);
+<%_ if (authenticationTypeOauth2) { _%>
+    window.location.href = '/oauth2/authorization/oidc';
+<%_ } else { _%>
     window.location.reload();
+<%_ } _%>
   });
 
   return null;

package/dist/generators/react/templates/src/main/webapp/app/modules/login/logout.tsx.ejs

@@ -22,13 +22,15 @@ import { useAppDispatch, useAppSelector } from 'app/config/store';
 import { logout } from 'app/shared/reducers/authentication';
 
 export const Logout = () => {
-  const logoutUrl = useAppSelector(state => state.authentication.logoutUrl);
+  const authentication = useAppSelector(state => state.authentication);
   const dispatch = useAppDispatch();
 
   useLayoutEffect(() => {
     dispatch(logout());
-    if (logoutUrl) {
-      window.location.href = logoutUrl;
+    if (authentication.logoutUrl) {
+      window.location.href = authentication.logoutUrl;
+    } else if (!authentication.isAuthenticated) {
+      window.location.href = '/';
     }
   });
 

package/dist/generators/react/templates/src/main/webapp/app/routes.tsx.ejs

@@ -49,7 +49,7 @@ import { sendActivity } from 'app/config/websocket-middleware';
 const loading = <div>loading ...</div>;
 <%_ if (generateUserManagement) { _%>
 
-  const Account = Loadable({
+const Account = Loadable({
   loader: () => import(/* webpackChunkName: "account" */ 'app/modules/account'),
   loading: () => loading,
 });
@@ -112,7 +112,7 @@ const AppRoutes = () => {
           }
         />
 <%_ if (authenticationTypeOauth2) { _%>
-        <Route path="oauth2/authorization/oidc" element={<LoginRedirect />} />
+        <Route path="sign-in" element={<LoginRedirect />} />
 <%_ } _%>
 <%_ if (applicationTypeGateway && microfrontend) { _%>
   <%_ for (const remote of microfrontends) { _%>

package/dist/generators/react/templates/src/main/webapp/app/setup-tests.ts.ejs

@@ -1,3 +1,3 @@
 import { loadIcons } from './config/icon-loader';
 
-loadIcons();
+loadIcons();

package/dist/generators/react/templates/src/main/webapp/app/shared/DurationFormat.tsx.ejs

@@ -17,5 +17,12 @@ export const DurationFormat = ({ value, blankOnInvalid, locale }: IDurationForma
     locale = TranslatorContext.context.locale;
   }
 
-  return <span title={value}>{dayjs.duration(value).locale(locale || '<% if (enableTranslation) { %><%= nativeLanguage %><% } else { %>en<% } %>').humanize()}</span>;
+  return (
+    <span title={value}>
+      {dayjs
+        .duration(value)
+        .locale(locale || '<% if (enableTranslation) { %><%= nativeLanguage %><% } else { %>en<% } %>')
+        .humanize()}
+    </span>
+  );
 };

package/dist/generators/react/templates/src/main/webapp/app/shared/auth/private-route.spec.tsx.ejs

@@ -27,7 +27,7 @@ describe('private-route component', () => {
     return render(
       <Provider store={store}>
         <MemoryRouter>{Elem}</MemoryRouter>
-      </Provider>
+      </Provider>,
     );
   };
 
@@ -42,7 +42,7 @@ describe('private-route component', () => {
         account: {
           authorities: [],
         },
-      })
+      }),
     ).toThrow(Error);
     console.error = originalError;
   });
@@ -58,11 +58,9 @@ describe('private-route component', () => {
         account: {
           authorities: [],
         },
-      }
-    );
-    expect(container.innerHTML).toMatch(
-      /<div class="insufficient-authority"><div class="alert alert-danger">.*<\/div><\/div>/
+      },
     );
+    expect(container.innerHTML).toMatch(/<div class="insufficient-authority"><div class="alert alert-danger">.*<\/div><\/div>/);
   });
 
   it('Should render a route for the component provided when authenticated', () => {
@@ -76,7 +74,7 @@ describe('private-route component', () => {
         account: {
           authorities: ['ADMIN'],
         },
-      }
+      },
     );
     expect(container.innerHTML).toEqual('<div>Test</div>');
   });
@@ -92,7 +90,7 @@ describe('private-route component', () => {
             </PrivateRoute>
           }
         />
-        <Route path="<% if(authenticationTypeOauth2) { %>/oauth2/authorization/oidc<% } else { %>/login<% } %>" element={<div>Login</div>} />
+        <Route path="<% if(authenticationTypeOauth2) { %>/sign-in<% } else { %>/login<% } %>" element={<div>Login</div>} />
       </Routes>,
       {
         isAuthenticated: false,
@@ -100,7 +98,7 @@ describe('private-route component', () => {
         account: {
           authorities: ['ADMIN'],
         },
-      }
+      },
     );
     expect(container.innerHTML).not.toEqual('<div>Test</div>');
     expect(container.innerHTML).toEqual('<div>Login</div>');

package/dist/generators/react/templates/src/main/webapp/app/shared/auth/private-route.tsx.ejs

@@ -42,7 +42,7 @@ export const PrivateRoute = ({ children, hasAnyAuthorities = [], ...rest }: IOwn
   return (
     <Navigate
       to={{
-        pathname: '<%_ if (authenticationTypeOauth2) { _%>/oauth2/authorization/oidc<%_ } else {_%>/login<%_ } _%>',
+        pathname: '<%_ if (authenticationTypeOauth2) { _%>/sign-in<%_ } else {_%>/login<%_ } _%>',
         search: pageLocation.search,
       }}
       replace

package/dist/generators/react/templates/src/main/webapp/app/shared/error/error-boundary-routes.spec.tsx.ejs

@@ -25,7 +25,7 @@ describe('error-boundary-routes component', () => {
         <ErrorBoundaryRoutes>
           <Route path="*" element={<ErrorComp />} />
         </ErrorBoundaryRoutes>
-      </MemoryRouter>
+      </MemoryRouter>,
     );
     expect(container.innerHTML).toEqual('<div><h2 class="error">An unexpected error has occurred.</h2></div>');
   });
@@ -37,7 +37,7 @@ describe('error-boundary-routes component', () => {
           <Route path="/path" element={<NoErrorComp />} />
           <Route path="*" element={<ErrorComp />} />
         </ErrorBoundaryRoutes>
-      </MemoryRouter>
+      </MemoryRouter>,
     );
     expect(container.innerHTML).toEqual('<div>No error</div>');
   });
@@ -48,7 +48,7 @@ describe('error-boundary-routes component', () => {
         <ErrorBoundaryRoutes>
           <Route path="*" element={<NoErrorComp />} />
         </ErrorBoundaryRoutes>
-      </MemoryRouter>
+      </MemoryRouter>,
     );
     expect(container.innerHTML).toEqual('<div>No error</div>');
   });

package/dist/generators/react/templates/src/main/webapp/app/shared/error/error-boundary.spec.tsx.ejs

@@ -8,9 +8,7 @@ const ErrorComp = () => {
 };
 
 describe('error component', () => {
-
   beforeEach(() => {
-
     // ignore console and jsdom errors
     jest.spyOn((window as any)._virtualConsole, 'emit').mockImplementation(() => false);
     jest.spyOn((window as any).console, 'error').mockImplementation(() => false);
@@ -25,7 +23,7 @@ describe('error component', () => {
     render(
       <ErrorBoundary>
         <ErrorComp />
-      </ErrorBoundary>
+      </ErrorBoundary>,
     );
     expect(spy).toHaveBeenCalled();
   });

package/dist/generators/react/templates/src/main/webapp/app/shared/error/error-boundary.tsx.ejs

@@ -15,7 +15,7 @@ class ErrorBoundary extends React.Component<IErrorBoundaryProps, IErrorBoundaryS
   componentDidCatch(error, errorInfo) {
     this.setState({
       error,
-      errorInfo
+      errorInfo,
     });
   }
 
@@ -23,12 +23,12 @@ class ErrorBoundary extends React.Component<IErrorBoundaryProps, IErrorBoundaryS
     const { error, errorInfo } = this.state;
     if (errorInfo) {
       const errorDetails = DEVELOPMENT ? (
-          <details className="preserve-space">
-            {error && error.toString()}
-            <br />
-            {errorInfo.componentStack}
-          </details>
-        ) : undefined;
+        <details className="preserve-space">
+          {error && error.toString()}
+          <br />
+          {errorInfo.componentStack}
+        </details>
+      ) : undefined;
       return (
         <div>
           <h2 className="error">An unexpected error has occurred.</h2>

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/header/header-components.tsx.ejs

@@ -25,10 +25,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
 export const BrandIcon = props => (
   <div {...props} className="brand-icon">
-    <img
-      src="content/images/logo-jhipster.png"
-      alt="Logo"
-    />
+    <img src="content/images/logo-jhipster.png" alt="Logo" />
   </div>
 );
 
@@ -44,7 +41,9 @@ export const Home = () => (
   <NavItem>
     <NavLink tag={Link} to="/" className="d-flex align-items-center">
       <FontAwesomeIcon icon="home" />
-      <span><Translate contentKey="global.menu.home">Home</Translate></span>
+      <span>
+        <Translate contentKey="global.menu.home">Home</Translate>
+      </span>
     </NavLink>
   </NavItem>
 );

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/header/header.scss.ejs

@@ -126,7 +126,7 @@ Navbar styles
 
 .brand-title {
   font-size: 1.25rem;
-  margin-left: .25rem;
+  margin-left: 0.25rem;
   color: $header-color;
   &:hover {
     color: $header-color-hover;

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/header/header.spec.tsx.ejs

@@ -34,22 +34,22 @@ describe('Header', () => {
 <%_ } _%>
     ribbonEnv: 'dev',
     isInProduction: false,
-    isOpenAPIEnabled: true
+    isOpenAPIEnabled: true,
   };
   const prodProps = {
     ...devProps,
     ribbonEnv: 'prod',
     isInProduction: true,
-    isOpenAPIEnabled: false
+    isOpenAPIEnabled: false,
   };
   const userProps = {
     ...prodProps,
-    isAdmin: false
+    isAdmin: false,
   };
   const guestProps = {
     ...prodProps,
     isAdmin: false,
-    isAuthenticated: false
+    isAuthenticated: false,
   };
 
   const wrapper = (props = devProps) => {
@@ -60,7 +60,7 @@ describe('Header', () => {
           <MemoryRouter>
             <Header {...props} />
           </MemoryRouter>
-        </Provider>
+        </Provider>,
       );
       mountedWrapper = container.innerHTML;
     }
@@ -127,5 +127,4 @@ describe('Header', () => {
     // Find AccountMenu component
     expect(html).toContain('account-menu');
   });
-
 });

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/header/header.tsx.ejs

@@ -28,9 +28,6 @@ import {
 } from 'reactstrap';
 import LoadingBar from 'react-redux-loading-bar';
 
-<%_ if (enableTranslation && enableI18nRTL) { _%>
-import { isRTL } from 'app/config/translation';
-<%_ } _%>
 import { Home, Brand } from './header-components';
 import { AdminMenu, EntitiesMenu, AccountMenu<%_ if (enableTranslation) { _%>, LocaleMenu<%_ } _%>} from '../menus';
 <%_ if (enableTranslation) { _%>
@@ -52,9 +49,6 @@ export interface IHeaderProps {
 
 const Header = (props: IHeaderProps) => {
   const [menuOpen, setMenuOpen] = useState(false);
-<%_ if (enableI18nRTL) { _%>
-  useEffect(() => document.querySelector('html').setAttribute('dir', isRTL(Storage.session.get('locale')) ? 'rtl' : 'ltr'));
-<%_ } _%>
 
 <%_ if (enableTranslation) { _%>
   const dispatch = useAppDispatch();
@@ -63,9 +57,6 @@ const Header = (props: IHeaderProps) => {
     const langKey = event.target.value;
     Storage.session.set('locale', langKey);
     dispatch(setLocale(langKey));
-  <%_ if (enableI18nRTL) { _%>
-    document.querySelector('html').setAttribute('dir', isRTL(langKey) ? 'rtl' : 'ltr');
-  <%_ } _%>
   }
 <%_ } _%>
 

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/menus/account.spec.tsx.ejs

@@ -34,7 +34,7 @@ describe('AccountMenu', () => {
       const { container } = render(
         <MemoryRouter>
           <AccountMenu isAuthenticated />
-        </MemoryRouter>
+        </MemoryRouter>,
       );
       mountedWrapper = container.innerHTML;
     }
@@ -45,7 +45,7 @@ describe('AccountMenu', () => {
       const { container } = (mountedWrapper = render(
         <MemoryRouter>
           <AccountMenu />
-        </MemoryRouter>
+        </MemoryRouter>,
       ));
       mountedWrapper = container.innerHTML;
     }
@@ -68,9 +68,7 @@ describe('AccountMenu', () => {
   it('Renders a guest AccountMenu component', () => {
     const html = guestWrapper();
 
-<%_ if (authenticationTypeOauth2) { _%>
-    expect(html).toContain(getLoginUrl());
-<%_ } else { _%>
+<%_ if (!authenticationTypeOauth2) { _%>
     expect(html).toContain('/login');
 <%_ } _%>
     expect(html).not.toContain('/logout');

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/menus/account.tsx.ejs

@@ -27,6 +27,9 @@ import { Translate, translate } from 'react-jhipster';
 import { getLoginUrl } from 'app/shared/util/url-utils';
 <%_ } _%>
 import { NavDropdown } from './menu-components';
+<%_ if (authenticationTypeOauth2) { _%>
+import { useLocation, useNavigate } from 'react-router';
+<%_ } _%>
 
 
 const accountMenuItemsAuthenticated = () => (
@@ -42,18 +45,38 @@ const accountMenuItemsAuthenticated = () => (
   </>
   );
 
+<%_ if (authenticationTypeOauth2) { _%>
+const accountMenuItems = () => {
+  const navigate = useNavigate();
+  const pageLocation = useLocation();
+
+  return (
+    <>
+      <DropdownItem
+        id="login-item"
+        tag="a"
+        data-cy="login"
+        onClick={() =>
+          navigate(getLoginUrl(), {
+            state: { from: pageLocation },
+          })
+        }
+      >
+        <FontAwesomeIcon icon="sign-in-alt" /> <Translate contentKey="global.menu.account.login">Sign in</Translate>
+      </DropdownItem>
+    </>
+  );
+};
+<%_ } else { _%>
 const accountMenuItems = () => (
   <>
-<%_ if (!authenticationTypeOauth2) { _%>
     <MenuItem id="login-item" icon="sign-in-alt" to="/login" data-cy="login"><Translate contentKey="global.menu.account.login">Sign in</Translate></MenuItem>
-<%_ } else { _%>
-    <DropdownItem id="login-item" tag="a" href={getLoginUrl()} data-cy="login"><FontAwesomeIcon icon="sign-in-alt" /> <Translate contentKey="global.menu.account.login">Sign in</Translate></DropdownItem>
-<%_ } _%>
-<%_ if (generateUserManagement) { _%>
+  <%_ if (generateUserManagement) { _%>
     <MenuItem icon="user-plus" to="/account/register" data-cy="register"><Translate contentKey="global.menu.account.register">Register</Translate></MenuItem>
-<%_ } _%>
+  <%_ } _%>
   </>
 );
+<%_ } _%>
 
 export const AccountMenu = ({ isAuthenticated = false }) => (
   <NavDropdown icon="user" name={translate('global.menu.account.main')} id="account-menu" data-cy="accountMenu">

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/menus/admin.tsx.ejs

@@ -27,7 +27,7 @@ import { Translate, translate } from 'react-jhipster';
 
 const adminMenuItems = () => (
   <>
-<%_ if (applicationTypeGateway && serviceDiscoveryAny) { _%>
+<%_ if (applicationTypeGateway && gatewayServicesApiAvailable) { _%>
     <MenuItem icon="road" to="/admin/gateway"><Translate contentKey="global.menu.admin.gateway">Gateway</Translate></MenuItem>
 <%_ } _%>
 <%_ if (generateUserManagement) { _%>

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/menus/locale.tsx.ejs

@@ -23,7 +23,7 @@ import { locales, languages } from 'app/config/translation';
 
 export const LocaleMenu = ({ currentLocale, onClick }: { currentLocale: string; onClick: (event: any) => void }) =>
   Object.keys(languages).length > 1 ? (
-    <NavDropdown icon="flag" name={(currentLocale ? languages[currentLocale].name : undefined)}>
+    <NavDropdown icon="flag" name={currentLocale ? languages[currentLocale].name : undefined}>
       {locales.map(locale => (
         <DropdownItem key={locale} value={locale} onClick={onClick}>
           {languages[locale].name}

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/menus/menu-components.tsx.ejs

@@ -22,13 +22,13 @@ import { UncontrolledDropdown, DropdownToggle, DropdownMenu } from 'reactstrap';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
 export const NavDropdown = props => (
-<UncontrolledDropdown nav inNavbar id={props.id} data-cy={props["data-cy"]}>
-  <DropdownToggle nav caret className="d-flex align-items-center">
-    <FontAwesomeIcon icon={props.icon} />
-    <span>{props.name}</span>
-  </DropdownToggle>
-  <DropdownMenu end style={props.style}>
-    {props.children}
-  </DropdownMenu>
-</UncontrolledDropdown>
+  <UncontrolledDropdown nav inNavbar id={props.id} data-cy={props['data-cy']}>
+    <DropdownToggle nav caret className="d-flex align-items-center">
+      <FontAwesomeIcon icon={props.icon} />
+      <span>{props.name}</span>
+    </DropdownToggle>
+    <DropdownMenu end style={props.style}>
+      {props.children}
+    </DropdownMenu>
+  </UncontrolledDropdown>
 );

package/dist/generators/react/templates/src/main/webapp/app/shared/layout/menus/menu-item.tsx.ejs

@@ -41,4 +41,3 @@ const MenuItem = (props: IMenuItem) => {
 };
 
 export default MenuItem;
-