How to receive data from preload.js to renderer.js

Question

I'm working on a button click that opens a dialog to get folder root. I'm currently using invoke/handle. I created a promise function to return my data but not sure how to move my data from preload.js to renderer.js

Main.js

ipcMain.handle(HANDLE_FETCH_DATA, (events) => {
    dialog.showOpenDialog(win, {
        properties: ['openDirectory']
    }).then(result => {
        if (result.canceled === true) return;
        const filePath = result.filePaths[0]
        return crawlDirectory(filePath)
    })
})

Preload.js

loadDirectory(channel) {
            return ipcRenderer.invoke(channel)
        }

Renderer.js

    async function loadDirectoryFolders() {
        // Activate ShowDialog
        const data = await app.filesApi.loadDirectory(HANDLE_FETCH_DATA)
   console.log(data)
    }

CrawlDirectory(filepath)

const crawlDirectory = (dir) => {
    return new Promise((resolve, reject) => {
        const folderName = path.basename(dir);
        //   create new model object
        const model = {
            id: short.generate(),
            name: folderName,
            children: [],
            toggled: false,
            active: false,
            loading: false,
            decorators: {},
            animations: []
        };
        //model['name'] = folderName;
        const folders = fs.readdirSync(dir).filter(file => file !== '.DS_Store'); //['Dance', 'Disco', 'Hip Hop', 'House', 'R&B', 'Reggae']
        for (let folder in folders) {
            let next = path.join(dir, folders[folder]);
            let isDirectory = fs.lstatSync(next).isDirectory();
            if (isDirectory) {
                model['children'].push(crawlDirectory(next))
            } else {
                model['children'].push({ name: path.basename(next) })
            }
        }
        resolve(model)
    })
}

I'm not totally clear on what your problem is, but you need to return the promise from `ipcMain.handle`. Right now, you're not returning anything so `ipcRenderer.invoke` is either resolving immediately with undefined or not resolving at all — pushkin, Aug 11 '21 at 14:55
so crawlDirectory(filePath) is creating a folder tree as an object. I want to return the object back to my preload and then to renderer so I can send it to my react component. — Nellz, Aug 11 '21 at 15:02
ok and it's not getting to your preload, or it's getting to preload but not to your renderer. In any case, you still need to return the promise and probably await it in your renderer `await app.filesApis.loadDirectory` — pushkin, Aug 11 '21 at 15:15
I added above the crawlDirectory(). Here I used promise and returned my data — Nellz, Aug 11 '21 at 15:25
I'm saying that you need to return the promise from within ipcMain.handle(HANDLE_FETCH_DATA — pushkin, Aug 11 '21 at 15:38
is this `return crawlDirectory(filePath)` not the proper return — Nellz, Aug 11 '21 at 15:44
no, that's returning inside of the `then` function, but the actual handler that's passed to `ipcMain.handle` isn't returning anything — pushkin, Aug 11 '21 at 16:37
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/235901/discussion-between-nellz-and-pushkin). — Nellz, Aug 11 '21 at 17:31

How to receive data from preload.js to renderer.js

0 Answers0