Best way to store user's choice/configuration

Hi @Jens Thiemann,

Great question! One suggestion would be to leverage our Web SDK’s app-level metadata. You could store something like this in the app metadata and access it each time the app loads, for instance. You can find more details on this capability here:
https://developers.miro.com/docs/board_board#setappdata

Maybe this will help!
Will

@Jens Thiemann,

Good question! The cookies are also an option to you — depending on the sensitivity of the user details, you may prefer one of these options over the other. But I do believe either could work for your use case. 😀

Hi Jens,

I’ve just worked through a little code snippet to illustrate how to do this via the setAppData method as well as the getAppData method since I think this might be a good way solution to your problem. I know this is not using cookies, but this is still straightforward enough that I think it may solve your issue.

You should be able to run this code in the editor within the SDK docs by click on the `try it` button near the code examples. Please make sure there is already a card on the board first.

// Get all items with type: 'card'
const cardData = await miro.board.get({
  type: ['card'],
});

//we are just grabbing the first card's data here
const cardWidth = cardData[0].width;
const cardHeight = cardData[0].height;

//you can set the app data as you want
await miro.board.setAppData('usersCardSize', [cardWidth, cardHeight]);

//then you can get the app data for usersCardSize which we set earlier
const usersCardSize = await miro.board.getAppData('usersCardSize');

console.log(usersCardSize)

Please let me know if this helps you with your problem.

Hi Jens.

Usage of cookies fully depends on how app is working on your side. You can try to follow these instructions: https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie.

The cookie will be set for this user, that currently is using the app and for the domain where your app is deployed.

But IMO in your case will be better to use localStorage. It also will store some data on the level of the app, not the board (again, because it is attached to the domain). If your app will store smth in the localStorage on one board, then the same data will be available on another board (but only in the same app). It should cover your case with storing of configuration. https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
 

You can do it in next way:

// For example you have some form where you are configuring smth.
// And on click on "save config" button you will execute this handler.
const onConfigurationChanged = (config) => {
    localStorage.setItem("configuration", JSON.stringify(config));
}


// Then to retrieve configuration on, for example, app init, you have to do next:
const onAppInit = () => {
    const configurationJson = localStorage.getItem("configuration");
    const configuration = JSON.parse(configurationJson || '{}'); // if configuration was not found - use empty object

    doSmthWithConfiguration(configuration)
}