The code below queries a record from an Atlassian Storage API.

with `console.log(data)` displays the records as objects objects.

with `console.log(data.first_name) and console.log(data.last_name)`, I can successfully see the name **Lucy** and **Carrots** in the console.

**Here is my Issue:**

When I try to loop through the objects in other to display the records as per code below. it displays Error

**TypeError: Cannot read property 'length' of undefined
at Object.App**

If I remove the **projects.length** and try to display records, it will show error

**TypeError: Cannot read property 'map' of undefined**

Below is my effort so far

```
import api, { route } from "@forge/api";
import ForgeUI, { render, Fragment, Text, IssuePanel, useProductContext, useState, Component, useEffect} from "@forge/ui";

import { storage} from '@forge/api';

 const fetchData = async () => {

//const data = {first_name: 'Lucy', last_name: 'Carrots' };

const data = await storage.get('key1');
console.log(data);
console.log(data.first_name);
console.log(data.last_name);

 };

const App = () => {
 const [ projects ] = useState(fetchData);
fetchData();

  return (
    <Fragment>
     <Text> Display Objects Records</Text>

         {projects.length ? projects.map((i, v) => (
          <Text key={v}>
            <Text>

<Text>First Name:  {v.first_name}</Text>
<Text>Last Name:  {v.last_name}</Text>
</Text></Text>

        )): <Text>No data stored yet...</Text>}

  </Fragment>
  );
};

export const run = render(
  <IssuePanel>
    <App />
  </IssuePanel>
);

```