Typescript Confusion

I am working on a very simple extension that collects some data off the page and stores it locally. The data is stored as an array of object. When using the storage API to retrieve the data it seems like the LSP or linter is confused. VSCode shows the type of data as a string but logging typeof in the browser it tells me its a object but I only have this issue when using the .then syntax of the promise. If I use async/await I can cast it correctly to my custom type but I'm not sure how to do this from a .then resolution.
const [records, setRecords] = useState<Record[]>([]);

useEffect(() => {
const fetchRecords = async () => {
const records = await storage.get("records") as Record[] || [];
setRecords(records);
}

fetchRecords();
}, [true])
const [records, setRecords] = useState<Record[]>([]);

useEffect(() => {
const fetchRecords = async () => {
const records = await storage.get("records") as Record[] || [];
setRecords(records);
}

fetchRecords();
}, [true])
No description
No description