feat(App): enable AI code assistant by default with no accounts or br…

…owser extensions
live-codes · Feb 7, 2024 · 39916cf · 39916cf
1 parent 9dbf40e
commit 39916cf
Show file tree

Hide file tree

Showing 8 changed files with 27 additions and 10 deletions.
diff --git a/src/livecodes/config/config.ts b/src/livecodes/config/config.ts
@@ -75,6 +75,7 @@ export const getEditorConfig = (config: Config | UserConfig): EditorConfig => ({
   wordWrap: config.wordWrap,
   closeBrackets: config.closeBrackets,
   emmet: config.emmet,
+  disableAI: config.disableAI,
   editorMode: config.editorMode,
 });
 

diff --git a/src/livecodes/config/default-config.ts b/src/livecodes/config/default-config.ts
@@ -62,6 +62,7 @@ export const defaultConfig: Config = {
   singleQuote: false,
   trailingComma: true,
   emmet: true,
+  disableAI: false,
   editorMode: undefined,
   version: process.env.VERSION as string,
 };
diff --git a/src/livecodes/config/validate-config.ts b/src/livecodes/config/validate-config.ts
@@ -152,6 +152,7 @@ export const validateConfig = (config: Partial<Config>): Partial<Config> => {
     ...(is(config.singleQuote, 'boolean') ? { singleQuote: config.singleQuote } : {}),
     ...(is(config.trailingComma, 'boolean') ? { trailingComma: config.trailingComma } : {}),
     ...(is(config.emmet, 'boolean') ? { emmet: config.emmet } : {}),
+    ...(is(config.disableAI, 'boolean') ? { disableAI: config.disableAI } : {}),
     ...(includes(editorModes, config.editorMode) ? { editorMode: config.editorMode } : {}),
     ...(is(config.imports, 'object') ? { imports: config.imports } : {}),
     ...(is(config.types, 'object') ? { types: config.types } : {}),

diff --git a/src/livecodes/editor/monaco/monaco.ts b/src/livecodes/editor/monaco/monaco.ts
@@ -17,7 +17,7 @@ import type {
   Config,
 } from '../../models';
 import { cloneObject, getRandomString, loadScript } from '../../utils/utils';
-import { emmetMonacoUrl, monacoEmacsUrl, monacoVimUrl } from '../../vendors';
+import { codeiumProviderUrl, emmetMonacoUrl, monacoEmacsUrl, monacoVimUrl } from '../../vendors';
 import { getImports } from '../../compiler/import-map';
 import { getEditorModeNode } from '../../UI/selectors';
 import { pkgInfoService } from '../../services/pkgInfo';
@@ -30,6 +30,7 @@ let monacoGloballyLoaded = false;
 const disposeEmmet: { html?: any; css?: any; jsx?: any; disabled?: boolean } = {};
 let monaco: typeof Monaco;
 const loadedThemes = new Set<string>();
+let codeiumProvider: { dispose: () => void } | undefined;
 
 export const createEditor = async (options: EditorOptions): Promise<CodeEditor> => {
   const {
@@ -531,6 +532,7 @@ export const createEditor = async (options: EditorOptions): Promise<CodeEditor>
     configureEmmet(settings.emmet);
     configureEditorMode(settings.editorMode);
     editor.updateOptions(editorOptions);
+    configureCodeium(!settings.disableAI);
   };
 
   const undo = () => {
@@ -558,8 +560,22 @@ export const createEditor = async (options: EditorOptions): Promise<CodeEditor>
     setTimeout(() => editor.revealPositionInCenter(newPosition, 0), 50);
   };
 
+  const configureCodeium = async (enabled: boolean) => {
+    if (!enabled) {
+      codeiumProvider?.dispose();
+      codeiumProvider = undefined;
+      return;
+    }
+    // already enabled
+    if (codeiumProvider) return;
+
+    const codeiumModule = await import(codeiumProviderUrl);
+    codeiumProvider = codeiumModule.registerCodeiumProvider(monaco);
+  };
+
   const destroy = () => {
     configureEmmet(false);
+    configureCodeium(false);
     editorMode?.dispose();
     listeners.length = 0;
     clearTypes(true);

diff --git a/src/livecodes/html/app.html b/src/livecodes/html/app.html
@@ -3,7 +3,6 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    {{codeiumMeta}}
     <title>LiveCodes</title>
     <style>
       body {

diff --git a/src/livecodes/main.ts b/src/livecodes/main.ts
@@ -25,7 +25,6 @@ export const loading: EmbedOptions['loading'] = !isEmbed
   : loadingParam === 'lazy' || loadingParam === 'click' || loadingParam === 'eager'
   ? loadingParam
   : 'lazy';
-export const disableAI = params.get('disableAI') != null && params.get('disableAI') !== 'false';
 
 export const livecodes = (container: string, config: Partial<Config> = {}): Promise<API> =>
   new Promise(async (resolve) => {
@@ -76,8 +75,7 @@ export const livecodes = (container: string, config: Partial<Config> = {}): Prom
       const iframe = document.createElement('iframe');
       iframe.name = 'app';
       iframe.style.display = 'none';
-      const disableAIQuery = disableAI ? `?disableAI` : '';
-      iframe.src = './app.html' + disableAIQuery;
+      iframe.src = './app.html';
       let contentLoaded = false;
       iframe.onload = () => {
         if (contentLoaded) return;
@@ -101,11 +99,7 @@ export const livecodes = (container: string, config: Partial<Config> = {}): Prom
             /{{codemirrorCoreUrl}}/g,
             `${baseUrl}vendor/codemirror/${process.env.codemirrorVersion}/codemirror-core.js`,
           )
-          .replace(/src="[^"]*?\.svg"/g, (str: string) => (isHeadless ? 'src=""' : str))
-          .replace(
-            /{{codeiumMeta}}/g,
-            `<meta name="codeium:type" content="${disableAI ? 'none' : 'monaco'}" />`,
-          );
+          .replace(/src="[^"]*?\.svg"/g, (str: string) => (isHeadless ? 'src=""' : str));
 
         iframe.contentWindow?.postMessage({ content: appContent }, location.origin);
         contentLoaded = true;

diff --git a/src/livecodes/vendors.ts b/src/livecodes/vendors.ts
@@ -80,6 +80,10 @@ export const cm6ThemeSolarizedDarkUrl = /* @__PURE__ */ getUrl(
   'cm6-theme-solarized-dark@0.2.0/dist/index.js',
 );
 
+export const codeiumProviderUrl = /* @__PURE__ */ getUrl(
+  '@live-codes/monaco-codeium-provider@0.1.0/dist/index.js',
+);
+
 export const coffeeScriptUrl = /* @__PURE__ */ getUrl(
   'coffeescript@2.7.0/lib/coffeescript-browser-compiler-legacy/coffeescript.js',
 );

diff --git a/src/sdk/models.ts b/src/sdk/models.ts
@@ -126,6 +126,7 @@ export interface EditorConfig {
   closeBrackets: boolean;
   emmet: boolean;
   editorMode: 'vim' | 'emacs' | undefined;
+  disableAI: boolean;
 }
 
 export interface FormatterConfig {