@difizen/libro-sql-cell 0.2.39 → 0.2.40-next.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@difizen/libro-sql-cell",
-  "version": "0.2.39",
+  "version": "0.2.40-next.1",
   "description": "",
   "keywords": [
     "libro",
@@ -32,10 +32,10 @@
     "src"
   ],
   "dependencies": {
-    "@difizen/libro-code-editor": "^0.2.39",
-    "@difizen/libro-jupyter": "^0.2.39",
-    "@difizen/libro-rendermime": "^0.2.39",
-    "@difizen/libro-common": "^0.2.39",
+    "@difizen/libro-code-editor": "0.2.40-next.1",
+    "@difizen/libro-jupyter": "0.2.40-next.1",
+    "@difizen/libro-rendermime": "0.2.40-next.1",
+    "@difizen/libro-common": "0.2.40-next.1",
     "@ant-design/icons": "^5.1.0",
     "@difizen/mana-app": "latest",
     "@difizen/mana-l10n": "latest"

package/src/libro-formatter-sql-magic-contribution.ts

@@ -1,4 +1,5 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
+/** @format */
+
 import { concatMultilineString } from '@difizen/libro-common';
 import { FormatterContribution } from '@difizen/libro-jupyter';
 import type {
@@ -9,6 +10,7 @@ import { singleton } from '@difizen/mana-app';
 
 export interface SqlDecodedFormatter extends DefaultDecodedFormatter {
   result_variable?: string;
+  db_id?: string;
 }
 
 @singleton({ contrib: FormatterContribution })
@@ -22,7 +24,12 @@ export class FormatterSqlMagicContribution
     return libroFormatter === this.formatter ? 100 : 1;
   };
   encode = (source: SqlDecodedFormatter) => {
-    const sqlEncodedValue = `%%sql \n{"result_variable":"${source.result_variable}", "sql_script":"${source.value}"}`;
+    const sqlJson = {
+      result_variable: source.result_variable,
+      db_id: source.db_id,
+      sql_script: source.value,
+    };
+    const sqlEncodedValue = `%%sql \n${JSON.stringify(sqlJson)}`;
     return {
       source: sqlEncodedValue,
       metadata: {
@@ -34,13 +41,19 @@ export class FormatterSqlMagicContribution
     const value = concatMultilineString(formatterValue.source);
     if (value.startsWith('%%sql \n')) {
       const run = value.split('%%sql \n')[1];
-      const runValue = JSON.parse(run);
-      const result_variable: string = runValue.result_variable;
-      const codeValue: string = runValue.sql_script;
-      return {
-        result_variable,
-        value: codeValue,
-      };
+      try {
+        const runValue = JSON.parse(run);
+        const result_variable: string = runValue.result_variable;
+        const db_id: string = runValue.db_id;
+        const codeValue: string = runValue.sql_script;
+        return {
+          result_variable,
+          value: codeValue,
+          db_id,
+        };
+      } catch (e) {
+        console.warn('🚀 ~ e:', e);
+      }
     }
     return {
       value: '',
@@ -48,6 +61,6 @@ export class FormatterSqlMagicContribution
   };
 
   validate = (source: SqlDecodedFormatter): source is SqlDecodedFormatter => {
-    return 'result_variable' in source && 'sql_script' in source;
+    return 'result_variable' in source && 'sql_script' in source && 'db_id' in source;
   };
 }

package/src/libro-sql-cell-model.ts

@@ -19,6 +19,8 @@ export class LibroSqlCellModel extends LibroCellModel implements ExecutableCellM
   @prop()
   resultVariable: string | undefined;
   @prop()
+  dbId: string | undefined;
+  @prop()
   executeCount: ExecutionCount;
   @prop()
   executing: boolean;
@@ -82,6 +84,7 @@ export class LibroSqlCellModel extends LibroCellModel implements ExecutableCellM
   override set decodeObject(data: SqlDecodedFormatter) {
     this.value = data.value;
     this.resultVariable = data.result_variable;
+    this.dbId = data.db_id;
     this._decodeObject = data;
   }
 
@@ -90,6 +93,7 @@ export class LibroSqlCellModel extends LibroCellModel implements ExecutableCellM
       ...this._decodeObject,
       value: this.value,
       result_variable: this.resultVariable || this._decodeObject.result_variable,
+      db_id: this.dbId || this._decodeObject.db_id,
     };
   }
 

package/src/libro-sql-cell-protocol.ts

@@ -11,6 +11,7 @@ export interface VisAnalysis {
 
 export interface DatabaseConfig {
   db_type: string;
+  id: string;
   username: string;
   password: string;
   host: string;

package/src/libro-sql-cell-script.ts

@@ -2,6 +2,5 @@ import { singleton } from '@difizen/mana-app';
 
 @singleton()
 export class SqlScript {
-  public readonly getDbConfig: string = `from libro_sql.database import db
-db.get_db_config().json()`;
+  public readonly getDbConfig: string = `from libro_sql.database import db\nimport json\njson.dumps(db.to_dbs_array())`;
 }

package/src/libro-sql-cell-view.tsx

@@ -36,6 +36,7 @@ import {
 } from '@difizen/mana-app';
 import { l10n } from '@difizen/mana-l10n';
 import type { InputRef } from 'antd';
+import { Select } from 'antd';
 import { Input } from 'antd';
 import React from 'react';
 import { useCallback, useEffect, useRef, useState } from 'react';
@@ -166,12 +167,27 @@ export const LibroSqlCell = React.forwardRef<HTMLDivElement>(
     const instance = useInject<LibroSqlCellView>(ViewInstance);
     const contextKey = useInject(LibroContextKey);
     const [edit, setEdit] = useState(false);
+    const [selectedDb, setSelectedDb] = useState<string>(
+      instance.model.dbId || l10n.t('暂无内置数据库'),
+    );
 
     const handCancelEdit = () => {
       contextKey.enableCommandMode();
       setEdit(false);
     };
 
+    useEffect(() => {
+      instance.getDatabaseConfig();
+    }, [instance]);
+
+    const handleChange = (value: string) => {
+      instance.handleDbChange(value);
+      if (instance.parent.model.onChange) {
+        instance.parent.model.onChange();
+      }
+      setSelectedDb(value);
+    };
+
     return (
       <div tabIndex={10} ref={ref} className={instance.className}>
         <div className="libro-sql-cell-header">
@@ -179,13 +195,21 @@ export const LibroSqlCell = React.forwardRef<HTMLDivElement>(
             <span className="libro-sql-source-title">
               <DatabaseOutlined />
             </span>
-            <span className="libro-sql-source-content">
-              {instance.databaseConfig
-                ? instance.databaseConfig.db_type +
-                  ': ' +
-                  instance.databaseConfig.database
-                : l10n.t('暂未配置数据库')}
-            </span>
+            <Select
+              value={selectedDb}
+              style={{ minWidth: 160 }}
+              onChange={handleChange}
+              options={instance.databases.map((db) => {
+                return {
+                  value: db.id,
+                  label: db.db_type + ': ' + db.database,
+                };
+              })}
+              bordered={false}
+              onFocus={async () => {
+                await instance.getDatabaseConfig();
+              }}
+            />
           </div>
           <div className="libro-sql-variable-name">
             <span className="libro-sql-variable-name-title">Name: </span>
@@ -227,7 +251,7 @@ export class LibroSqlCellView extends LibroEditableExecutableCellView {
   outputs: IOutput[];
 
   @prop()
-  databaseConfig?: DatabaseConfig;
+  databases: DatabaseConfig[] = [];
 
   @prop()
   override editorStatus: EditorStatus = EditorStatus.NOTLOADED;
@@ -346,6 +370,10 @@ export class LibroSqlCellView extends LibroEditableExecutableCellView {
     }
   };
 
+  handleDbChange(value: string) {
+    this.model.dbId = value;
+  }
+
   override toJSON(): LibroCell {
     const meta = super.toJSON();
     return {
@@ -497,9 +525,9 @@ export class LibroSqlCellView extends LibroEditableExecutableCellView {
       (msg) =>
         this.handleQueryResponse(msg, (result) => {
           try {
-            this.databaseConfig = JSON.parse(result);
-          } catch (e) {
-            this.databaseConfig = undefined;
+            this.databases = JSON.parse(result);
+          } catch {
+            //
           }
         }),
     );