Merge branch 'master' into develop

packages/tools/src/index.ts

@@ -14,3 +14,4 @@ export * from './filterName';
 export * from './diffTools';
 export * from './schemaEditorTools';
 export * from './yamlModelConv';
+export * from './stringTools';

packages/tools/src/stringTools.ts

@@ -0,0 +1,12 @@
+export function arrayToHexString(byteArray) {
+  return byteArray.reduce((output, elem) => output + ('0' + elem.toString(16)).slice(-2), '');
+}
+
+export function hexStringToArray(inputString) {
+  var hex = inputString.toString();
+  var res = [];
+  for (var n = 0; n < hex.length; n += 2) {
+    res.push(parseInt(hex.substr(n, 2), 16));
+  }
+  return res;
+}

packages/web/src/datagrid/DataGridCell.svelte

@@ -37,6 +37,7 @@
   import _ from 'lodash';
   import ShowFormButton from '../formview/ShowFormButton.svelte';
   import { getBoolSettingsValue } from '../settings/settingsTools';
+  import { arrayToHexString } from 'dbgate-tools';
 
   export let rowIndex;
   export let col;
@@ -99,7 +100,11 @@
         {highlightSpecialCharacters(value)}
       {/if}
     {:else if value.type == 'Buffer' && _.isArray(value.data)}
-      <span class="null">({value.data.length} bytes)</span>
+      {#if value.data.length <= 16}
+        <span class="value">{arrayToHexString(value.data)}</span>
+      {:else}
+        <span class="null">({value.data.length} bytes)</span>
+      {/if}
     {:else if _.isPlainObject(value)}
       <span class="null" title={JSON.stringify(value, undefined, 2)}>(JSON)</span>
     {:else if _.isArray(value)}

packages/web/src/datagrid/DataGridCore.svelte

@@ -192,14 +192,6 @@
     return `Rows: ${allRowCount.toLocaleString()}`;
   }
 
-  function extractCopiedValue(row, col) {
-    let value = row[col];
-    if (value === undefined) value = _.get(row, col);
-    if (value === null) return '(NULL)';
-    if (value === undefined) return '(NoField)';
-    if (_.isPlainObject(value) || _.isArray(value)) return JSON.stringify(value);
-    return value;
-  }
 </script>
 
 <script lang="ts">
@@ -231,7 +223,7 @@
   import keycodes from '../utility/keycodes';
   import { selectedCellsCallback } from '../stores';
   import axiosInstance from '../utility/axiosInstance';
-  import { copyTextToClipboard } from '../utility/clipboard';
+  import { copyTextToClipboard ,extractRowCopiedValue} from '../utility/clipboard';
   import invalidateCommands from '../commands/invalidateCommands';
   import createRef from '../utility/createRef';
   import openReferenceForm, { openPrimaryKeyForm } from '../formview/openReferenceForm';
@@ -370,7 +362,7 @@
       if (!rowData) return '';
       const line = colIndexes
         .map(col => realColumnUniqueNames[col])
-        .map(col => extractCopiedValue(rowData, col))
+        .map(col => extractRowCopiedValue(rowData, col))
         .join('\t');
       return line;
     });

packages/web/src/datagrid/InplaceEditor.svelte

@@ -1,8 +1,19 @@
 <script lang="ts" context="module">
   function getEditedValue(value) {
+    if (value?.type == 'Buffer' && _.isArray(value.data)) return arrayToHexString(value.data);
     if (_.isPlainObject(value) || _.isArray(value)) return JSON.stringify(value);
     return value;
   }
+
+  function getStoredValue(originalValue, newString) {
+    if (originalValue?.type == 'Buffer' && _.isArray(originalValue?.data)) {
+      return {
+        type: 'Buffer',
+        data: hexStringToArray(newString),
+      };
+    }
+    return newString;
+  }
 </script>
 
 <script lang="ts">
@@ -10,6 +21,7 @@
   import { onMount } from 'svelte';
   import createRef from '../utility/createRef';
   import _ from 'lodash';
+  import { arrayToHexString, hexStringToArray } from 'dbgate-tools';
 
   export let inplaceEditorState;
   export let dispatchInsplaceEditor;
