Issue getting data into the Motif data visualization tool

Question

I pulled downed the entire motif data visualization project from here https://github.com/cylynx/motif.gl. I installed neo4j desktop and I'm using the default movie database project. The db is running and I can see the data in neo4j browser via bolt localhost. By navigating to /motif.gl/packages, I ran these scripts to start motif: npm run build then followed by npm run serve (those scripts can be find in the package.json file under /motif.gl/packages/motif-demo/package.json. When I navigate to localhost:3000 I can see the motif page where it asks me to import data. I want to import data from the neo4j tab where I provide the host, port, username, and password. After doing so it says Connect, and after doing so I hit continue and then I get a blank page with this error in the web console:

"Uncaught Neo4jError: This record has no field with key 'error', available key are: [name,type,aliases,access,address,role,writer,requestedStatus,currentStatus,statusMessage,default,home,constituents].

As anyone ever used the motif library before and/or is familiar enough with neo4j to help me resolve the Uncaught Neo4jError error I'm getting in my webconsole?

I tried changing the ExecuteQuery.tsc file under motif-demo/motif.gl/packages/motif-demo/src/containers/Neo4J/sections/ExecuteQuery/ExecuteQuery.tsx to try to address the issue like this:

const onQueryData = (e: React.FormEvent) => {
  e.preventDefault();

  if (db.length === 0) {
    return;
  }

  setIsLoading(true);

  (driver as Driver)
    .session({ database: db[0].id as string })
    .run(query)
    .then(async (res: QueryResult) => {
      const records = res.records;
      const hasError = records.some(record => 'error' in record);
      if (hasError) {
        // Handle errors if necessary
        throw new Error('Neo4jError: Query execution returned an error.');
      }

      const { nodes, edges } = await toMotifFormat(records as Record[]);
      return { nodes, edges };
    })
    .then((data: GraphData) => {
      const { nodes, edges } = data;
      onStateChange('graphData', data);

      const nodeLength = nodes.length;
      const edgesLength = edges.length;

      setNotification({
        kind: 'positive',
        children: (
          <Block as='span'>
            Imported <b>{nodeLength} Node(s)</b> and{' '}
            <b>{edgesLength} Edge(s)</b>.
          </Block>
        ),
      });
    })
    .catch((error) => {
      onStateChange('graphData', {
        nodes: [],
        edges: [],
      });
      setNotification({
        kind: 'negative',
        children: error.message,
      });
    })
    .finally(() => {
      setIsLoading(false);
    });
};

but even after rebuilding my vite bundler I'm still getting the same error. I am expecting the page to display something like this:expected result