feat: context menu option to fill cell with random values

antares-sql · Oct 18, 2022 · 0a2124f · 0a2124f
1 parent a852131
commit 0a2124f
Show file tree

Hide file tree

Showing 5 changed files with 137 additions and 9 deletions.
diff --git a/src/common/fieldTypes.ts b/src/common/fieldTypes.ts
@@ -29,7 +29,6 @@ export const NUMBER = [
    'SMALLINT',
    'MEDIUMINT',
    'BIGINT',
-   'DECIMAL',
    'NUMERIC',
    'INTEGER',
    'SMALLSERIAL',

diff --git a/src/renderer/components/WorkspaceTabQueryTable.vue b/src/renderer/components/WorkspaceTabQueryTable.vue
@@ -18,6 +18,7 @@
          @show-delete-modal="showDeleteConfirmModal"
          @set-null="setNull"
          @copy-cell="copyCell"
+         @fill-cell="fillCell"
          @copy-row="copyRow"
          @duplicate-row="duplicateRow"
          @close-context="closeContext"
@@ -122,7 +123,7 @@ import { useSettingsStore } from '@/stores/settings';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import { useConsoleStore } from '@/stores/console';
 import { exportRows } from '../libs/exportRows';
-import { TEXT, LONG_TEXT, BLOB } from 'common/fieldTypes';
+import { TEXT, LONG_TEXT, BLOB, DATE, DATETIME, TIME } from 'common/fieldTypes';
 import BaseVirtualScroll from '@/components/BaseVirtualScroll.vue';
 import WorkspaceTabQueryTableRow from '@/components/WorkspaceTabQueryTableRow.vue';
 import TableContext from '@/components/WorkspaceTabQueryTableContext.vue';
@@ -133,6 +134,7 @@ import { TableField, QueryResult } from 'common/interfaces/antares';
 import { TableUpdateParams } from 'common/interfaces/tableApis';
 import { jsonToSqlInsert } from 'common/libs/sqlUtils';
 import { unproxify } from '@/libs/unproxify';
+import faker from '@faker-js/faker';
 
 const { t } = useI18n();
 
@@ -463,6 +465,51 @@ const copyRow = (format: string) => {
    }
 };
 
