Get the current Designer mode

1
webflow.getCurrentMode(): Promise<AppModeName | null>

1
const mode = await webflow.getCurrentMode();
2
3
if (mode === "design") {
4
  console.log("The user is in Design mode.");
5
} else if (mode === null) {
6
  console.log("The Designer is not in a public mode.");
7
} else {
8
  console.log(`The user is in ${mode} mode.`);
9
}

1
async function renderForCurrentMode() {
2
  const mode = await webflow.getCurrentMode();
3
4
  switch (mode) {
5
    case "design":
6
      await renderDesignTools();
7
      break;
8
    case "build":
9
      await renderContentEditingTools();
10
      break;
11
    case "preview":
12
    case "edit":
13
    case "comment":
14
      await renderReadOnlyState();
15
      break;
16
    default:
17
      await webflow.notify({
18
        type: "Info",
19
        message: "The Designer is not in a public mode.",
20
      });
21
  }
22
}
23
24
await renderForCurrentMode();