Only show warning and planned offline date on banner edits

bannergress · Apr 27, 2022 · 048aa28 · 048aa28
1 parent 553500a
commit 048aa28
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 37 deletions.
diff --git a/src/components/advanced-options/AdvancedOptions.tsx b/src/components/advanced-options/AdvancedOptions.tsx
@@ -28,6 +28,7 @@ const AdvancedOptions: FC<AdvancedOptionsProps> = ({
   width,
   plannedOfflineDate,
   onChange,
+  isEdit,
 }) => (
   <Row className="banner-advanced-options">
     <Col span={12}>
@@ -66,28 +67,33 @@ const AdvancedOptions: FC<AdvancedOptionsProps> = ({
         value={width}
       />
     </Col>
-    <Col span={12}>
-      <h4>
-        <Trans i18nKey="banners.creation.step3.plannedOfflineDate.title">
-          Planned Offline Date
-        </Trans>
-      </h4>
-    </Col>
-    <Col span={12} style={{ textAlign: 'right' }}>
-      <DatePicker
-        onChange={(value: string | undefined) =>
-          onChange(value, 'bannerPlannedOfflineDate')
-        }
-        value={plannedOfflineDate}
-      />
-    </Col>
+    {isEdit && (
+      <>
+        <Col span={12}>
+          <h4>
+            <Trans i18nKey="banners.creation.step3.plannedOfflineDate.title">
+              Planned Offline Date
+            </Trans>
+          </h4>
+        </Col>
+        <Col span={12} style={{ textAlign: 'right' }}>
+          <DatePicker
+            onChange={(value: string | undefined) =>
+              onChange(value, 'bannerPlannedOfflineDate')
+            }
+            value={plannedOfflineDate}
+          />
+        </Col>
+      </>
+    )}
   </Row>
 )
 
 export interface AdvancedOptionsProps {
   type: BannerType
   width: number
   plannedOfflineDate: string | undefined
+  isEdit: boolean
   onChange: (
     val: string | number | undefined,
     type: 'bannerType' | 'bannerWidth' | 'bannerPlannedOfflineDate'

diff --git a/src/pages/create-banner/CreateBanner.tsx b/src/pages/create-banner/CreateBanner.tsx
@@ -744,7 +744,8 @@ class CreateBanner extends React.Component<
       unusedMissionsCount = ''
     }
 
-    const title = id
+    const isEdit = Boolean(id)
+    const title = isEdit
       ? i18n!.t('banners.creation.edit')
       : i18n!.t('banners.creation.new')
     const issues = getBannerIssues(
@@ -948,27 +949,31 @@ class CreateBanner extends React.Component<
                   this.onInputChange(e.target.value, 'bannerDescription')
                 }
               />
-              <h3>
-                <Trans i18nKey="banners.creation.step3.warning.title">
-                  Warning Text
-                </Trans>
-              </h3>
-              <span className="subtitle">
-                <Trans i18nKey="banners.creation.step3.warning.subtitle">
-                  Displays in a more noticeable color
-                </Trans>
-              </span>
-              <Input.TextArea
-                placeholder={i18n?.t('placeholders.startTyping')}
-                value={bannerWarning}
-                // Note: The antd minRows seems to have a -1 bug on Firefox. Shows always one fewer row than specified.
-                // Works well on other browser https://github.com/ant-design/ant-design/issues/30559
-                autoSize={{ minRows: 2 }}
-                maxLength={2000}
-                onChange={(e) =>
-                  this.onInputChange(e.target.value, 'bannerWarning')
-                }
-              />
+              {isEdit && (
+                <>
+                  <h3>
+                    <Trans i18nKey="banners.creation.step3.warning.title">
+                      Warning Text
+                    </Trans>
+                  </h3>
+                  <span className="subtitle">
+                    <Trans i18nKey="banners.creation.step3.warning.subtitle">
+                      Displays in a more noticeable color
+                    </Trans>
+                  </span>
+                  <Input.TextArea
+                    placeholder={i18n?.t('placeholders.startTyping')}
+                    value={bannerWarning}
+                    // Note: The antd minRows seems to have a -1 bug on Firefox. Shows always one fewer row than specified.
+                    // Works well on other browser https://github.com/ant-design/ant-design/issues/30559
+                    autoSize={{ minRows: 2 }}
+                    maxLength={2000}
+                    onChange={(e) =>
+                      this.onInputChange(e.target.value, 'bannerWarning')
+                    }
+                  />
+                </>
+              )}
               <h3>
                 <Trans i18nKey="banners.creation.step3.options">Options</Trans>
               </h3>
@@ -978,6 +983,7 @@ class CreateBanner extends React.Component<
                   width={bannerWidth}
                   plannedOfflineDate={bannerPlannedOfflineDate}
                   onChange={this.onInputChange}
+                  isEdit={isEdit}
                 />
               </div>
               <h3>