+const fillCell = (event: { name: string; group: string; type: string }) => {
+   const row = localResults.value.find((row: any) => selectedRows.value.includes(row._antares_id));
+   let fakeValue;
+   let datePrecision = '';
+
+   for (let i = 0; i < selectedCell.value.length; i++)
+      datePrecision += i === 0 ? '.S' : 'S';
+
+   if (event.group === 'custom') {
+      if (event.type === 'time' && event.name === 'now')
+         fakeValue = moment().format(`HH:mm:ss${datePrecision}`);
+      else if (event.type === 'time' && event.name === 'random')
+         fakeValue = moment(faker.date.recent()).format(`HH:mm:ss${datePrecision}`);
+      else if (event.type === 'datetime' && event.name === 'now')
+         fakeValue = moment().format(`YYYY-MM-DD HH:mm:ss${datePrecision}`);
+   }
+   else {
+      fakeValue = (faker as any)[event.group][event.name]();
+      if (['string', 'number'].includes(typeof fakeValue)) {
+         if (typeof fakeValue === 'number')
+            fakeValue = String(fakeValue);
+
+         if (selectedCell.value.length)
+            fakeValue = fakeValue.substring(0, selectedCell.value.length);
+      }
+      else if ([...DATE, ...DATETIME].includes(selectedCell.value.type))
+         fakeValue = moment(fakeValue).format(`YYYY-MM-DD HH:mm:ss${datePrecision}`);
+      else if (TIME.includes(selectedCell.value.type))
+         fakeValue = moment(fakeValue).format(`HH:mm:ss${datePrecision}`);
+   }
+
+   const params = {
+      primary: primaryField.value?.name,
+      schema: getSchema(resultsetIndex.value),
+      table: getTable(resultsetIndex.value),
+      id: getPrimaryValue(row),
+      row,
+      orgRow: row,
+      field: selectedCell.value.field,
+      content: fakeValue
+   };
+
+   emit('update-field', params);
+};
+
 const duplicateRow = () => {
    const row = localResults.value.find((row: any) => selectedRows.value.includes(row._antares_id));
    const rowToDuplicate = JSON.parse(JSON.stringify(row));

diff --git a/src/renderer/components/WorkspaceTabQueryTableContext.vue b/src/renderer/components/WorkspaceTabQueryTableContext.vue
@@ -43,14 +43,25 @@
          </span>
       </div>
       <div
-         v-if="selectedRows.length === 1 && selectedCell.isEditable && mode === 'table'"
+         v-if="selectedRows.length === 1 && selectedCell.isEditable && mode === 'table' && fakerGroup"
          class="context-element"
-         @click="duplicateRow"
       >
          <span class="d-flex">
             <i class="mdi mdi-18px mdi-auto-fix text-light pr-1" /> {{ t('message.fillCell') }}
          </span>
          <i class="mdi mdi-18px mdi-chevron-right text-light pl-1" />
+         <div class="context-submenu">
+            <div
+               v-for="method in fakerMethods[fakerGroup]"
+               :key="method.name"
+               class="context-element"
+               @click="fillCell(method)"
+            >
+               <span class="d-flex">
+                  {{ t(`faker.${method.name}`) }}
+               </span>
+            </div>
+         </div>
       </div>
       <div
          v-if="selectedRows.length === 1 && selectedCell.isEditable"
@@ -74,13 +85,14 @@
 </template>
 
 <script setup lang="ts">
-import { Prop } from 'vue';
+import { computed, Prop } from 'vue';
 import BaseContextMenu from '@/components/BaseContextMenu.vue';
 import { useI18n } from 'vue-i18n';
+import { TEXT, LONG_TEXT, NUMBER, FLOAT, DATE, TIME, DATETIME, UUID } from 'common/fieldTypes';
 
 const { t } = useI18n();
 
-defineProps({
+const props = defineProps({
    contextEvent: MouseEvent,
    selectedRows: Array,
    selectedCell: Object,
@@ -93,9 +105,61 @@ const emit = defineEmits([
    'set-null',
    'copy-cell',
    'copy-row',
-   'duplicate-row'
+   'duplicate-row',
+   'fill-cell'
 ]);
 
+const fakerMethods = {
+   string: [
+      { name: 'word', group: 'lorem' },
+      { name: 'text', group: 'lorem' },
+      { name: 'firstName', group: 'name' },
+      { name: 'lastName', group: 'name' },
+      { name: 'jobTitle', group: 'name' },
+      { name: 'phoneNumber', group: 'phone' },
+      { name: 'exampleEmail', group: 'internet' },
+      { name: 'ip', group: 'internet' },
+      { name: 'domainName', group: 'internet' },
+      { name: 'color', group: 'internet' }
+   ],
+   number: [
+      { name: 'number', group: 'random' }
+   ],
+   float: [
+      { name: 'float', group: 'random' },
+      { name: 'amount', group: 'finance' }
+   ],
+   datetime: [
+      { name: 'now', group: 'custom' },
+      { name: 'past', group: 'date' },
+      { name: 'future', group: 'date' }
+   ],
+   time: [
+      { name: 'now', group: 'custom' },
+      { name: 'random', group: 'custom' }
+   ],
+   uuid: [
+      { name: 'uuid', group: 'random' }
+   ]
+};
+
+const fakerGroup = computed(() => {
+   if ([...TEXT, ...LONG_TEXT].includes(props.selectedCell.type))
+      return 'string';
+   else if (NUMBER.includes(props.selectedCell.type))
+      return 'number';
+   else if (FLOAT.includes(props.selectedCell.type))
+      return 'float';
+   else if ([...DATE, ...DATETIME].includes(props.selectedCell.type))
+      return 'datetime';
+   else if (TIME.includes(props.selectedCell.type))
+      return 'time';
+   else if (UUID.includes(props.selectedCell.type))
+      return 'uuid';
+   else
+      return false;
+});
+
 const showConfirmModal = () => {
    emit('show-delete-modal');
 };
@@ -123,4 +187,9 @@ const duplicateRow = () => {
    emit('duplicate-row');
    closeContext();
 };
+
+const fillCell = (method: {name: string; group: string}) => {
+   emit('fill-cell', { ...method, type: fakerGroup.value });
+   closeContext();
+};
 </script>
diff --git a/src/renderer/components/WorkspaceTabQueryTableRow.vue b/src/renderer/components/WorkspaceTabQueryTableRow.vue
@@ -11,7 +11,12 @@
          :class="{selected: selectedCell === cKey}"
          @click="selectRow($event, cKey)"
 
-         @contextmenu.prevent="openContext($event, { id: row._antares_id, orgField: cKey })"
+         @contextmenu.prevent="openContext($event, {
+            id: row._antares_id,
+            orgField: cKey,
+            type: fields[cKey].type,
+            length: fields[cKey].charLength || fields[cKey].length
+         })"
       >
          <template v-if="cKey !== '_antares_id'">
             <span
@@ -530,7 +535,14 @@ const getKeyUsage = (keyName: string) => {
    return props.keyUsage.find(key => key.field === keyName);
 };
 
-const openContext = (event: MouseEvent, payload: { id: string; field?: string; orgField: string; isEditable?: boolean }) => {
+const openContext = (event: MouseEvent, payload: {
+   id: string;
+   field?: string;
+   orgField: string;
+   isEditable?: boolean;
+   type: string;
+   length: number | false;
+}) => {
    payload.field = props.fields[payload.orgField].name;// Ensures field name only
    payload.isEditable = isEditable.value;
    emit('contextmenu', event, payload);

diff --git a/src/renderer/i18n/en-US.ts b/src/renderer/i18n/en-US.ts
@@ -389,6 +389,7 @@ export const enUS = {
       collation: 'Collation',
       engine: 'Engine',
       past: 'Past',
+      now: 'Now',
       future: 'Future',
       between: 'Between',
       recent: 'Recent',