TLS features

src/components/misc/Loader.tsx

@@ -16,6 +16,12 @@ const LoaderContainer = styled(StyledCard)`
   gap: 2rem;
   height: 50vh;
   transition: all 0.3s ease-in-out;
+  p.loadTimeInfo {
+    text-align: center;
+    margin: 0;
+    color: ${colors.textColorSecondary};
+    opacity: 0.5;
+  }
   &.flex {
     display: flex;
   }
@@ -46,7 +52,7 @@ const StyledSvg = styled.svg`
 const Loader = (props: { show: boolean }): JSX.Element => {
   return (
   <LoaderContainer className={props.show ? '' : 'finished'}>
-    <Heading as="h4" color={colors.primary}>Fetching data...</Heading>
+    <Heading as="h4" color={colors.primary}>Crunching data...</Heading>
     <StyledSvg version="1.1" id="L7" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
       viewBox="0 0 100 100" enableBackground="new 0 0 100 100">
       <path fill="#fff" d="M31.6,3.5C5.9,13.6-6.6,42.7,3.5,68.4c10.1,25.7,39.2,38.3,64.9,28.1l-3.1-7.9c-21.3,8.4-45.4-2-53.8-23.3
@@ -83,6 +89,10 @@ const Loader = (props: { show: boolean }): JSX.Element => {
             repeatCount="indefinite" />
       </path>
     </StyledSvg>
+    <p className="loadTimeInfo">
+      It may take up-to a minute for all jobs to complete<br />
+      You can view preliminary results as they come in below
+    </p>
   </LoaderContainer>
   );
 }

src/components/misc/ProgressBar.tsx

@@ -195,7 +195,7 @@ const jobNames = [
   'quality',
   'cookies',
   'ssl',
-  // 'server-info',
+  'server-info',
   'redirects',
   'robots-txt',
   'dnssec',
@@ -219,6 +219,9 @@ const jobNames = [
   'archives',
   'block-lists',
   'threats',
+  'tls-cipher-suites',
+  'tls-security-config',
+  'tls-client-support',
 ] as const;
 
 export const initialJobs = jobNames.map((job: string) => {

src/utils/docs.ts

@@ -481,6 +481,14 @@ const docs: Doc[] = [
     ],
     screenshot: '',
   },
+  {
+    id: 'tls',
+    title: 'TLS Configuration',
+    description: '',
+    use: '',
+    resources: [],
+    screenshot: '',
+  },
   // {
   //   id: '',
   //   title: '',