Merge pull request #161 from leonardosfl/fix-158

Show login required modal on dashboard
PREreview · Aug 14, 2020 · 0dcbc3a · 0dcbc3a
2 parents 077aad0 + 15e0625
commit 0dcbc3a
Show file tree

Hide file tree

Showing 4 changed files with 117 additions and 28 deletions.
diff --git a/src/components/app.js b/src/components/app.js
@@ -58,7 +58,7 @@ export default function App({ user }) {
                   </ToCPage>
                 </Route>
 
-                <Route exact={true} path="/dashboard">
+                <Route exact={true} path="/dashboard/:new(new)?">
                   <Dashboard />
                 </Route>
 

diff --git a/src/components/dashboard.js b/src/components/dashboard.js
@@ -11,12 +11,13 @@ import Org from './org';
 
 // hooks
 import { usePreprintSearchResults } from '../hooks/api-hooks';
+import { useNewPreprints } from '../hooks/ui-hooks';
 
 // utils
 import { checkIfIsModerated } from '../utils/actions';
 import { getUsersRank, isYes } from '../utils/stats';
 import { createPreprintQs, apifyPreprintQs } from '../utils/search';
-import { getId } from '../utils/jsonld'
+import { getId, unprefix } from '../utils/jsonld'
 
 
 // contexts
@@ -27,6 +28,7 @@ import AddButton from './add-button';
 import Banner from "./banner.js";
 import Button from './button';
 
+import LoginRequiredModal from './login-required-modal';
 import Checkbox from './checkbox';
 import SortOptions from './sort-options';
 import HeaderBar from './header-bar';
@@ -35,6 +37,9 @@ import SearchBar from './search-bar';
 import XLink from './xlink';
 import RecentActivity from './recent-activity'
 import ActiveUser from './active-user'
+import PrivateRoute from './private-route';
+import NewPreprint from './new-preprint';
+import Modal from './modal';
 
 
 export default function Dashboard() {
@@ -43,6 +48,7 @@ export default function Dashboard() {
   const [user] = useUser();
 
   const [loginModalOpenNext, setLoginModalOpenNext] = useState(null);
+  const [newPreprints, setNewPreprints] = useNewPreprints();
 
   const apiQs = apifyPreprintQs(
     location.search,
@@ -54,7 +60,7 @@ export default function Dashboard() {
 
   useEffect(() => {
     if (!params.get('q')) {
-      history.replace({ search: createPreprintQs({ text: covidTerms }, location.search) });
+      history.replace({ search: createPreprintQs({ text: covidTerms }, location.search), state: location.state });
     }
   }, [apiQs]);
 
@@ -111,15 +117,21 @@ export default function Dashboard() {
   const handleNewRequest = useCallback(
     preprint => {
       if (user) {
-        history.push('/new', {
-          preprint: omit(preprint, ['potentialAction']),
-          tab: 'request',
-          isSingleStep: true
+        history.push({
+          pathname: '/dashboard/new',
+          search: history.location.search,
+          state: {
+            preprint: omit(preprint, ['potentialAction']),
+            tab: 'request',
+            isSingleStep: true
+          }
         });
       } else {
-        setLoginModalOpenNext(
-          `/new?identifier=${preprint.doi || preprint.arXivId}&tab=request`
-        );
+        const search = new URLSearchParams(location.search);
+        search.set('identifier', preprint.doi || preprint.arXivId);
+        search.set('tab', 'request');
+
+        setLoginModalOpenNext(`/dashboard/new?${search}`);
       }
     },
     [user, history]
@@ -128,13 +140,18 @@ export default function Dashboard() {
   const handleNew = useCallback(
     preprint => {
       if (user) {
-        history.push('/new', {
-          preprint: omit(preprint, ['potentialAction'])
+        history.push({
+          pathname: '/dashboard/new',
+          search: history.location.search,
+          state: {
+            preprint: omit(preprint, ['potentialAction'])
+          }
         });
       } else {
-        setLoginModalOpenNext(
-          `/new?identifier=${preprint.doi || preprint.arXivId}`
-        );
+        const search = new URLSearchParams(location.search);
+        search.set('identifier', preprint.doi || preprint.arXivId);
+
+        setLoginModalOpenNext(`/dashboard/new?${search}`);
       }
     },
     [user, history]
@@ -143,15 +160,21 @@ export default function Dashboard() {
   const handleNewReview = useCallback(
     preprint => {
       if (user) {
-        history.push('/new', {
-          preprint: omit(preprint, ['potentialAction']),
-          tab: 'review',
-          isSingleStep: true
+        history.push({
+          pathname: '/dashboard/new',
+          search: history.location.search,
+          state: {
+            preprint: omit(preprint, ['potentialAction']),
+            tab: 'review',
+            isSingleStep: true
+          }
         });
       } else {
-        setLoginModalOpenNext(
-          `/new?identifier=${preprint.doi || preprint.arXivId}&tab=review`
-        );
+        const search = new URLSearchParams(location.search);
+        search.set('identifier', preprint.doi || preprint.arXivId);
+        search.set('tab', 'review');
+
+        setLoginModalOpenNext(`/dashboard/new?${search}`);
       }
     },
     [user, history]
@@ -168,6 +191,53 @@ export default function Dashboard() {
           setShowLeftPanel(!showLeftPanel);
         }}
       />
+      {loginModalOpenNext && (
+        <LoginRequiredModal
+          next={loginModalOpenNext}
+          onClose={() => {
+            setLoginModalOpenNext(null);
+          }}
+        />
+      )}
+      <PrivateRoute path="/dashboard/new" exact={true}>
+        <Modal
+          showCloseButton={true}
+          title="Add Entry"
+          onClose={() => {
+            history.push({ pathname: '/dashboard', search: location.search });
+          }}
+        >
+          <Helmet>
+            <title>Rapid PREreview • Add entry</title>
+          </Helmet>
+          <NewPreprint
+            user={user}
+            onCancel={() => {
+              history.push({ pathname: '/dashboard', search: location.search });
+            }}
+            onSuccess={(preprint, isNew) => {
+              history.push({ pathname: '/dashboard', search: location.search });
+              if (
+                isNew &&
+                !newPreprints.some(
+                  _preprint => getId(_preprint) === getId(preprint)
+                )
+              ) {
+                setNewPreprints(newPreprints.concat(preprint));
+              }
+            }}
+            onViewInContext={({ preprint, tab }, isNew) => {
+              history.push(
+                `/${unprefix(preprint.doi || preprint.arXivId)}`,
+                {
+                  preprint: omit(preprint, ['potentialAction']),
+                  tab
+                }
+              );
+            }}
+          />
+        </Modal>
+      </PrivateRoute>
       <article className="toc-page__main">
         <div className="toc-page__body">
           <section className="dashboard home__main">
@@ -324,6 +394,23 @@ export default function Dashboard() {
                   <div>No more preprints.</div>
                 ) : (
                   <ul className="dashboard__preprint-list">
+                    {newPreprints.length > 0 && (
+                      newPreprints.map(preprint => (
+                        <li key={getId(preprint)} className="dashboard__preprint-list__item">
+                          <PreprintCard
+                            isNew={true}
+                            isDashboardCard={true}
+                            user={user}
+                            preprint={preprint}
+                            onNewRequest={handleNewRequest}
+                            onNew={handleNew}
+                            onNewReview={handleNewReview}
+                            hoveredSortOption={hoveredSortOption}
+                            sortOption={params.get('sort') || 'score'}
+                          />
+                        </li>
+                      ))
+                    )}
                     {preprints.rows.length ? preprints.rows.map(row => (
                       <li key={row.id} className="dashboard__preprint-list__item">
                         <PreprintCard
@@ -381,12 +468,12 @@ export default function Dashboard() {
                   <AddButton
                     onClick={e => {
                       if (user) {
-                        history.push('/new');
+                        history.push({ pathname: '/dashboard/new', search: location.search });
                       } else {
-                        setLoginModalOpenNext('/new');
+                        setLoginModalOpenNext(`/dashboard/new?${location.search}`);
                       }
                     }}
-                    disabled={location.pathname === '/new'}
+                    disabled={location.pathname === '/dashboard/new'}
                   />
                 </div>
                 <div className="dashboard__activity">

diff --git a/src/components/new-preprint.js b/src/components/new-preprint.js
@@ -214,7 +214,8 @@ function StepPreprint({
             if (location.search) {
               const qs = new URLSearchParams(location.search);
               if (qs.get('identifier')) {
-                history.replace('/new');
+                qs.delete('identifier');
+                history.replace({ pathname: location.pathname, search: qs.toString() });
               }
             }
 

diff --git a/src/components/preprint-card.js b/src/components/preprint-card.js
@@ -39,7 +39,8 @@ export default function PreprintCard({
   onNew,
   sortOption,
   hoveredSortOption,
-  isNew = false
+  isNew = false,
+  isDashboardCard = false,
 }) {
   const [isOpened, setIsOpened] = useState(false);
 
@@ -93,7 +94,7 @@ export default function PreprintCard({
   return (
     <Fragment>
       <div
-        className={classNames('preprint-card', { 'preprint-card--new': isNew })}
+        className={classNames('preprint-card', { 'preprint-card--new': isNew && !isDashboardCard })}
       >
         <div className="preprint-card__contents">
           <div className="preprint-card__header">