Move security key list to inside improving the security levle of eduID

SUNET · Mar 7, 2024 · 5fcb557 · 5fcb557
1 parent 664dac3
commit 5fcb557
Showing 1 changed file with 53 additions and 49 deletions.
diff --git a/src/components/Help.tsx b/src/components/Help.tsx
@@ -515,57 +515,61 @@ export function Help(): JSX.Element {
                   </article>
                 </AccordionItemTemplate>
               </Accordion>
+              {/* security key list */}
+              {approvedSecurityKeys?.entries ? (
+                <Accordion allowMultipleExpanded allowZeroExpanded id="eduid-security-keys-list">
+                  <AccordionItemTemplate
+                    uuid="security-key-list"
+                    title={
+                      <FormattedMessage
+                        defaultMessage="Currently valid physical Security Keys"
+                        description="Security keys list - heading"
+                      />
+                    }
+                    additionalInfo={null}
+                  >
+                    <article>
+                      <p>
+                        <FormattedMessage
+                          defaultMessage={`This is a list of names of maker and models of external security keys that kan be used for eduID. The list is updated once a month`}
+                          description="Security keys list - paragraph"
+                        />
+                      </p>
+                      <form>
+                        <fieldset className="key-update">
+                          <div>
+                            <label>
+                              <FormattedMessage
+                                defaultMessage="Next update"
+                                description="Security keys list - paragraph"
+                              />
+                            </label>
+                            <time>{formattedNextUpdateDate}</time>
+                          </div>
+                        </fieldset>
+                        <table className="keys">
+                          <thead>
+                            <tr>
+                              <th>No.</th>
+                              <th>Model</th>
+                            </tr>
+                          </thead>
+                          <tbody>
+                            {approvedSecurityKeys?.entries.map((item, index) => (
+                              <tr key={index}>
+                                <td>{index + 1}</td>
+                                <td>{item}</td>
+                              </tr>
+                            ))}
+                          </tbody>
+                        </table>
+                      </form>
+                    </article>
+                  </AccordionItemTemplate>
+                </Accordion>
+              ) : null}
             </article>
           </AccordionItemTemplate>
-          {/* security key list */}
-          {approvedSecurityKeys?.entries ? (
-            <AccordionItemTemplate
-              uuid="security-key-list"
-              title={
-                <FormattedMessage
-                  defaultMessage="Currently valid physical Security Keys"
-                  description="Security keys list - heading"
-                />
-              }
-              additionalInfo={null}
-            >
-              <article>
-                <p>
-                  <FormattedMessage
-                    defaultMessage={`This is a list of names of maker and models of external security keys that kan be used for eduID. The list is updated once a month`}
-                    description="Security keys list - paragraph"
-                  />
-                </p>
-                <form>
-                  <fieldset className="key-update">
-                    <div>
-                      <label>
-                        <FormattedMessage defaultMessage="Next update" description="Security keys list - paragraph" />
-                      </label>
-                      <time>{formattedNextUpdateDate}</time>
-                    </div>
-                  </fieldset>
-                  <table className="keys">
-                    <thead>
-                      <tr>
-                        <th>No.</th>
-                        <th>Model</th>
-                      </tr>
-                    </thead>
-                    <tbody>
-                      {approvedSecurityKeys?.entries.map((item, index) => (
-                        <tr key={index}>
-                          <td>{index + 1}</td>
-                          <td>{item}</td>
-                        </tr>
-                      ))}
-                    </tbody>
-                  </table>
-                </form>
-              </article>
-            </AccordionItemTemplate>
-          ) : null}
-
           <AccordionItemTemplate
             uuid="help-verification"
             title={