Merge pull request #476 from johnduprey/react-dev

DNS layout tweaks
KelvinTegelaar · Jan 4, 2022 · 3c78be2 · 3c78be2
2 parents 02324af + 6e073cd
commit 3c78be2
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 34 deletions.
diff --git a/src/views/cipp/CIPPSettings.js b/src/views/cipp/CIPPSettings.js
@@ -65,9 +65,6 @@ const CIPPSettings = () => {
  <CNavItem active={active === 4} onClick={() => setActive(4)} href="#">
  Notifications
  </CNavItem>
- <CNavItem active={active === 5} onClick={() => setActive(5)} href="#">
- DNS
- </CNavItem>
  </CNav>
  <CTabContent>
  <CTabPane visible={active === 1} className="mt-3">
@@ -82,9 +79,6 @@ const CIPPSettings = () => {
  <CTabPane visible={active === 4} className="mt-3">
  <NotificationsSettings />
  </CTabPane>
- <CTabPane visible={active === 5} className="mt-3">
- <DNSSettings />
- </CTabPane>
  </CTabContent>
  </CippPage>
  )
@@ -157,7 +151,7 @@ const GeneralSettings = () => {
  <div>
  <CRow className="mb-3">
  <CCol md={6}>
- <CCard>
+ <CCard className="h-100">
  <CCardHeader>
  <CCardTitle>Permissions Check</CCardTitle>
  </CCardHeader>
@@ -181,7 +175,7 @@ const GeneralSettings = () => {
  </CCard>
  </CCol>
  <CCol md={6}>
- <CCard>
+ <CCard className="h-100">
  <CCardHeader>
  <CCardTitle>Clear Cache</CCardTitle>
  </CCardHeader>
@@ -206,8 +200,8 @@ const GeneralSettings = () => {
  </CCol>
  </CRow>
  <CRow className="mb-3">
- <CCol md={12}>
- <CCard>
+ <CCol md={6}>
+ <CCard className="h-100">
  <CCardHeader>
  <CCardTitle>Tenant Access Check</CCardTitle>
  </CCardHeader>
@@ -240,6 +234,9 @@ const GeneralSettings = () => {
  </CCardBody>
  </CCard>
  </CCol>
+ <CCol>
+ <DNSSettings />
+ </CCol>
  </CRow>
  </div>
  )
@@ -544,28 +541,36 @@ const DNSSettings = () => {
 
  return (
  <>
- {(editDnsConfigResult.isSuccess || editDnsConfigResult.isError) && (
- <CAlert color={editDnsConfigResult.isSuccess ? 'success' : 'danger'} visible={alertVisible}>
- {editDnsConfigResult.isSuccess
- ? editDnsConfigResult.data.Results
- : 'Error setting resolver'}
- </CAlert>
- )}
  {getDnsConfigResult.isUninitialized && getDnsConfig()}
  {getDnsConfigResult.isSuccess && (
- <CCard>
- <CCardHeader>DNS Resolver</CCardHeader>
- <CButtonGroup role="group" aria-label="Resolver">
- {resolvers.map((r, index) => (
- <CButton
- onClick={() => switchResolver(r)}
- color={r === getDnsConfigResult.data.Resolver ? 'primary' : 'secondary'}
- key={index}
+ <CCard className="h-100">
+ <CCardHeader>
+ <CCardTitle>DNS Resolver</CCardTitle>
+ </CCardHeader>
+ <CCardBody>
+ Select a DNS resolver to use for Domain Analysis. <br />
+ <CButtonGroup role="group" aria-label="Resolver" className="my-3">
+ {resolvers.map((r, index) => (
+ <CButton
+ onClick={() => switchResolver(r)}
+ color={r === getDnsConfigResult.data.Resolver ? 'primary' : 'secondary'}
+ key={index}
+ >
+ {r}
+ </CButton>
+ ))}
+ </CButtonGroup>
+ {(editDnsConfigResult.isSuccess || editDnsConfigResult.isError) && (
+ <CAlert
+ color={editDnsConfigResult.isSuccess ? 'success' : 'danger'}
+ visible={alertVisible}
  >
- {r}
- </CButton>
- ))}
- </CButtonGroup>
+ {editDnsConfigResult.isSuccess
+ ? editDnsConfigResult.data.Results
+ : 'Error setting resolver'}
+ </CAlert>
+ )}
+ </CCardBody>
  </CCard>
  )}
  </>

diff --git a/src/views/tenant/standards/IndividualDomain.js b/src/views/tenant/standards/IndividualDomain.js
@@ -74,8 +74,10 @@ const IndividualDomainCheck = () => {
  return (
  <CRow xs={{ cols: 1, gutter: 4 }} xl={{ cols: 2, gutter: 4 }} className="mb-5">
  <CCol>
- <CCard className="h-100">
- <CCardHeader component="h5">Email Security Domain Checker</CCardHeader>
+ <CCard className="page-card h-100">
+ <CCardHeader>
+ <CCardTitle>Email Security Domain Checker</CCardTitle>
+ </CCardHeader>
  <CCardBody>
  <Form
  initialValues={{ domain }}
@@ -133,9 +135,12 @@ const ResultsCard = ({ children, data, type }) => {
  const validationFails = results?.ValidationFails || []
 
  return (
- <CCard className="h-100">
- <CCardHeader component="h5">
- <StatusIcon type='finalstate' finalState={finalState} />{type} Results
+ <CCard className="page-card h-100">
+ <CCardHeader>
+ <CCardTitle>
+ <StatusIcon type="finalstate" finalState={finalState} />
+ {type} Results
+ </CCardTitle>
  </CCardHeader>
  <CCardBody>
  {/* records and additional information is specific to each type