Am trying to store and retrieve stored data via Forge storage API but it throws error below
https://developer.atlassian.com/platform/forge/runtime-reference/storage-api/
There was an error invoking the function - Cannot read property 'get' of undefined
TypeError: Cannot read property 'get' of undefined
at fetchStoredData (index.js:12821:95)
at index.js:12828:95
at processInitialValueAndThrow (index.js:12340:54)
at Object.exports.useAction (index.js:12355:9)
at exports.useState (index.js:29490:24)
at Object.App [as type] (index.js:12828:76)
at index.js:29288:36
at asyncMap (index.js:29223:30)
at index.js:29244:35
at asyncMap (index.js:29223:30)
Below is the code:
import api, { route} from "@forge/api";
import { storage } from '@forge/api';
import ForgeUI, { render, Fragment, Macro, Text,useProductContext, useState } from "@forge/ui";
//import { storage } from '@forge/api';
const fetchStoredData = async (contentId) => {
// store data here
storage.set('myfirst_key', {first_name: 'Ann', last_name: 'Rachael', age: '21' });
storage.set('myfirst_key', {first_name: 'Frank', last_name: 'James', age: '19' });
//await storage.get('myfirst_key');
// query stored data
const data = await (
await api.asUser().storage.get('myfirst_key')
).json();
return data.results;
console.log(data);
};
const App = () => {
const context = useProductContext();
const [reco] = useState(async () => await fetchStoredData(context.contentId));
console.log(`Number of Records: ${reco.length}`);
return (
<Fragment>
<Text>Display Stored Data Here</Text>
{reco.length ? reco.map((v, i) => (
<div key={i}>
<div >
<b>First Name:</b> {v.first_name}<br />
<b>Last Name:</b> {v.last_name}<br />
</div><br />
</div>
)) : <div >Organisation Data has not been Added by Admin Yet...</div>}
</Fragment>
);
};
export const run = render(
<Macro
app={<App />}
/>
);