add more styles and text to PublishDatasetHelpText.tsx

IQSS · Jun 28, 2024 · d981dcd · d981dcd
1 parent 110b9a6
commit d981dcd
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 37 deletions.
diff --git a/public/locales/en/publishDataset.json b/public/locales/en/publishDataset.json
@@ -1,8 +1,9 @@
 {
-  "draftQuestion": "Are you sure you want to publish this dataset? Once you do so, it must remain public",
+  "draftQuestion": "Are you sure you want to publish this dataset? Once you do so, it must remain public.",
   "previouslyReleasedQuestion": "Are you sure you want to republish this dataset?",
- "termsText1": "By default datasets are published with the CC0-\"Public Domain Dedication\" waiver. Learn more about the CC0 waiver <a href=\"{{cc0Link}}\">here</a>: ",
- "termsText2": "To publish with custom Terms of Use, click the Cancel button and go to the Terms tab for this dataset.",
+  "termsText1": "By default datasets are published with the CC0-\"Public Domain Dedication\" waiver. Learn more about the CC0 waiver <a href=\"{{cc0Link}}\">here</a>: ",
+  "termsText2": "To publish with custom Terms of Use, click the Cancel button and go to the Terms tab for this dataset.",
+  "selectVersion": "Select if this is a minor or major version update.",
   "continueButton": "Continue",
   "cancelButton": "Cancel"
 

diff --git a/src/sections/dataset/publish-dataset/PublishDatasetHelpText.module.scss b/src/sections/dataset/publish-dataset/PublishDatasetHelpText.module.scss
@@ -0,0 +1,12 @@
+@import "node_modules/@iqss/dataverse-design-system/src/lib/assets/styles/design-tokens/colors.module";
+
+.container {
+  border: 1px solid black;
+  padding: 10px;
+  margin: 10px;
+  background-color: rgb(220, 220, 220);
+}
+
+.warningText {
+  color: $dv-warning-color;
+}
diff --git a/src/sections/dataset/publish-dataset/PublishDatasetHelpText.tsx b/src/sections/dataset/publish-dataset/PublishDatasetHelpText.tsx
@@ -1,3 +1,4 @@
+import styles from './PublishDatasetHelpText.module.scss'
 import { useTranslation } from 'react-i18next'
 import { Trans } from 'react-i18next'
 
@@ -10,15 +11,11 @@ export function PublishDatasetHelpText({ releasedVersionExists }: PublishDataset
   const cc0Link = 'https://creativecommons.org/publicdomain/zero/1.0/'
   return (
     <>
-      {!releasedVersionExists && <p>{t('draftQuestion')}</p>}
-      {releasedVersionExists && <p>{t('previouslyReleasedQuestion')}</p>}
-      <div
-        style={{
-          border: '1px solid black',
-          padding: '10px',
-          margin: '10px',
-          backgroundColor: 'rgb(220, 220, 220)'
-        }}>
+      {!releasedVersionExists && <p className={styles.warningText}>{t('draftQuestion')}</p>}
+      {releasedVersionExists && (
+        <p className={styles.warningText}>{t('previouslyReleasedQuestion')}</p>
+      )}
+      <div className={styles.container}>
         <Trans
           t={t}
           i18nKey="termsText1"

diff --git a/src/sections/dataset/publish-dataset/PublishDatasetModal.tsx b/src/sections/dataset/publish-dataset/PublishDatasetModal.tsx
@@ -49,36 +49,38 @@ export function PublishDatasetModal({
       </Modal.Header>
       <Modal.Body>
         <PublishDatasetHelpText releasedVersionExists={releasedVersionExists} />
-        <p>Click to Publish the Dataset</p>
         {releasedVersionExists && (
-          <Form.RadioGroup onChange={handleVersionUpdateTypeChange} title={'Update Version'}>
-            <Form.Group.Radio
-              defaultChecked
-              onClick={handleVersionUpdateTypeChange}
-              name="update-type"
-              label="Minor Version"
-              id="update-type-minor"
-              value={VersionUpdateType.MINOR}
-            />
-            <Form.Group.Radio
-              onClick={handleVersionUpdateTypeChange}
-              name="update-type"
-              label="Major Version"
-              id="update-type-major"
-              value={VersionUpdateType.MAJOR}
-            />
-            {user?.superuser && (
+          <>
+            <p>{t('selectVersion')}</p>
+            <Form.RadioGroup onChange={handleVersionUpdateTypeChange} title={'Update Version'}>
               <Form.Group.Radio
+                defaultChecked
                 onClick={handleVersionUpdateTypeChange}
                 name="update-type"
-                label="Update Current Version"
-                id="update-type-current"
-                // TODO: Remove disabled when JSVersionUpdateType.UPDATE_CURRENT is available in js-dataverse
-                disabled={true}
-                value={VersionUpdateType.UPDATE_CURRENT}
+                label="Minor Version"
+                id="update-type-minor"
+                value={VersionUpdateType.MINOR}
               />
-            )}
-          </Form.RadioGroup>
+              <Form.Group.Radio
+                onClick={handleVersionUpdateTypeChange}
+                name="update-type"
+                label="Major Version"
+                id="update-type-major"
+                value={VersionUpdateType.MAJOR}
+              />
+              {user?.superuser && (
+                <Form.Group.Radio
+                  onClick={handleVersionUpdateTypeChange}
+                  name="update-type"
+                  label="Update Current Version"
+                  id="update-type-current"
+                  // TODO: Remove disabled when JSVersionUpdateType.UPDATE_CURRENT is available in js-dataverse
+                  disabled={true}
+                  value={VersionUpdateType.UPDATE_CURRENT}
+                />
+              )}
+            </Form.RadioGroup>
+          </>
         )}
       </Modal.Body>
       <Modal.Footer>