summaryrefslogtreecommitdiff
path: root/frontend/src/plugin-loader.ts
blob: 9a72ea8426189557bc31ca277fa951d7e645a7c3 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
import Logger from './logger';
import TabsHook from './tabs-hook';

interface Plugin {
  title: any;
  content: any;
  icon: any;
  onDismount?(): void;
}

class PluginLoader extends Logger {
  private pluginInstances: Record<string, Plugin> = {};
  private tabsHook: TabsHook;
  private lock = 0;

  constructor() {
    super(PluginLoader.name);

    this.log('Initialized');
    this.tabsHook = new TabsHook();
  }

  dismountPlugin(name: string) {
    this.log(`Dismounting ${name}`);
    this.pluginInstances[name]?.onDismount?.();
    delete this.pluginInstances[name];
    this.tabsHook.removeById(name);
  }

  async loadAllPlugins() {
    this.log('Loading all plugins');
    const plugins = await (await fetch(`http://127.0.0.1:1337/plugins`)).json();
    this.log('Received:', plugins);

    return Promise.all(plugins.map((plugin) => this.loadPlugin(plugin.name)));
  }

  async loadPlugin(name) {
    this.log('Loading Plugin:', name);

    try {
      while (this.lock === 1) {
        await new Promise((resolve) => setTimeout(resolve, 1000));
      }
      this.lock = 1;

      if (this.pluginInstances[name]) {
        this.dismountPlugin(name);
      }

      const response = await fetch(`http://127.0.0.1:1337/plugins/${name}/frontend_bundle`);
      const code = await response.text();

      const pluginAPI = PluginLoader.createPluginAPI(name);
      this.pluginInstances[name] = await eval(code)(pluginAPI);

      const { title, icon, content } = this.pluginInstances[name];
      this.tabsHook.add({
        id: name,
        title,
        icon,
        content,
      });
    } catch (e) {
      console.error(e);
    } finally {
      this.lock = 0;
    }
  }

  dismountAll() {
    for (const name of Object.keys(this.pluginInstances)) {
      this.dismountPlugin(name);
    }
  }

  static createPluginAPI(pluginName) {
    return {
      async callServerMethod(methodName, args = {}) {
        const response = await fetch(`http://127.0.0.1:1337/methods/${methodName}`, {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify(args),
        });

        return response.json();
      },
      async callPluginMethod(methodName, args = {}) {
        const response = await fetch(`http://127.0.0.1:1337/plugins/${pluginName}/methods/${methodName}`, {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify({
            args,
          }),
        });

        return response.json();
      },
      fetchNoCors(url, request: any = {}) {
        let args = { method: 'POST', headers: {}, body: '' };
        const req = { ...args, ...request, url, data: request.body };
        return this.callServerMethod('http_request', req);
      },
      executeInTab(tab, runAsync, code) {
        return this.callServerMethod('execute_in_tab', {
          tab,
          run_async: runAsync,
          code,
        });
      },
      injectCssIntoTab(tab, style) {
        return this.callServerMethod('inject_css_into_tab', {
          tab,
          style,
        });
      },
      removeCssFromTab(tab, cssId) {
        return this.callServerMethod('remove_css_from_tab', {
          tab,
          css_id: cssId,
        });
      },
    };
  }
}

export default PluginLoader;