Moving towards multiple register parsers, to handle more exotic register types

src/app/registers/RegisterBrowser.tsx

@@ -74,12 +74,6 @@ export default function RegisterBrowser({ registers }: RegisterBrowserProps) {
     register.description.toLowerCase().includes(searchTerm.toLowerCase())
   );
 
-  const getDefaultActiveKey = (register: Register) => {
-    if (register.common) return 'common';
-    if (register.read) return 'read';
-    if (register.write) return 'write';
-    return '';
-  };
 
   return (
     <Container fluid>
@@ -92,12 +86,9 @@ export default function RegisterBrowser({ registers }: RegisterBrowserProps) {
         />
       </Form.Group>
       <Row>
-        {filteredRegisters.map(register => {
-          const defaultActiveKey = getDefaultActiveKey(register);
-          return (
-              <RegisterDetail key={register.hex_address} register={register} defaultActiveKey={defaultActiveKey} />
-          );
-        })}
+        {filteredRegisters.map(register => (
+              <RegisterDetail key={register.hex_address} register={register} />
+        ))}
       </Row>
     </Container>
   );

src/app/registers/RegisterDetail.tsx

@@ -10,15 +10,12 @@ import * as Icon from 'react-bootstrap-icons';
 /**
  * A client-side component that displays the details of a single register.
  * @param register The register object to display.
- * @param defaultActiveKey The default active tab to display.
  * @returns A React component that displays the register details.
  */
 export default function RegisterDetail({
   register,
-  defaultActiveKey,
 }: {
   register: Register;
-  defaultActiveKey?: string;
 }) {
   const [showSource, setShowSource] = useState(false);
 
@@ -27,9 +24,7 @@ export default function RegisterDetail({
         <Card>
           <Card.Header>
             <code>{register.hex_address}</code> ( {register.dec_address} ) &nbsp;
-            {/*<Link href={`https://wiki.specnext.dev/${encodeURIComponent((register.name).replace(' ','_'))}_Register`} className="text-decoration-none">*/}
               <strong>{register.name}</strong> {register.issue_4_only && <span className="badge bg-danger">Issue 4 Only</span>}
-            {/*</Link>*/}
             <div className="float-end small text-muted">
               <Link href={`https://wiki.specnext.dev/${encodeURIComponent((register.name).replace(' ','_'))}_Register`} className="text-decoration-none btn btn-sm btn-primary" title="Open wiki">
                 <Icon.Wikipedia />
@@ -45,20 +40,27 @@ export default function RegisterDetail({
             </div>
           </Card.Header>
           <Card.Body>
-            <Tabs defaultActiveKey={defaultActiveKey} id={`register-tabs-${register.hex_address}`}>
-              {register.common && <Tab eventKey="common" title="Read/Write">{renderAccess(register.common)}</Tab>}
-              {register.read && <Tab eventKey="read" title="Read">{renderAccess(register.read)}</Tab>}
-              {register.write && <Tab eventKey="write" title="Write">{renderAccess(register.write)}</Tab>}
-            </Tabs>
-            {register.notes.map((note, index) => (
-                <p key={index} className="small text-muted">{note.ref} {note.text}</p>
+            { register.modes.map((mode, idx) => (
+              <div key={idx} className={idx > 0 ? 'mt-4' : ''}>
+                {register.modes.length > 1 && (
+                  <h5 className="mb-3">Mode {idx + 1}</h5>
+                )}
+                <Tabs id={`register-tabs-${register.hex_address}-${idx}`}>
+                  {mode.common && <Tab eventKey="common" title="Read/Write">{renderAccess(mode.common)}</Tab>}
+                  {mode.read && <Tab eventKey="read" title="Read">{renderAccess(mode.read)}</Tab>}
+                  {mode.write && <Tab eventKey="write" title="Write">{renderAccess(mode.write)}</Tab>}
+                </Tabs>
+                {mode.notes && mode.notes.map((note, index) => (
+                  <p key={index} className="small text-muted">{note.ref} {note.text}</p>
+                ))}
+                {mode.text && mode.text.length > 0 && (
+                  <div className="mt-3">
+                    <h6>Notes:</h6>
+                    <pre>{mode.text}</pre>
+                  </div>
+                )}
+              </div>
             ))}
-            {register.text && register.text.length > 0 && (
-                <div className="mt-3">
-                  <h5>Notes:</h5>
-                  <pre>{register.text}</pre>
-                </div>
-            )}
           </Card.Body>
         </Card>
 

src/app/registers/[hex]/page.tsx

@@ -13,7 +13,6 @@ export default async function RegisterDetailPage({ params }: { params: { hex: st
 
     if (!register) return notFound();
 
-    const defaultActiveKey = register.common ? 'common' : (register.read ? 'read' : (register.write ? 'write' : undefined));
 
     return (
         <Container fluid className="py-4">
@@ -21,7 +20,7 @@ export default async function RegisterDetailPage({ params }: { params: { hex: st
                 <Link href="/registers" className="btn btn-secondary">← Back to Registers</Link>
             </div>
             <Row>
-                <RegisterDetail register={register} defaultActiveKey={defaultActiveKey} />
+                <RegisterDetail register={register} />
             </Row>
         </Container>
     );