Sheet not found when using API

[TiagoBlauth]

Describe the bug
I am trying to recreate a sheet by removing current sheets, adding new sheets, and populating the cells. So far so good, the sheet remove and recreate works, value set works, but when I try to set cell formats it presents the error below.

ERROR
sheet not found
at ./node_modules/@fortune-sheet/core/dist/index.esm.js (http://localhost:3000/static/js/bundle.js:73709:23)
at options.factory (http://localhost:3000/static/js/bundle.js:159957:31)
at webpack_require (http://localhost:3000/static/js/bundle.js:159380:33)
at fn (http://localhost:3000/static/js/bundle.js:159614:21)
at ./node_modules/@fortune-sheet/react/dist/index.esm.js (http://localhost:3000/static/js/bundle.js:80513:77)
at options.factory (http://localhost:3000/static/js/bundle.js:159957:31)
at webpack_require (http://localhost:3000/static/js/bundle.js:159380:33)
at fn (http://localhost:3000/static/js/bundle.js:159614:21)
at ./src/Test.tsx (http://localhost:3000/static/js/bundle.js:148:78)
at options.factory (http://localhost:3000/static/js/bundle.js:159957:31)

To Reproduce
Steps to reproduce the behavior:

Sheet reloading process, this is the failing process.

async function getAllSheets() {
    //loading the sheet from local storage
    const sampleSheet = localStorage.getItem("samplesheet")
    const convertedSheet = JSON.parse(sampleSheet)
    //Removing all sheets from the list
    for (let i = 0; i < sheetList.length; i++) {
        workbookRef.current?.deleteSheet({ 'id': sheetList[i].id })
    }
    sheetList = []
    //Sheet creation
    for (let i = 0; i < convertedSheet.length; i++) {
        await workbookRef.current?.addSheet()
        workbookRef.current?.setSheetName(convertedSheet[i].name)
        //Adding data
        for (let j = 0; j < convertedSheet[i].data.length; j++) {
            for (let k = 0; k < convertedSheet[i].data[j].length; k++) {
                if (convertedSheet[i].data[j][k] !== null) {
                    workbookRef.current?.setCellValue(j, k, convertedSheet[i].data[j][k].v);
                }
            }
        }
        //set cell format - ### it fails here ###
        cellFormat()
    }
}

Cell format function

function cellFormat() {
    //set cell format
    for (let i = 0; i < 30; i++) {
        if (workbookRef.current?.getCellValue(i, 0) !== null) {
            workbookRef.current?.setCellFormat(i, 0, 'bl', 'data');
            workbookRef.current?.setCellFormat(i, 0, 'bg', '#eeeeee');
        }
    }
    for (let j = 0; j < 30; j++) {
        if (workbookRef.current?.getCellValue(0, j) !== null) {
            workbookRef.current?.setCellFormat(0, j, 'bl', 'data');
            workbookRef.current?.setCellFormat(0, j, 'bg', '#eeeeee');
        }
    }
}

Not relevant, but it is here, the saving process for local storage

function saveAllSheets() {
    const allSheets = workbookRef.current?.getAllSheets();
    localStorage.setItem("samplesheet", JSON.stringify(allSheets))
}

The workbook itself:

      <Workbook ref={workbookRef} data={workbookData} onOp={opChange} />

The error happens when getAllSheets() process runs and cellFormat() is called. If I take cellFormat() out of getAllSheets() and use separate buttons, both works.

Expected behavior
I expect to be able to format the sheet in the same process I am creating the sheets.

Additional context
I tried to use CommonOptions to determine the sheet I am referring to, but I am probably doing it wrong. Try to find an example in the documentation or in here with no luck. It would be nice if you can provide me an example.

[kong33]

did you solve the problem? I got a similar issue.
my error message is this

Error: sheet not found
    at eval (index.esm.js:70150:23)
    at (app-pages-browser)/node_modules/@fortune-sheet/core/dist/index.esm.js (http://localhost:3000/_next/static/chunks/app/%5Blng%5D/Dashboard/page.js:455:1)
    at options.factory (webpack.js:718:31)
    at __webpack_require__ (webpack.js:39:33)
    at fn (webpack.js:373:21)
    at eval (index.esm.js:5:77)
    at (app-pages-browser)/node_modules/@fortune-sheet/react/dist/index.esm.js (http://localhost:3000/_next/static/chunks/app/%5Blng%5D/Dashboard/page.js:708:1)
    at options.factory (webpack.js:718:31)
    at __webpack_require__ (webpack.js:39:33)
    at fn (webpack.js:373:21)
    at eval (page.tsx:27:79)
    at (app-pages-browser)/src/app/[lng]/Dashboard/page.tsx (http://localhost:3000/_next/static/chunks/app/%5Blng%5D/Dashboard/page.js:1602:1)
    at options.factory (webpack.js:718:31)
    at __webpack_require__ (webpack.js:39:33)
    at Function.fn (webpack.js:373:21)

[sanchit3008]

I must have missed this issue since it's quite old, I will have a look this week

[kong33]

For my case, I solved the problem in the following way.

My development enviroment

Next.js App router 13.5.4
typescript
babel ~ 7.24.7

code explanation

1. I'm rendering WorkBook component on the 'DashboardPage', which is a client component.

 <div css={workBook}>
    <Workbook data={ref.current?.getSheet() ? [ref.current.getSheet()] : [{ name: "Sheet1" }]} ref={ref}/>
 </div>

2. when I click a Button on the page, the following event handler is triggered.

import { useRouter } from "next/navigation";
const router = useRouter();
...
 <FileButton text="수정하기" onClick={() => router.push("/Dashboard/edit")} />
...

3. On the '/Dashboard/edit' page, there is a save button width a handler that looks like this

  const handleSave = () => {
    if (ref.current) {
      const celldataArray = ref.current.getSheet() as any;
      postSchedule(
        { constrId, formData: celldataArray },
        {
          onSuccess: () => router.push("/Dashboard"),
        },
      );
    }
  };

The error occur when I click the save button and router.push("/Dashboard") is called.

how I fixed it

I changed "router.push" to window.location.href.

  <FileButton text="수정하기" onClick={() => (window.location.href = "/Dashboard/edit")} />
...
 onSuccess: () => (window.location.href = "/Dashboard"),

I don't know why this works. If someone knows the reason, please comment.

[sanchit3008]

I think the hard reload is getting rid of any indeterminate states which might be causing this issue. Need to have a deeper look.