Remove useMemo hook, fix HTML validation errors in table (#574)

GetStream · May 16, 2024 · 0feb77e · 0feb77e
2 parents 8fca7b6 + 3497238
commit 0feb77e
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 24 deletions.
diff --git a/docusaurus/video/docusaurus/docs/api/_common_/CallEventModels.jsx b/docusaurus/video/docusaurus/docs/api/_common_/CallEventModels.jsx
@@ -22,19 +22,23 @@ const CallEventModels = () => {
     <React.Fragment>
       <table>
         <thead>
-          <th>Name</th>
-          <th>Description</th>
-        </thead>
-        {events.map((event) => (
           <tr>
-            <td>
-              <a href={'#' + event.key}>
-                <code>{event.type}</code>
-              </a>
-            </td>
-            <td>{event.description}</td>
+            <th>Name</th>
+            <th>Description</th>
           </tr>
-        ))}
+        </thead>
+        <tbody>
+          {events.map((event) => (
+            <tr key={event.type}>
+              <td>
+                <a href={'#' + event.key}>
+                  <code>{event.type}</code>
+                </a>
+              </td>
+              <td>{event.description}</td>
+            </tr>
+          ))}
+        </tbody>
       </table>
       <OpenApiModels
         modelFilter={filter}

diff --git a/docusaurus/video/docusaurus/docs/api/_common_/OpenApiModels.jsx b/docusaurus/video/docusaurus/docs/api/_common_/OpenApiModels.jsx
@@ -1,15 +1,13 @@
 import React from 'react';
 import { parseModel } from './open-api-model-parser';
 
-const OpenApiModels = ({ modelName, modelFilter, recursive = true, apiJson }) => {
-
-  const models = React.useMemo(() => {
-    if (!modelName && !modelFilter) {
-      return [];
-    }
-    return parseModel({modelName, modelFilter, recursive, apiJson});
-  }, [modelName, modelFilter]);
-
+const OpenApiModels = ({
+  modelName,
+  modelFilter,
+  recursive = true,
+  apiJson,
+}) => {
+  const models = parseModel({ modelName, modelFilter, recursive, apiJson });
   return (
     <div>
       {models.map((model) => (
@@ -25,17 +23,34 @@ const OpenApiModels = ({ modelName, modelFilter, recursive = true, apiJson }) =>
               </tr>
             </thead>
             <tbody>
-              {model.properties.map(p => {
+              {model.properties.map((p) => {
                 return (
                   <tr key={model.name + p.name}>
                     <td data-testid={model.name + '-' + p.name + '-name'}>
                       <code>{p.name}</code>
                     </td>
                     <td data-testid={model.name + '-' + p.name + '-type'}>
-                      {p.type.definitionLink ? <a data-testid={model.name + '-' + p.name + '-typelink'} href={p.type.definitionLink}><code>{p.type.formattedName}</code></a> : <code>{p.type.formattedName}</code>}
+                      {p.type.definitionLink ? (
+                        <a
+                          data-testid={model.name + '-' + p.name + '-typelink'}
+                          href={p.type.definitionLink}
+                        >
+                          <code>{p.type.formattedName}</code>
+                        </a>
+                      ) : (
+                        <code>{p.type.formattedName}</code>
+                      )}
+                    </td>
+                    <td
+                      data-testid={model.name + '-' + p.name + '-description'}
+                    >
+                      {p.description || '-'}
+                    </td>
+                    <td
+                      data-testid={model.name + '-' + p.name + '-constraints'}
+                    >
+                      {p.constraints.join(', ') || '-'}
                     </td>
-                    <td data-testid={model.name + '-' + p.name + '-description'}>{p.description || '-'}</td>
-                    <td data-testid={model.name + '-' + p.name + '-constraints'}>{p.constraints.join(', ') || '-'}</td>
                   </tr>
                 );
               })}