1import { writable, get } from 'svelte/store';
2import { Base64 } from 'js-base64';
3import { replace, location } from 'svelte-spa-router';
4
5const isDarkMode =
6  window.matchMedia('(prefers-color-scheme: dark)').matches && false;
7const defaultState = {
8  code: `graph TD
9A[Christmas] -->|Get money| B(Go shopping)
10B --> C{Let me think}
11C -->|One| D[Laptop]
12C -->|Two| E[iPhone]
13C -->|Three| F[fa:fa-car Car]
14  `,
15  mermaid: { theme: isDarkMode ? 'dark' : 'default' },
16};
17export const codeStore = writable(defaultState);
18export const fromUrl = (data) => {
19  let state;
20  try {
21    const stateStr = Base64.decode(data);
22    console.log('state from url', stateStr);
23    state = JSON.parse(stateStr);
24  } catch (e) {
25    console.error('Init error', e);
26    state = defaultState;
27  }
28  codeStore.set({ ...state, updateEditor: true });
29};
30export const updateCodeStore = (newState) => {
31  codeStore.set(newState);
32};
33export const updateCode = (code, updateEditor) => {
34  const state = get(codeStore);
35  codeStore.set({ ...state, code, updateEditor });
36};
37export const updateConfig = (config, updateEditor) => {
38  const state = get(codeStore);
39  codeStore.set({ ...state, mermaid: config, updateEditor });
40};
41
42const unsubscribe = codeStore.subscribe((state) => {
43  const currentLocation = get(location).split('/')[1];
44  replace(
45    `/${currentLocation || 'edit'}/` + Base64.encodeURI(JSON.stringify(state))
46  );
47});
48