From 1e1149eb7876cdbcc60c47a56dfdf8471d0a9c9e Mon Sep 17 00:00:00 2001
From: Prathamesh Musale <prathamesh.musale0@gmail.com>
Date: Wed, 23 Oct 2024 08:00:12 +0000
Subject: [PATCH] Handle undefined attributes in records resolver (#61)

Part of [Create a public laconicd testnet](https://www.notion.so/Create-a-public-laconicd-testnet-896a11bdd8094eff8f1b49c0be0ca3b8)

Handles the error in `LOOKUP` tab in the console:
```bash
Error: Cannot destructure property 'limit' of 'attributes' as it is undefined.
```

Co-authored-by: IshaVenikar <ishavenikar7@gmail.com>
Reviewed-on: https://git.vdb.to/cerc-io/laconic-console/pulls/61
Co-authored-by: Prathamesh Musale <prathamesh.musale0@gmail.com>
Co-committed-by: Prathamesh Musale <prathamesh.musale0@gmail.com>
---
 .../panels/registry/RegistryRecords.js        | 152 +++++++++---------
 src/resolvers.js                              |   2 +-
 2 files changed, 73 insertions(+), 81 deletions(-)

diff --git a/src/containers/panels/registry/RegistryRecords.js b/src/containers/panels/registry/RegistryRecords.js
index 46cdc42..9300d5c 100644
--- a/src/containers/panels/registry/RegistryRecords.js
+++ b/src/containers/panels/registry/RegistryRecords.js
@@ -11,8 +11,8 @@ import Button from '@material-ui/core/Button';
 import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import TableBody from '@material-ui/core/TableBody';
-import TableFooter from '@material-ui/core/TableFooter';
 import TablePagination from '@material-ui/core/TablePagination';
+import { Paper, TableContainer, } from '@material-ui/core';
 
 import WNS_RECORDS from '../../../gql/wns_records.graphql';
 
@@ -108,86 +108,78 @@ const RegistryRecords = ({ type }) => {
   };
 
   return (
-    <Table>
-      <TableHead>
-        <TableRow>
-          <TableCell onClick={sortBy('attributes.type')} size='medium'>Type</TableCell>
-          <TableCell onClick={sortBy('names[0]')}>Registered Names</TableCell>
-          <TableCell onClick={sortBy('attributes.version')} size='small'>Version</TableCell>
-          <TableCell onClick={sortBy('attributes.name')}>Display Name</TableCell>
-          <TableCell onClick={sortBy('createTime')} size='small'>Created</TableCell>
-          <TableCell onClick={sortBy('attributes.package')}>Package</TableCell>
-          <TableCell size='icon' />
-        </TableRow>
-      </TableHead>
-      <TableBody>
-        {records.sort(sorter)
-          .map((record) => {
-            const { id, names, createTime, attributes: { type, name: displayName, fileName, version, description, service, package: pkg } } = record;
-
-            let pkgLink;
-            let appLinks;
-
-            if (pkg) {
-              pkgLink = (<PackageLink config={config} type={type} pkg={pkg} />);
-            }
-
-            if (type === 'lrn:app') {
-              appLinks = (
-                <>
-                  {(names || []).map(lrn =>
-                    <div key={lrn}>
-                      <AppLink config={config} lrn={lrn} />
-                    </div>
-                  )}
-                </>
+    <Paper style={{
+      width: '100%',
+    }}>
+      <TableContainer>
+        <Table>
+          <TableHead>
+            <TableRow>
+              <TableCell onClick={sortBy('attributes.type')} size='medium'>Type</TableCell>
+              <TableCell onClick={sortBy('names[0]')}>Registered Names</TableCell>
+              <TableCell onClick={sortBy('attributes.version')} size='small'>Version</TableCell>
+              <TableCell onClick={sortBy('attributes.name')}>Display Name</TableCell>
+              <TableCell onClick={sortBy('createTime')} size='small'>Created</TableCell>
+              <TableCell onClick={sortBy('attributes.package')}>Package</TableCell>
+              <TableCell size='icon' />
+            </TableRow>
+          </TableHead>
+          <TableBody>
+            {records.sort(sorter).map((record) => {
+              const { id, names, createTime, attributes: { type, name: displayName, fileName, version, description, service, package: pkg } } = record;
+
+              let pkgLink;
+              let appLinks;
+
+              if (pkg) {
+                pkgLink = (<PackageLink config={config} type={type} pkg={pkg} />);
+              }
+
+              if (type === 'lrn:app') {
+                appLinks = (
+                  <>
+                    {(names || []).map(lrn =>
+                      <div key={lrn}>
+                        <AppLink config={config} lrn={lrn} />
+                      </div>
+                    )}
+                  </>
+                );
+              }
+
+              return (
+                <TableRow key={id} size='small'>
+                  <TableCell monospace>{type}</TableCell>
+                  <TableCell monospace>
+                    {appLinks || (names || []).map(name => <div key={name}>{name}</div>)}
+                  </TableCell>
+                  <TableCell monospace>{version}</TableCell>
+                  <TableCell>{displayName || service || fileName || description}</TableCell>
+                  <TableCell>{moment.utc(createTime).fromNow()}</TableCell>
+                  <TableCell monospace>{pkgLink}</TableCell>
+                  <TableCell>
+                    <QueryLink config={config} id={id} icon />
+                  </TableCell>
+                </TableRow>
               );
-            }
-
-            return (
-              <TableRow key={id} size='small'>
-                <TableCell monospace>{type}</TableCell>
-                <TableCell monospace>
-                  {appLinks || (names || []).map(name => <div key={name}>{name}</div>)}
-                </TableCell>
-                <TableCell monospace>
-                  {version}
-                </TableCell>
-                <TableCell>
-                  {displayName || service || fileName || description}
-                </TableCell>
-                <TableCell>
-                  {moment.utc(createTime).fromNow()}
-                </TableCell>
-                <TableCell monospace>
-                  {pkgLink}
-                </TableCell>
-                <TableCell>
-                  <QueryLink config={config} id={id} icon />
-                </TableCell>
-              </TableRow>
-            );
-          }
-          )}
-      </TableBody>
-      <TableFooter>
-        <TableRow>
-          <TablePagination
-            component="td"
-            rowsPerPageOptions={[5, 10, 25]}
-            count={-1}
-            rowsPerPage={rowsPerPage}
-            page={page}
-            onPageChange={handleChangePage}
-            onRowsPerPageChange={handleChangeRowsPerPage}
-            labelDisplayedRows={labelDisplayedRows}
-            nextIconButtonProps={{
-              disabled: records.length < rowsPerPage,
-            }}
-          />
-        </TableRow>
-      </TableFooter>
-    </Table>
+            })}
+          </TableBody>
+        </Table>
+      </TableContainer>
+      <TablePagination
+        component="td"
+        rowsPerPageOptions={[5, 10, 25]}
+        count={-1}
+        rowsPerPage={rowsPerPage}
+        page={page}
+        onPageChange={handleChangePage}
+        onRowsPerPageChange={handleChangeRowsPerPage}
+        labelDisplayedRows={labelDisplayedRows}
+        nextIconButtonProps={{
+          disabled: records.length < rowsPerPage,
+        }}
+      />
+    </Paper>
   );
 };
 
diff --git a/src/resolvers.js b/src/resolvers.js
index a5643d4..b14adfa 100644
--- a/src/resolvers.js
+++ b/src/resolvers.js
@@ -46,7 +46,7 @@ export const createResolvers = config => {
       wns_records: async (_, { attributes }) => {
         log('WNS records...');
 
-        const {limit, offset, ...queryAttributes } = attributes;
+        const {limit, offset, ...queryAttributes } = attributes || {};
         const data = await registry.queryRecords(queryAttributes, false, false, limit, offset);
 
         return {