fix: handle errors

usebruno · Oct 11, 2023 · 1ba86c1 · 1ba86c1
1 parent f975254
commit 1ba86c1
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 4 deletions.
diff --git a/packages/bruno-app/src/components/CollectionSettings/ClientCertSettings/StyledWrapper.js b/packages/bruno-app/src/components/CollectionSettings/ClientCertSettings/StyledWrapper.js
@@ -5,6 +5,10 @@ const StyledWrapper = styled.div`
  width: 80px;
  }
 
+ input {
+ width: 200px;
+ }
+
  .textbox {
  border: 1px solid #ccc;
  padding: 0.15rem 0.45rem;

diff --git a/packages/bruno-app/src/components/CollectionSettings/ClientCertSettings/index.js b/packages/bruno-app/src/components/CollectionSettings/ClientCertSettings/index.js
@@ -13,10 +13,9 @@ const ClientCertSettings = ({ clientCertConfig, onUpdate, onRemove }) => {
  passphrase: ''
  },
  validationSchema: Yup.object({
- enabled: Yup.boolean(),
- domain: Yup.string(),
- cert: Yup.string(),
- key: Yup.string(),
+ domain: Yup.string().required(),
+ cert: Yup.string().required(),
+ key: Yup.string().required(),
  passphrase: Yup.string()
  }),
  onSubmit: (values) => {
@@ -62,18 +61,27 @@ const ClientCertSettings = ({ clientCertConfig, onUpdate, onRemove }) => {
  onChange={formik.handleChange}
  value={formik.values.domain || ''}
  />
+ {formik.touched.domain && formik.errors.domain ? (
+ <div className="ml-1 text-red-500">{formik.errors.domain}</div>
+ ) : null}
  </div>
  <div className="mb-3 flex items-center">
  <label className="settings-label" htmlFor="cert">
  Cert file
  </label>
  <input id="cert" type="file" name="cert" className="block" onChange={(e) => getFile(e.target)} />
+ {formik.touched.cert && formik.errors.cert ? (
+ <div className="ml-1 text-red-500">{formik.errors.cert}</div>
+ ) : null}
  </div>
  <div className="mb-3 flex items-center">
  <label className="settings-label" htmlFor="key">
  Key file
  </label>
  <input id="key" type="file" name="key" className="block" onChange={(e) => getFile(e.target)} />
+ {formik.touched.key && formik.errors.key ? (
+ <div className="ml-1 text-red-500">{formik.errors.key}</div>
+ ) : null}
  </div>
  <div className="mb-3 flex items-center">
  <label className="settings-label" htmlFor="passphrase">
@@ -87,6 +95,9 @@ const ClientCertSettings = ({ clientCertConfig, onUpdate, onRemove }) => {
  onChange={formik.handleChange}
  value={formik.values.passphrase || ''}
  />
+ {formik.touched.passphrase && formik.errors.passphrase ? (
+ <div className="ml-1 text-red-500">{formik.errors.passphrase}</div>
+ ) : null}
  </div>
  <div className="mt-6">
  <button type="submit" className="submit btn btn-sm btn-secondary">