Merge branch 'staging'

dataesr · Jul 12, 2024 · 65a0ae7 · 65a0ae7
2 parents 00cf745 + aebf670
commit 65a0ae7
Show file tree

Hide file tree

Showing 18 changed files with 296 additions and 82 deletions.
diff --git a/.github/workflows/production.yml b/.github/workflows/production.yml
@@ -33,6 +33,9 @@ jobs:
           node-version: 18
       - run: npm ci --silent && npm run build --mode=production
 
+      - name: 🤖 Delete robots.txt file for production
+        run: rm server/dist/robots.txt
+
       - name: 🐋 Build Docker image
         run: |
           IMAGE_ID=ghcr.io/${{ github.repository }}

diff --git a/client/public/robots.txt b/client/public/robots.txt
@@ -0,0 +1,2 @@
+User-agent: *
+Disallow: /
diff --git a/client/src/components/footer/index.jsx b/client/src/components/footer/index.jsx
@@ -2,18 +2,6 @@ import { Container, Link, Logo } from '@dataesr/dsfr-plus';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const modules = import.meta.glob('./locales/*.json', {
-  eager: true,
-  import: 'default',
-});
-const messages = Object.keys(modules).reduce((acc, key) => {
-  const locale = key.match(/\.\/locales\/(.+)\.json$/)?.[1];
-  if (locale) {
-    return { ...acc, [locale]: modules[key] };
-  }
-  return acc;
-}, {});
-
 export function FooterTop({ children }) {
   return <div className="fr-footer__top">{children}</div>;
 }
