v1.201.0

.github/dependabot.yml

@@ -27,7 +27,6 @@ updates:
       - dependency-name: '@typescript-eslint/parser'
       - dependency-name: eslint #6784
       - dependency-name: fetch-mock
-      - dependency-name: react-router-dom
       - dependency-name: react-datepicker
       - dependency-name: recharts
       - dependency-name: '@headlessui/react'

.github/workflows/ci_e2e_puppeteer.yml

@@ -16,7 +16,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        suite-dir: ['regression_suites', 'suite1', 'suite2', 'mobile']
+        suite-dir: ['suite1', 'suite2', 'mobile']
     services:
       elasticsearch:
         image: docker.elastic.co/elasticsearch/elasticsearch:7.17.7-amd64

.github/workflows/create_pre_release.yml

@@ -13,7 +13,7 @@ jobs:
   create_pre_release:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
         with:
           ref: 'staging'
           fetch-depth: 0
@@ -39,7 +39,7 @@ jobs:
         run: yarn production-build
       - uses: webfactory/[email protected]
         with:
-            ssh-private-key: ${{ secrets.DEPLOY_KEY }}
+          ssh-private-key: ${{ secrets.DEPLOY_KEY }}
       - name: Pre release
         run: ./scripts/pre-release.sh ${{ secrets.DEPLOY_SERVER }} ${{ secrets.DEPLOY_USER }} ${{ secrets.GH_TOKEN }}
 

app/react/App/App.js

@@ -1,7 +1,7 @@
 /* eslint-disable import/no-named-as-default */
 import React, { useState, useMemo } from 'react';
 import PropTypes from 'prop-types';
-import { Outlet, useLocation, useParams } from 'react-router-dom';
+import { Outlet, useLocation, useParams } from 'react-router';
 import { useAtom } from 'jotai';
 import Notifications from 'app/Notifications';
 import Cookiepopup from 'app/App/Cookiepopup';

app/react/App/Menu.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useLocation } from 'react-router-dom';
+import { useLocation } from 'react-router';
 import { bindActionCreators, Dispatch } from 'redux';
 import { connect, ConnectedProps } from 'react-redux';
 import { fromJS } from 'immutable';

app/react/App/specs/Menu.spec.js

