Value retrieval failed after disconnecting the Entity

[kausik10]

Hi, I have a Carousel (embla carousel) that shows lists the file.

const beforePersist = () => {
            // DISCONNECT OTHER FILES
            if (from === "detail" && isAdmin) {
                const activeId = activeAccessor!
                    .getField("id")
                    .value!.toString();

                Object.keys(allAccessors.current).forEach((id) => {
                    if (activeId !== id && !filesDone.current.includes(id)) {
                        const accessor = allAccessors.current[id];
                        accessor.disconnectEntityAtField("year");
                        accessor.disconnectEntityAtField("month");
                        accessor.disconnectEntityAtField("folder");
                    }
                });

                filesDone.current.push(activeId);
            }
            setSelectedIndex(-1); // needed for removing the file
        };

        const afterPersist = () => {
            if (from === "detail" && isAdmin) {
                const activeId = activeAccessor!
                    .getField("id")
                    .value!.toString();
                filesDone.current = filesDone.current.filter(
                    (id) => id !== activeId
                );
                // reconnect the values...
                const accessor = allAccessors.current[activeId];
                accessor.connectEntityAtField(
                    "year",
                    activeAccessor.getEntity("year")
                );
                accessor.connectEntityAtField(
                    "month",
                    activeAccessor.getEntity("month")
                );
                accessor.connectEntityAtField(
                    "folder",
                    activeAccessor.getEntity("folder")
                );
            }
        };
        return (
            <Entity accessor={activeAccessor}>
                {type === "files" && <FileEditForm />}
                {(type === "documents" || type === "payroll") && (
                    <InputField
                        field="meta.fileName"
                        label="Název souboru"
                        required
                    />
                )}
                {employeeId && (
                    <SelectField field="year" label="Rok" required>
                        <Field field="name" />
                    </SelectField>
                )}

                <EntityBeforePersist listener={beforePersist} />

                {from === "detail" && isAdmin ? (
                    <SaveButton
                        onPersist={afterPersist}
                        label={selectedFile ? "Uložit" : "Zatřídit"}
                    />
                ) : (
                    <PersistButton
                        label={selectedFile ? "Uložit" : "Zatřídit"}
                    />
                )}
            </Entity>
        );

While I move from one file to next, I need to reset the values of the file being displayed, that's why I have disconnected the entities here. The issue lies when saving a file..
I have separated this much logic for each displaying fields for each file to a New_Component and have used in my parent component as

          {activeAccessor && (
                                <>
                                    <SavingFiles
                                        isAdmin={isAdmin}
                                        selectedFile={selectedFile}
                                        filesDone={filesDone}
                                        allAccessors={allAccessors}
                                        activeAccessor={activeAccessor}
                                    />
                                </>
                            )}

This way I am able to save the current selected file. However, when saving the current selected file, the year month and folder of previous files loaded in carousel is disconnected and when I traverse back, all the changes are lost
If I reload the page, the disconnected files are reconnected again..

Is there a way to reconnect fields without the need for page reload? Thank you!

This is my onSelect for the reference

     const onSelect = (
            index: number | SyntheticEvent<HTMLDivElement | Event>
        ) => {
            if (typeof index === "number") {
                // setSelectedIndex(index);

                if (from === "detail" && isAdmin) {
                    const nextAccessor = files?.[index] as EntityAccessor;
                    allAccessors.current[
                        nextAccessor.getField("id")!.valueOnServer!.toString()
                    ] = nextAccessor;

                    if (lastSelectedIndex.current != index) {
                        activeAccessor?.disconnectEntityAtField("year");
                        activeAccessor?.disconnectEntityAtField("month");
                        activeAccessor?.disconnectEntityAtField("folder");
                    }
                }
                lastSelectedIndex.current = index;
                setSelectedIndex(index);
            }
        };

[jonasnobile]

Hi, thanks for sharing the details! I'm having a bit of trouble pinpointing exactly what's causing this behavior based on the provided snippet.

To help me identify and fix the issue quickly, could you please:

• Create a small, standalone repository demonstrating a Minimal Reproducible Example (MRE)? Ideally, this repo would contain just enough code to show the problem clearly.
• Also, could you confirm if the carousel is essential here? Often, reloading or explicitly fetching fresh data when switching between entities provides clearer and more predictable results.

Thanks again—looking forward to your example, and I'm happy to help further once that's ready!