@@ -24,15 +12,17 @@ FooterTop.propTypes = {
 export function Footer({ children, fluid = false }) {
   return (
     <footer className="fr-footer fr-mt-3w" role="contentinfo" id="footer">
-      <Container fluid={fluid}>{children}</Container>
+      <Container fluid={fluid}>
+        {children}
+      </Container>
     </footer>
   );
 }
 Footer.defaultProps = {
   fluid: false,
 };
 Footer.propTypes = {
-  children: PropTypes.object.isRequired,
+  children: PropTypes.array.isRequired,
   fluid: PropTypes.bool,
 };
 
@@ -103,6 +93,6 @@ FooterBody.defaultProps = {
   description: undefined,
 };
 FooterBody.propTypes = {
-  children: PropTypes.object.isRequired,
+  children: PropTypes.array.isRequired,
   description: PropTypes.string,
 };
diff --git a/client/src/components/tag-input/index.jsx b/client/src/components/tag-input/index.jsx
@@ -19,6 +19,7 @@ export default function TagInput({
   getRoRChildren,
   hint,
   isLoading,
+  isRequired,
   label,
   message,
   messageType,
@@ -108,7 +109,7 @@ export default function TagInput({
                   className="fr-ml-1w"
                   color="yellow-tournesol"
                   icon="delete-line"
-                  onClick={() => onTagsChange([], excludedValues)}
+                  onClick={() => onTagsChange([], tags)}
                   size="sm"
                   title="Remove all affiliations"
                   variant="text"
@@ -120,6 +121,7 @@ export default function TagInput({
             onChange={(e) => setInput(e.target.value)}
             onKeyDown={handleKeyDown}
             placeholder={placeholder}
+            required={isRequired}
             type="text"
             value={input}
           />
@@ -179,7 +181,7 @@ export default function TagInput({
           ))}
           {seeMoreAfter !== 0 && structuredTags.length > seeMoreAfter && (
             <Button
-              className="fr-mr-1w"
+              className="fr-mr-1w fr-mb-2w"
               onClick={_seeMoreAction}
               size="sm"
             >
@@ -201,6 +203,7 @@ TagInput.propTypes = {
   getRoRChildren: PropTypes.bool,
   hint: PropTypes.string,
   isLoading: PropTypes.bool,
+  isRequired: PropTypes.bool,
   label: PropTypes.string.isRequired,
   message: PropTypes.string,
   messageType: PropTypes.oneOf(['error', 'valid', '']),
@@ -218,6 +221,7 @@ TagInput.defaultProps = {
   getRoRChildren: false,
   hint: 'Press "ENTER" to search for several terms',
   isLoading: false,
+  isRequired: false,
   message: '',
   messageType: '',
   onInputHandler: () => { },

diff --git a/client/src/layout/Footer.jsx → client/src/layout/footer.jsx b/client/src/layout/Footer.jsx → client/src/layout/footer.jsx
@@ -79,7 +79,7 @@ export default function MainFooter() {
                         iconPosition="left"
                         target="_blank"
                       >
-                        Tutorial
+                        Tutorial [FR]
                       </Link>
                     </li>
                   </ul>

diff --git a/client/src/layout/Header.jsx → client/src/layout/header.jsx b/client/src/layout/Header.jsx → client/src/layout/header.jsx
diff --git a/client/src/layout/index.jsx b/client/src/layout/index.jsx
@@ -2,8 +2,8 @@ import { Container } from '@dataesr/dsfr-plus';
 import PropTypes from 'prop-types';
 import { Outlet } from 'react-router-dom';
 
-import Footer from './Footer';
-import Header from './Header';
+import Footer from './footer';
+import Header from './header';
 
 export default function Layout({ isSticky }) {
   return (

diff --git a/client/src/main.jsx b/client/src/main.jsx
@@ -1,27 +1,35 @@
-import React, { useEffect } from 'react';
-import { BrowserRouter, useLocation } from 'react-router-dom';
-import { createInstance, MatomoProvider, useMatomo } from '@m4tt72/matomo-tracker-react';
+import { DSFRConfig } from '@dataesr/dsfr-plus';
+import {
+  createInstance,
+  MatomoProvider,
+  useMatomo,
+} from '@m4tt72/matomo-tracker-react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+import React, { useEffect } from 'react';
 import ReactDOM from 'react-dom/client';
+import { BrowserRouter, Link, useLocation } from 'react-router-dom';
 
-import Router from './router';
 import { ToastContextProvider } from './hooks/useToast';
+import Router from './router';
 
-import './styles/index.scss';
 import 'react-tooltip/dist/react-tooltip.css';
+import './styles/index.scss';
 
-const { MODE, VITE_APP_MATOMO_BASE_URL, VITE_APP_MATOMO_SITE_ID } = import.meta.env;
+const { MODE, VITE_APP_MATOMO_BASE_URL, VITE_APP_MATOMO_SITE_ID } = import.meta
+  .env;
 
 const queryClient = new QueryClient();
 
-const matomo = MODE === 'development' ? undefined : createInstance({
-  urlBase: VITE_APP_MATOMO_BASE_URL,
-  siteId: VITE_APP_MATOMO_SITE_ID,
-  configurations: {
-    disableCookies: true,
-  },
-});
+const matomo = MODE === 'development'
+  ? undefined
+  : createInstance({
+    urlBase: VITE_APP_MATOMO_BASE_URL,
+    siteId: VITE_APP_MATOMO_SITE_ID,
+    configurations: {
+      disableCookies: true,
+    },
+  });
 
 function PageTracker() {
   const { pathname } = useLocation();
@@ -34,18 +42,39 @@ function PageTracker() {
   return null;
 }
 
-ReactDOM.createRoot(document.getElementById('root')).render(
-  <React.StrictMode>
+// eslint-disable-next-line react/prop-types
+function RouterLink({ href, replace, target, ...props }) {
+  // eslint-disable-next-line jsx-a11y/anchor-has-content
+  if (target === '_blank') return <a href={href} target={target} {...props} />;
+  return <Link to={href} replace={replace} {...props} />;
+}
+
+document.documentElement.setAttribute('data-fr-scheme', 'light');
+
+function App() {
+  useEffect(() => {
+    document.documentElement.setAttribute('data-fr-scheme', 'light');
+  }, []);
+
+  return (
     <MatomoProvider value={matomo}>
-      <BrowserRouter>
-        <PageTracker />
-        <ToastContextProvider>
-          <QueryClientProvider client={queryClient}>
-            <ReactQueryDevtools />
-            <Router />
-          </QueryClientProvider>
-        </ToastContextProvider>
-      </BrowserRouter>
+      <DSFRConfig routerComponent={RouterLink}>
+        <BrowserRouter>
+          <PageTracker />
+          <ToastContextProvider>
+            <QueryClientProvider client={queryClient}>
+              <ReactQueryDevtools />
+              <Router />
+            </QueryClientProvider>
+          </ToastContextProvider>
+        </BrowserRouter>
+      </DSFRConfig>
     </MatomoProvider>
+  );
+}
+
+ReactDOM.createRoot(document.getElementById('root')).render(
+  <React.StrictMode>
+    <App />
   </React.StrictMode>,
 );
diff --git a/client/src/pages/actions/actionsOpenalexFeedback.jsx b/client/src/pages/actions/actionsOpenalexFeedback.jsx
@@ -21,12 +21,13 @@ export default function ActionsOpenalexFeedback({ allOpenalexCorrections }) {
   const feedback = () => {
     sendGitHubIssue({ data: allOpenalexCorrections, email: userEmail });
     toast({
-      description: `${allOpenalexCorrections.length} corrections to OpenAlex have been saved - 
+      description: `${allOpenalexCorrections.length} correction(s) to OpenAlex have been saved - 
         see <a href="https://github.com/dataesr/openalex-affiliations/issues" target="_blank">https://github.com/dataesr/openalex-affiliations/issues</a>`,
       id: 'saveOpenAlex',
       title: 'OpenAlex corrections sent',
       toastType: 'success',
     });
+    openModal();
   };
 
   useEffect(() => {
@@ -50,9 +51,9 @@ export default function ActionsOpenalexFeedback({ allOpenalexCorrections }) {
           Improve OpenAlex data
         </ModalTitle>
         <ModalContent>
-          {`You corrected RoR matching for ${allOpenalexCorrections.length} raw affiliations strings.`}
+          {`You corrected RoR matching for ${allOpenalexCorrections.length} raw affiliation(s) string(s).`}
           <TextInput
-            label="Please indicate your email"
+            label="Please indicate your email. Only an encrpted version of your email will be public."
             onChange={(e) => setUserEmail(e.target.value)}
             required
             type="email"

diff --git a/client/src/pages/affiliationsTab.jsx b/client/src/pages/affiliationsTab.jsx
@@ -6,10 +6,11 @@ import {
 import PropTypes from 'prop-types';
 import { useEffect, useState } from 'react';
 
+import AffiliationsView from './affiliationsView';
 import Gauge from '../components/gauge';
 import { status } from '../config';
+import { removeDiacritics } from '../utils/strings';
 import { renderButtons } from '../utils/works';
-import AffiliationsView from './affiliationsView';
 
 export default function AffiliationsTab({ affiliations, selectedAffiliations, setSelectedAffiliations, tagAffiliations }) {
   const [filteredAffiliations, setFilteredAffiliations] = useState([]);
@@ -27,8 +28,8 @@ export default function AffiliationsTab({ affiliations, selectedAffiliations, se
     }
     const timerTmp = setTimeout(() => {
       const filteredAffiliationsTmp = affiliations.filter((affiliation) => {
-        const regex = new RegExp(filteredAffiliationName);
-        return regex.test(affiliation.key.replace('[ source', ''));
+        const regex = new RegExp(removeDiacritics(filteredAffiliationName));
+        return regex.test(affiliation.key.replace('[ source: ', '').replace(' ]', ''));
       });
       setFilteredAffiliations(filteredAffiliationsTmp);
     }, 500);

diff --git a/client/src/pages/affiliationsView.jsx b/client/src/pages/affiliationsView.jsx
@@ -44,13 +44,13 @@ export default function AffiliationsView({
         <input
           className="fr-ml-1w"
           onChange={(e) => setFilteredAffiliationName(e.target.value)}
-          value={filteredAffiliationName}
           style={{
             border: '1px solid #ced4da',
             borderRadius: '4px',
             padding: '0.375rem 0.75rem',
             width: '100%',
           }}
+          value={filteredAffiliationName}
         />
       </Col>
     </Row>