@@ -3,8 +3,8 @@ import { I18NLink } from 'app/I18N';
 import { renderConnected } from 'app/utils/test/renderConnected';
 import { Menu } from '../Menu';
 
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
+jest.mock('react-router', () => ({
+  ...jest.requireActual('react-router'),
   useLocation: () => ({
     search: '?q=(searchTerm:%27asd%27)',
   }),

app/react/App/specs/Routes.spec.tsx

@@ -9,10 +9,13 @@ import { LibraryTable } from 'app/Library/LibraryTable';
 import { PageView } from 'app/Pages/PageView';
 import { ViewerRoute } from 'app/Viewer/ViewerRoute';
 import { LibraryMap } from 'app/Library/LibraryMap';
+import LibraryRoot from 'app/Library/Library';
 
 let settings: ClientSettings;
 let userId: string;
 
+jest.mock('app/appRoutes');
+
 describe('Routes', () => {
   beforeEach(() => {
     settings = { home_page: '', defaultLibraryView: 'table', private: false };
@@ -54,8 +57,12 @@ describe('Routes', () => {
           "/library/map/?searchTerm:'mySearch',types:!('63f64f8bd793c9aae9925032')";
         const { element, parameters } = getIndexElement(settings, undefined);
         expect(parameters).toBeUndefined();
-        expect(element).toMatchObject(<LibraryMap />);
-        expect(element.props.params).toMatchObject({
+        expect(element).toMatchObject(
+          <LibraryRoot>
+            <LibraryMap />
+          </LibraryRoot>
+        );
+        expect(element.props.children.props.params).toMatchObject({
           q: "(searchTerm:'mySearch',types:!('63f64f8bd793c9aae9925032'))",
         });
       });
@@ -76,7 +83,11 @@ describe('Routes', () => {
     describe('no logged in user', () => {
       it('should render the default library view', () => {
         const { element, parameters } = getIndexElement(settings, undefined);
-        expect(element).toMatchObject(<LibraryTable />);
+        expect(element).toMatchObject(
+          <LibraryRoot>
+            <LibraryTable />
+          </LibraryRoot>
+        );
         expect(parameters).toBeUndefined();
       });
     });

app/react/Attachments/components/ViewDocumentLink.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Link, useLocation } from 'react-router-dom';
+import { Link, useLocation } from 'react-router';
 import { CurrentLocationLink } from 'app/Layout';
 import { EntitySchema } from 'shared/types/entityType';
 

app/react/Attachments/components/specs/ViewDocumentLink.spec.tsx

@@ -1,4 +1,4 @@
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import React from 'react';
 import { shallow } from 'enzyme';
 
@@ -13,8 +13,8 @@ const mockUseLocation = jest.fn().mockImplementation(() => ({
   pathname: `?page=${pathname}`,
 }));
 
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
+jest.mock('react-router', () => ({
+  ...jest.requireActual('react-router'),
   useLocation: () => mockUseLocation(),
 }));
 const renderComponent = (entity: EntitySchema) => {

app/react/Entities/components/EntityViewer.js

@@ -6,6 +6,7 @@ import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import { Helmet } from 'react-helmet';
+import { sortBy } from 'lodash';
 import PropTypes from 'prop-types';
 import { Icon } from 'UI';
 import { withContext, withRouter } from 'app/componentWrappers';
@@ -417,7 +418,7 @@ EntityViewer.propTypes = {
 
 const selectRelationTypes = createSelector(
   s => s.relationTypes,
-  r => r.toJS()
+  r => sortBy(r.toJS(), 'name')
 );
 
 const mapStateToProps = state => {

app/react/Forms/components/MultiSelect.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable max-classes-per-file */
 /* eslint-disable class-methods-use-this,max-lines */
 
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import ShowIf from 'app/App/ShowIf';
 import { filterOptions } from 'shared/optionsUtils';
 import { t, Translate } from 'app/I18N';

app/react/I18N/I18NLinkV2.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
+import { NavLinkProps, NavLink } from 'react-router';
 import { useAtomValue } from 'jotai';
-import { NavLinkProps, NavLink } from 'react-router-dom';
 import { localeAtom } from 'V2/atoms';
 
 type I18NLinkProps = NavLinkProps & { to: string; activeClassname?: string };

app/react/I18N/components/I18NLink.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import { connect } from 'react-redux';
-import { useNavigate, NavLink, useLocation } from 'react-router-dom';
+import { useNavigate, NavLink, useLocation } from 'react-router';
 import { omit } from 'lodash';
 
 const defaultProps = {
@@ -48,20 +48,20 @@ const I18NLink = (props: I18NLinkProps) => {
     }, delay);
   };
 
-  const _navigate = () => {
-    navigate(to, { replace });
+  const _navigate = async () => {
+    await navigate(to, { replace });
     scrollToHashWithRetry(location.hash);
   };
 
-  const onClickHandler = (e: { preventDefault: () => void }) => {
+  const onClickHandler = async (e: { preventDefault: () => void }) => {
     e.preventDefault();
     if (disabled) return;
 
     if (onClick && confirmTitle) {
       props.mainContext.confirm({
-        accept: () => {
+        accept: async () => {
           onClick(e);
-          _navigate();
+          await _navigate();
         },
         title: confirmTitle,
         message: confirmMessage,
@@ -71,10 +71,10 @@ const I18NLink = (props: I18NLinkProps) => {
 
     if (onClick) {
       onClick(e);
-      _navigate();
+      await _navigate();
       return;
     }
-    _navigate();
+    await _navigate();
   };
 
   useEffect(() => {

app/react/I18N/components/I18NMenu.tsx

@@ -1,14 +1,14 @@
 /* eslint-disable react/no-multi-comp */
 /* eslint-disable react-hooks/rules-of-hooks */
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { Location, useLocation } from 'react-router-dom';
+import { Location, useLocation } from 'react-router';
 import { useAtom, useAtomValue } from 'jotai';
 import { ChevronUpIcon, ChevronDownIcon } from '@heroicons/react/20/solid';
 import { LanguagesListSchema } from 'shared/types/commonTypes';
-import { NeedAuthorization } from 'V2/Components/UI';
+import { Translate, t } from 'app/I18N';
 import { useOnClickOutsideElement } from 'app/utils/useOnClickOutsideElementHook';
+import { NeedAuthorization } from 'V2/Components/UI';
 import { inlineEditAtom, localeAtom, settingsAtom, userAtom } from 'V2/atoms';
-import { Translate, t } from 'app/I18N';
 
 const locationSearch = (location: Location) => {
   const cleanSearch = location.search.split(/page=\d+|&page=\d+/).join('');

app/react/I18N/components/specs/I18NLink.spec.js

@@ -4,8 +4,8 @@
 /* eslint-disable max-statements */
 import React from 'react';
 import { render, screen, fireEvent } from '@testing-library/react';
+import { MemoryRouter, Route, Routes } from 'react-router';
 import { I18NLink } from '../I18NLink';
-import { MemoryRouter, Route, Routes } from 'react-router-dom';
 
 describe('I18NLink', () => {
   let props;

app/react/I18N/components/specs/I18NMenu.spec.tsx

@@ -3,7 +3,7 @@
  */
 import React from 'react';
 import { act, fireEvent, RenderResult, screen, render } from '@testing-library/react';
-import { Location, MemoryRouter } from 'react-router-dom';
+import { Location, MemoryRouter } from 'react-router';
 import { createStore, Provider } from 'jotai';
 import { ClientUserSchema } from 'app/apiResponseTypes';
 import { inlineEditAtom, localeAtom, settingsAtom, userAtom } from 'V2/atoms';

app/react/I18N/specs/I18NLinkV2.spec.tsx

@@ -4,7 +4,7 @@
 /* eslint-disable react/jsx-props-no-spreading */
 import React from 'react';
 import { render, RenderResult } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
+import { BrowserRouter } from 'react-router';
 import { TestAtomStoreProvider } from 'V2/testing';
 import { localeAtom } from 'V2/atoms';
 import { I18NLink } from '../I18NLinkV2';

app/react/Layout/CurrentLocationLink.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Link, useLocation } from 'react-router-dom';
+import { Link, useLocation } from 'react-router';
 
 const validProps = props => {
   const { to, ...valid } = props;

app/react/Layout/DocumentsList.js

@@ -1,7 +1,7 @@
 /* eslint-disable max-lines */
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
-import { Link } from 'react-router-dom';
+import { Link } from 'react-router';
 import { toUrlParams } from 'shared/JSONRequest';
 import rison from 'rison-node';
 import { SearchBar } from 'app/Library/components/SearchBar';

app/react/Layout/specs/CurrentLocationLink.spec.js

@@ -2,8 +2,8 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import { CurrentLocationLink } from '../CurrentLocationLink';
 
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
+jest.mock('react-router', () => ({
+  ...jest.requireActual('react-router'),
   useLocation: () => ({ pathname: 'pathanem', search: 'param=value&param2=value2' }),
 }));