CORE-5136: temp sw view

components/statsCard/statsCard.jsx

@@ -55,36 +55,35 @@ const StatsCard = ({
         {description}
       </Card.Description>
     </div>
-    {tempDisabled ? (
-      <div>{tempDisabled}</div>
-    ) : (
-      <>
-        <div>
-          {loading ? (
-            <div className={styles.loadingContainer}>
-              <div className={styles.loadingStroke} />
-            </div>
-          ) : (
-            <div className={styles.innerContent}>
-              <p className={countClassName || styles.subFooter}>
-                {formatNumber(count || 0)}
-              </p>
-            </div>
-          )}
-        </div>
-        <div className={styles.footerWrapper}>
-          {showAction && !checkBillingType && (
-            <Button
-              onClick={onActionClick || undefined}
-              href={actionHref}
-              variant="contained"
-            >
-              {actionText}
-            </Button>
-          )}
-        </div>
-      </>
-    )}
+    <>
+      <div>
+        {loading ? (
+          <div className={styles.loadingContainer}>
+            <div className={styles.loadingStroke} />
+          </div>
+        ) : (
+          <div className={styles.innerContent}>
+            <p className={classNames.use(styles.subFooter, countClassName)}>
+              {formatNumber(count || 0)}
+            </p>
+          </div>
+        )}
+      </div>
+      <div className={styles.footerWrapper}>
+        {showAction && !checkBillingType && (
+          <Button
+            onClick={onActionClick || undefined}
+            // href={actionHref}
+            {...(tempDisabled && count === 0
+              ? { disabled: true }
+              : { href: actionHref })}
+            variant="contained"
+          >
+            {actionText}
+          </Button>
+        )}
+      </div>
+    </>
   </Card>
 )
 

templates/das/index.jsx

@@ -84,7 +84,7 @@ const DasPageTemplate = observer(
               actionHref="#dasTable"
               showInfo
               infoText={dasText.reviewCard.info}
-              countClassName={styles.inputCount}
+              countClassName={styles.inputDark}
             />
             <PdfUploadChecker
               pdfLoading={globalStore.dataProvider.dasPdfLoading}

templates/das/styles.module.css

@@ -288,3 +288,7 @@
   background-color: #f2f2f2;
   border-radius: 2px;
 }
+
+.input-dark {
+  color: #ff5f52;
+}

templates/research-software/components/notificationModal.jsx

@@ -3,6 +3,7 @@ import { Button, Modal } from '@oacore/design'
 
 import styles from './styles.module.css'
 import Markdown from '../../../components/markdown'
+import email from '../../../components/upload/assets/emailConfirmation.svg'
 
 const NotificationModal = ({
   title,
@@ -12,18 +13,22 @@ const NotificationModal = ({
 }) => (
   <div>
     <Modal aria-label="modal" hideManually>
-      <div className={styles.modalWrapper}>
+      <div className={styles.successContent}>
         <h5 className={styles.modalTitle}>{title}</h5>
-        <Markdown className={styles.modalDescription}>{description}</Markdown>
-        <div className={styles.endButton}>
-          <Button
-            onClick={handleButtonClose}
-            variant="contained"
-            className={styles.button}
-          >
-            {action}
-          </Button>
+        <div className={styles.imgWrapper}>
+          <img src={email} alt="email" />
         </div>
+        <Markdown className={styles.modalDescription}>{description}</Markdown>
+      </div>
+
+      <div className={styles.buttonGroup}>
+        <Button
+          onClick={handleButtonClose}
+          variant="contained"
+          className={styles.closeButton}
+        >
+          {action}
+        </Button>
       </div>
     </Modal>
   </div>

templates/research-software/components/styles.module.css

@@ -35,9 +35,22 @@
   letter-spacing: 0.01px;
 }
 
-.end-button {
+.img-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.img-wrapper img {
+  width: 128px;
+  height: auto;
+}
+
+.button-group {
   display: flex;
   align-items: flex-end;
   justify-content: flex-end;
   width: 100%;
+  gap: 10px;
+  margin-top: 24px;
 }

templates/research-software/index.jsx

@@ -1,7 +1,6 @@
 import React, { useContext, useEffect, useState } from 'react'
 import { classNames } from '@oacore/design/lib/utils'
 import { observer } from 'mobx-react-lite'
-import { Button } from '@oacore/design'
 
 import styles from './styles.module.css'
 import texts from '../../texts/sw/sw.yml'
@@ -219,29 +218,12 @@ const SwPageTemplate = observer(
               wholeWidthCard
               actionHref="#sendSwTable"
               onActionClick={() => handleStatsCardClick('sent')}
-              countClassName={styles.inputCount}
-              tempDisabled={
-                <div className={styles.settingsDescriptionWrapper}>
-                  <Icon src="#alert" className={styles.cardIconWarning} />
-                  <div className={styles.settingsDescriptionTextWrapper}>
-                    <div className={styles.settingsDescriptionText}>
-                      Your repository is not configured to support the automatic
-                      notification of software mentions, please go to{' '}
-                      <Button
-                        className={styles.clickAction}
-                        variant="text"
-                        onClick={toggleDescription}
-                      >
-                        Settings
-                      </Button>{' '}
-                      to activate it.
-                    </div>
-                  </div>
-                </div>
-              }
+              countClassName={styles.sendCount}
+              tempDisabled
             />
             <StatsCard
               title={texts.statsCards.responded.title}
+              description={texts.statsCards.responded.description}
               actionText={texts.statsCards.responded.action}
               showInfo
               infoText={texts.statsCards.responded.tooltip}
@@ -250,25 +232,8 @@ const SwPageTemplate = observer(
               count={globalStore.dataProvider.swData.counts?.responded}
               actionHref="#respondSwTable"
               onActionClick={() => handleStatsCardClick('responded')}
-              tempDisabled={
-                <div className={styles.settingsDescriptionWrapper}>
-                  <Icon src="#alert" className={styles.cardIconWarning} />
-                  <div className={styles.settingsDescriptionTextWrapper}>
-                    <div className={styles.settingsDescriptionText}>
-                      Your repository is not configured to support the automatic
-                      notification of software mentions, please go to{' '}
-                      <Button
-                        className={styles.clickAction}
-                        variant="text"
-                        onClick={toggleDescription}
-                      >
-                        Settings
-                      </Button>{' '}
-                      to activate it.
-                    </div>
-                  </div>
-                </div>
-              }
+              countClassName={styles.respondedCount}
+              tempDisabled
             />
           </div>
         </div>

templates/research-software/styles.module.css

@@ -352,3 +352,11 @@
   width: 10%;
   max-width: 5rem;
 }
+
+.send-count {
+  color: #c6a700;
+}
+
+.responded-count {
+  color: #424242;
+}

templates/rrs-policy/index.jsx

@@ -78,7 +78,7 @@ const RrsPageTemplate = ({
             actionHref="#rrsTable"
             showInfo
             infoText={rrs.reviewCard.info}
-            countClassName={styles.inputCount}
+            countClassName={styles.inputDark}
           />
           <PdfUploadChecker
             pdfLoading={rrsPdfLoading}

templates/rrs-policy/styles.module.css

@@ -64,6 +64,10 @@
   color: #ff5f52;
 }
 
+.input-dark {
+  color: #ff5f52;
+}
+
 .item-count-indicator {
   margin-bottom: 14px;
   font-size: 14px;

texts/sw/sw.yml

@@ -63,7 +63,7 @@ actions:
     key: outputUrl
 
 notificationModal:
-    title: Automatic notification of software mentions
+    title: Notification successfully sent
     description: |
-      This functionality uses [COAR Notify](https://coar-notify.net) to enable the automatic enrichment of software mentions in your repository record. It is currently in beta version, if you are interested in enabling it please contact us at **theteam@core.ac.uk**
+      The software mention should now be in your repository inbox.
     action: Close