@@ -32,7 +44,7 @@
       case keycodes.enter:
         if (isChangedRef.get()) {
           // grider.setCellValue(rowIndex, uniqueName, editor.value);
-          onSetValue(domEditor.value);
+          onSetValue(getStoredValue(cellValue, domEditor.value));
           isChangedRef.set(false);
         }
         domEditor.blur();
@@ -41,7 +53,7 @@
       case keycodes.s:
         if (event.ctrlKey) {
           if (isChangedRef.get()) {
-            onSetValue(domEditor.value);
+            onSetValue(getStoredValue(cellValue, domEditor.value));
             // grider.setCellValue(rowIndex, uniqueName, editor.value);
             isChangedRef.set(false);
           }
@@ -54,7 +66,7 @@
 
   function handleBlur() {
     if (isChangedRef.get()) {
-      onSetValue(domEditor.value);
+      onSetValue(getStoredValue(cellValue, domEditor.value));
       // grider.setCellValue(rowIndex, uniqueName, editor.value);
       isChangedRef.set(false);
     }

packages/web/src/formview/FormView.svelte

@@ -152,7 +152,6 @@
   function isDataCell(cell) {
     return cell[1] % 2 == 1;
   }
-
 </script>
 
 <script lang="ts">
@@ -175,7 +174,7 @@
   import FontIcon from '../icons/FontIcon.svelte';
 
   import axiosInstance from '../utility/axiosInstance';
-  import { copyTextToClipboard } from '../utility/clipboard';
+  import { copyTextToClipboard, extractRowCopiedValue } from '../utility/clipboard';
   import contextMenu, { getContextMenu, registerMenu } from '../utility/contextMenu';
   import createActivator, { getActiveComponent } from '../utility/createActivator';
   import createReducer from '../utility/createReducer';
@@ -256,7 +255,7 @@
   export function copyToClipboard() {
     const column = getCellColumn(currentCell);
     if (!column) return;
-    const text = currentCell[1] % 2 == 1 ? rowData[column.uniqueName] : column.columnName;
+    const text = currentCell[1] % 2 == 1 ? extractRowCopiedValue(rowData, column.uniqueName) : column.columnName;
     copyTextToClipboard(text);
   }
 
@@ -475,7 +474,6 @@
   function handleSetFormView(rowData, column) {
     openReferenceForm(rowData, column, conid, database);
   }
-
 </script>
 
 <div class="outer">
@@ -629,5 +627,4 @@
     right: 40px;
     bottom: 20px;
   }
-
 </style>

packages/web/src/utility/clipboard.js

@@ -1,3 +1,6 @@
+import _ from 'lodash';
+import { arrayToHexString } from 'dbgate-tools';
+
 export function copyTextToClipboard(text) {
   const oldFocus = document.activeElement;
 
@@ -58,3 +61,13 @@ export function copyTextToClipboard(text) {
 
   if (oldFocus) oldFocus.focus();
 }
+
+export function extractRowCopiedValue(row, col) {
+  let value = row[col];
+  if (value === undefined) value = _.get(row, col);
+  if (value === null) return '(NULL)';
+  if (value === undefined) return '(NoField)';
+  if (value.type == 'Buffer' && _.isArray(value.data)) return arrayToHexString(value.data);
+  if (_.isPlainObject(value) || _.isArray(value)) return JSON.stringify(value);
+  return value;
+}

plugins/dbgate-plugin-mysql/src/frontend/Dumper.js

@@ -1,4 +1,5 @@
-const { SqlDumper } = global.DBGATE_TOOLS;
+const { SqlDumper, arrayToHexString } = global.DBGATE_TOOLS;
+const _isArray = require('lodash/isArray');
 
 class Dumper extends SqlDumper {
   /** @param type {import('dbgate-types').TransformType} */
@@ -63,6 +64,11 @@ class Dumper extends SqlDumper {
   selectTableIntoNewTable(sourceName, targetName) {
     this.putCmd('^create ^table %f (^select * ^from %f)', targetName, sourceName);
   }
+
+  putValue(value) {
+    if (value.type == 'Buffer' && _isArray(value.data)) this.putRaw(`unhex('${arrayToHexString(value.data)}')`);
+    else super.putValue(value);
+  }
 }
 
 module.exports = Dumper;