From 636fb89c15d3c51359012b86f218c5df4e3009ef Mon Sep 17 00:00:00 2001 From: Pranav C Date: Sat, 30 Jul 2022 12:52:34 +0530 Subject: [PATCH 001/288] feat(gui-v2): add column resize in grid view Signed-off-by: Pranav C --- packages/nc-gui-v2/components.d.ts | 1 + .../nc-gui-v2/components/smartsheet/Grid.vue | 44 ++++++++++++-- .../composables/useGridViewColumnWidth.ts | 58 ++++++++++++++++++ packages/nc-gui-v2/plugins/directives.ts | 59 +++++++++++++++++++ 4 files changed, 157 insertions(+), 5 deletions(-) create mode 100644 packages/nc-gui-v2/composables/useGridViewColumnWidth.ts create mode 100644 packages/nc-gui-v2/plugins/directives.ts diff --git a/packages/nc-gui-v2/components.d.ts b/packages/nc-gui-v2/components.d.ts index 692c3f667c..10a50bc8e7 100644 --- a/packages/nc-gui-v2/components.d.ts +++ b/packages/nc-gui-v2/components.d.ts @@ -7,6 +7,7 @@ export {} declare module '@vue/runtime-core' { export interface GlobalComponents { + AAlert: typeof import('ant-design-vue/es')['Alert'] AAnchorLink: typeof import('ant-design-vue/es')['AnchorLink'] AAutoComplete: typeof import('ant-design-vue/es')['AutoComplete'] AButton: typeof import('ant-design-vue/es')['Button'] diff --git a/packages/nc-gui-v2/components/smartsheet/Grid.vue b/packages/nc-gui-v2/components/smartsheet/Grid.vue index 624049a0a4..edafe9bf84 100644 --- a/packages/nc-gui-v2/components/smartsheet/Grid.vue +++ b/packages/nc-gui-v2/components/smartsheet/Grid.vue @@ -1,7 +1,7 @@ - + diff --git a/packages/nc-gui-v2/package-lock.json b/packages/nc-gui-v2/package-lock.json index c578963671..b80358c982 100644 --- a/packages/nc-gui-v2/package-lock.json +++ b/packages/nc-gui-v2/package-lock.json @@ -10478,14 +10478,15 @@ } }, "node_modules/@intlify/bundle-utils": { - "version": "2.2.2", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@intlify/bundle-utils/-/bundle-utils-3.1.0.tgz", + "integrity": "sha512-ghlJ0kR2cCQ8D+poKknC0Xx0ncOt3J3os7CcIAqqIWVF7k6AtGoCDnIru+YzlZcvFRNmP9wEZ7jKliojCdAWNg==", "dev": true, - "license": "MIT", "dependencies": { - "@intlify/message-compiler": "^9.1.0", - "@intlify/shared": "^9.1.0", + "@intlify/message-compiler": "next", + "@intlify/shared": "next", "jsonc-eslint-parser": "^1.0.1", - "source-map": "^0.6.1", + "source-map": "0.6.1", "yaml-eslint-parser": "^0.3.2" }, "engines": { @@ -10500,6 +10501,28 @@ } } }, + "node_modules/@intlify/bundle-utils/node_modules/@intlify/message-compiler": { + "version": "9.2.0-beta.40", + "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.2.0-beta.40.tgz", + "integrity": "sha512-6QWTSYewmkew4nsRqgkwTVuGFKzxVCOK8EXsPt15N+tN1g+OYjC3PfGA2dPB6cVkNxqA9mV/hNK02uHPWU9t0A==", + "dev": true, + "dependencies": { + "@intlify/shared": "9.2.0-beta.40", + "source-map": "0.6.1" + }, + "engines": { + "node": ">= 14" + } + }, + "node_modules/@intlify/bundle-utils/node_modules/@intlify/shared": { + "version": "9.2.0-beta.40", + "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.2.0-beta.40.tgz", + "integrity": "sha512-xWz+SFjgt/LfaSbbHVn+V7gmvX4ZNP3cIFta790GWZ/tEgwJeC3tkV7i45iUbZ4ZimOerFgKH05b7qvJlKb6RQ==", + "dev": true, + "engines": { + "node": ">= 14" + } + }, "node_modules/@intlify/bundle-utils/node_modules/acorn": { "version": "7.4.1", "dev": true, @@ -10686,6 +10709,15 @@ } } }, + "node_modules/@intlify/vite-plugin-vue-i18n/node_modules/@intlify/shared": { + "version": "9.2.0-beta.40", + "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.2.0-beta.40.tgz", + "integrity": "sha512-xWz+SFjgt/LfaSbbHVn+V7gmvX4ZNP3cIFta790GWZ/tEgwJeC3tkV7i45iUbZ4ZimOerFgKH05b7qvJlKb6RQ==", + "dev": true, + "engines": { + "node": ">= 14" + } + }, "node_modules/@intlify/vite-plugin-vue-i18n/node_modules/source-map": { "version": "0.6.1", "dev": true, @@ -23075,16 +23107,34 @@ } }, "@intlify/bundle-utils": { - "version": "2.2.2", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@intlify/bundle-utils/-/bundle-utils-3.1.0.tgz", + "integrity": "sha512-ghlJ0kR2cCQ8D+poKknC0Xx0ncOt3J3os7CcIAqqIWVF7k6AtGoCDnIru+YzlZcvFRNmP9wEZ7jKliojCdAWNg==", "dev": true, "requires": { - "@intlify/message-compiler": "^9.1.0", - "@intlify/shared": "^9.1.0", + "@intlify/message-compiler": "next", + "@intlify/shared": "next", "jsonc-eslint-parser": "^1.0.1", - "source-map": "^0.6.1", + "source-map": "0.6.1", "yaml-eslint-parser": "^0.3.2" }, "dependencies": { + "@intlify/message-compiler": { + "version": "9.2.0-beta.40", + "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.2.0-beta.40.tgz", + "integrity": "sha512-6QWTSYewmkew4nsRqgkwTVuGFKzxVCOK8EXsPt15N+tN1g+OYjC3PfGA2dPB6cVkNxqA9mV/hNK02uHPWU9t0A==", + "dev": true, + "requires": { + "@intlify/shared": "9.2.0-beta.40", + "source-map": "0.6.1" + } + }, + "@intlify/shared": { + "version": "9.2.0-beta.40", + "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.2.0-beta.40.tgz", + "integrity": "sha512-xWz+SFjgt/LfaSbbHVn+V7gmvX4ZNP3cIFta790GWZ/tEgwJeC3tkV7i45iUbZ4ZimOerFgKH05b7qvJlKb6RQ==", + "dev": true + }, "acorn": { "version": "7.4.1", "dev": true @@ -23195,6 +23245,12 @@ "source-map": "0.6.1" }, "dependencies": { + "@intlify/shared": { + "version": "9.2.0-beta.40", + "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.2.0-beta.40.tgz", + "integrity": "sha512-xWz+SFjgt/LfaSbbHVn+V7gmvX4ZNP3cIFta790GWZ/tEgwJeC3tkV7i45iUbZ4ZimOerFgKH05b7qvJlKb6RQ==", + "dev": true + }, "source-map": { "version": "0.6.1", "dev": true From 8dee48756b2f2d3569aa16c1052cb76ddded8153 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Sat, 30 Jul 2022 15:40:43 +0530 Subject: [PATCH 006/288] chore/gui-v2-date-picker-cleanup --- packages/nc-gui-v2/components/cell/DatePicker.vue | 5 ----- 1 file changed, 5 deletions(-) diff --git a/packages/nc-gui-v2/components/cell/DatePicker.vue b/packages/nc-gui-v2/components/cell/DatePicker.vue index ade1685a94..d9e8ced082 100644 --- a/packages/nc-gui-v2/components/cell/DatePicker.vue +++ b/packages/nc-gui-v2/components/cell/DatePicker.vue @@ -33,11 +33,6 @@ const localState = $computed({ return /^\d+$/.test(modelValue) ? dayjs(+modelValue) : dayjs(modelValue) }, set(val?: dayjs.Dayjs) { - if (!val && !columnMeta?.rqd) { - emit('update:modelValue', null) - return - } - if (val?.isValid()) { emit('update:modelValue', val?.format('YYYY-MM-DD')) } From 2c5e19782f6d00a3afc6d8266707112515a007f1 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Sat, 30 Jul 2022 16:02:03 +0530 Subject: [PATCH 007/288] chore/gui-v2-date-picker-fixed-clearing-issue --- packages/nc-gui-v2/components/cell/DatePicker.vue | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/nc-gui-v2/components/cell/DatePicker.vue b/packages/nc-gui-v2/components/cell/DatePicker.vue index d9e8ced082..4f95466be0 100644 --- a/packages/nc-gui-v2/components/cell/DatePicker.vue +++ b/packages/nc-gui-v2/components/cell/DatePicker.vue @@ -33,6 +33,11 @@ const localState = $computed({ return /^\d+$/.test(modelValue) ? dayjs(+modelValue) : dayjs(modelValue) }, set(val?: dayjs.Dayjs) { + if (!val) { + emit('update:modelValue', null) + return + } + if (val?.isValid()) { emit('update:modelValue', val?.format('YYYY-MM-DD')) } From c7ed98e9ba757ccc208388bc6310b3288e2fb067 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Sat, 30 Jul 2022 16:10:26 +0530 Subject: [PATCH 008/288] chore/gui-v2-date-picker-improved-placeholder-text-in-readonly-mode --- packages/nc-gui-v2/components/cell/DatePicker.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/nc-gui-v2/components/cell/DatePicker.vue b/packages/nc-gui-v2/components/cell/DatePicker.vue index 4f95466be0..fe28acbc81 100644 --- a/packages/nc-gui-v2/components/cell/DatePicker.vue +++ b/packages/nc-gui-v2/components/cell/DatePicker.vue @@ -51,7 +51,7 @@ const localState = $computed({ :bordered="false" class="!w-full px-1" :format="dateFormat" - :placeholder="isDateInvalid ? 'Invalid date' : 'Select date'" + :placeholder="isDateInvalid ? 'Invalid date' : !readOnlyMode ? 'Select date' : ''" :allow-clear="!readOnlyMode" :input-read-only="true" :open="readOnlyMode ? false : undefined" From ccc0ed43fd3a1c79a1f9492520f7ca87e9238917 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Sat, 30 Jul 2022 16:14:22 +0530 Subject: [PATCH 009/288] refactor/gui-v2-added-Year-Picker --- packages/nc-gui-v2/components.d.ts | 2 + .../nc-gui-v2/components/cell/YearPicker.vue | 62 +++++++++++++++++++ .../nc-gui-v2/components/smartsheet/Cell.vue | 2 + packages/nc-gui-v2/composables/useColumn.ts | 2 + 4 files changed, 68 insertions(+) create mode 100644 packages/nc-gui-v2/components/cell/YearPicker.vue diff --git a/packages/nc-gui-v2/components.d.ts b/packages/nc-gui-v2/components.d.ts index 692c3f667c..460f7b9e11 100644 --- a/packages/nc-gui-v2/components.d.ts +++ b/packages/nc-gui-v2/components.d.ts @@ -7,6 +7,7 @@ export {} declare module '@vue/runtime-core' { export interface GlobalComponents { + AAlert: typeof import('ant-design-vue/es')['Alert'] AAnchorLink: typeof import('ant-design-vue/es')['AnchorLink'] AAutoComplete: typeof import('ant-design-vue/es')['AutoComplete'] AButton: typeof import('ant-design-vue/es')['Button'] @@ -15,6 +16,7 @@ declare module '@vue/runtime-core' { ACol: typeof import('ant-design-vue/es')['Col'] ACollapse: typeof import('ant-design-vue/es')['Collapse'] ACollapsePanel: typeof import('ant-design-vue/es')['CollapsePanel'] + ADatePicker: typeof import('ant-design-vue/es')['DatePicker'] ADivider: typeof import('ant-design-vue/es')['Divider'] ADropdown: typeof import('ant-design-vue/es')['Dropdown'] AForm: typeof import('ant-design-vue/es')['Form'] diff --git a/packages/nc-gui-v2/components/cell/YearPicker.vue b/packages/nc-gui-v2/components/cell/YearPicker.vue new file mode 100644 index 0000000000..9ed5f86c42 --- /dev/null +++ b/packages/nc-gui-v2/components/cell/YearPicker.vue @@ -0,0 +1,62 @@ + + + + + diff --git a/packages/nc-gui-v2/components/smartsheet/Cell.vue b/packages/nc-gui-v2/components/smartsheet/Cell.vue index c1b4bb7cbb..f643b37140 100644 --- a/packages/nc-gui-v2/components/smartsheet/Cell.vue +++ b/packages/nc-gui-v2/components/smartsheet/Cell.vue @@ -32,6 +32,7 @@ const { isEmail, isJSON, isDate, + isYear, isDateTime, isTime, isBoolean, @@ -177,6 +178,7 @@ todo : + diff --git a/packages/nc-gui-v2/composables/useColumn.ts b/packages/nc-gui-v2/composables/useColumn.ts index decddd5778..9eb65f1195 100644 --- a/packages/nc-gui-v2/composables/useColumn.ts +++ b/packages/nc-gui-v2/composables/useColumn.ts @@ -17,6 +17,7 @@ export default (column: ColumnType) => { const isInt = abstractType === 'integer' const isFloat = abstractType === 'float' const isDate = abstractType === 'date' || uiDatatype === 'Date' + const isYear = abstractType === 'year' || uiDatatype === 'Year' const isTime = abstractType === 'time' || uiDatatype === 'Time' const isDateTime = abstractType === 'datetime' || uiDatatype === 'DateTime' const isJSON = uiDatatype === 'JSON' @@ -55,6 +56,7 @@ export default (column: ColumnType) => { isInt, isFloat, isDate, + isYear, isTime, isDateTime, isJSON, From 8d49080cde213e4cb5055f1e64385940e73897e4 Mon Sep 17 00:00:00 2001 From: Pranav C Date: Sat, 30 Jul 2022 17:04:55 +0530 Subject: [PATCH 010/288] refactor(gui-v2): import statement correction Signed-off-by: Pranav C --- packages/nc-gui-v2/composables/useGridViewColumnWidth.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/nc-gui-v2/composables/useGridViewColumnWidth.ts b/packages/nc-gui-v2/composables/useGridViewColumnWidth.ts index f7510323b6..4116df08b3 100644 --- a/packages/nc-gui-v2/composables/useGridViewColumnWidth.ts +++ b/packages/nc-gui-v2/composables/useGridViewColumnWidth.ts @@ -1,12 +1,11 @@ import { useStyleTag } from '@vueuse/core' -import type { ColumnType, GridColumnType } from 'nocodb-sdk' +import type { ColumnType, GridColumnType, GridType } from 'nocodb-sdk' import type { Ref } from 'vue' -import type GridView from '../../nocodb/src/lib/models/GridView' import useMetas from '~/composables/useMetas' import useUIPermission from '~/composables/useUIPermission' // todo: update swagger -export default (view: Ref<(GridView & { id?: string }) | undefined>) => { +export default (view: Ref<(GridType & { id?: string }) | undefined>) => { const { css, load: loadCss, unload: unloadCss } = useStyleTag('') const { isUIAllowed } = useUIPermission() const { $api } = useNuxtApp() From 1c19c91c7c53364629d3de32c27bf4a04cf3f427 Mon Sep 17 00:00:00 2001 From: Pranav C Date: Sat, 30 Jul 2022 17:06:03 +0530 Subject: [PATCH 011/288] refactor(gui-v2): rename plugin with more relevant name Signed-off-by: Pranav C --- packages/nc-gui-v2/plugins/{directives.ts => resizeDirective.ts} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename packages/nc-gui-v2/plugins/{directives.ts => resizeDirective.ts} (100%) diff --git a/packages/nc-gui-v2/plugins/directives.ts b/packages/nc-gui-v2/plugins/resizeDirective.ts similarity index 100% rename from packages/nc-gui-v2/plugins/directives.ts rename to packages/nc-gui-v2/plugins/resizeDirective.ts From d4c28d9066e11fa5df39024c74f7d78f0e248a11 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Sat, 30 Jul 2022 17:31:24 +0530 Subject: [PATCH 012/288] refactor/gui-v2-added-DateTime-Picker --- .../components/cell/DateTimePicker.vue | 160 +++++------------- packages/nc-gui-v2/utils/dateTimeUtils.ts | 3 + 2 files changed, 41 insertions(+), 122 deletions(-) diff --git a/packages/nc-gui-v2/components/cell/DateTimePicker.vue b/packages/nc-gui-v2/components/cell/DateTimePicker.vue index 60232a7c25..39ccc68406 100644 --- a/packages/nc-gui-v2/components/cell/DateTimePicker.vue +++ b/packages/nc-gui-v2/components/cell/DateTimePicker.vue @@ -1,146 +1,62 @@ - + diff --git a/packages/nc-gui-v2/utils/dateTimeUtils.ts b/packages/nc-gui-v2/utils/dateTimeUtils.ts index e545ee290c..1a93e8fbe4 100644 --- a/packages/nc-gui-v2/utils/dateTimeUtils.ts +++ b/packages/nc-gui-v2/utils/dateTimeUtils.ts @@ -1,9 +1,12 @@ import dayjs from 'dayjs' import relativeTime from 'dayjs/plugin/relativeTime' +import customParseFormat from 'dayjs/plugin/customParseFormat' + import utc from 'dayjs/plugin/utc' dayjs.extend(utc) dayjs.extend(relativeTime) +dayjs.extend(customParseFormat) export const timeAgo = (date: any) => { return dayjs.utc(date).fromNow() From 4923ef7a7b4440d59b06382c4a5b0a14d9e10f11 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Sat, 30 Jul 2022 17:35:52 +0530 Subject: [PATCH 013/288] chore/gui-v2-date-picker-minor-cleanup --- packages/nc-gui-v2/components/cell/DatePicker.vue | 7 ++----- packages/nc-gui-v2/utils/dateTimeUtils.ts | 3 +++ 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/nc-gui-v2/components/cell/DatePicker.vue b/packages/nc-gui-v2/components/cell/DatePicker.vue index fe28acbc81..b259bdfe3e 100644 --- a/packages/nc-gui-v2/components/cell/DatePicker.vue +++ b/packages/nc-gui-v2/components/cell/DatePicker.vue @@ -1,14 +1,11 @@ diff --git a/packages/nc-gui-v2/components/cell/DateTimePicker.vue b/packages/nc-gui-v2/components/cell/DateTimePicker.vue index 39ccc68406..68f4a9087a 100644 --- a/packages/nc-gui-v2/components/cell/DateTimePicker.vue +++ b/packages/nc-gui-v2/components/cell/DateTimePicker.vue @@ -50,12 +50,12 @@ const localState = $computed({ :bordered="false" class="!w-full px-1" format="YYYY-MM-DD HH:mm" - :placeholder="isDateInvalid ? 'Invalid date' : !readOnlyMode ? 'Select date' : ''" + :placeholder="isDateInvalid ? 'Invalid date' : !readOnlyMode ? 'Select date and time' : ''" :allow-clear="!readOnlyMode" :input-read-only="true" :open="readOnlyMode ? false : undefined" > - + diff --git a/packages/nc-gui-v2/components/cell/YearPicker.vue b/packages/nc-gui-v2/components/cell/YearPicker.vue index 3d07f68184..a167dab5ed 100644 --- a/packages/nc-gui-v2/components/cell/YearPicker.vue +++ b/packages/nc-gui-v2/components/cell/YearPicker.vue @@ -52,7 +52,7 @@ const localState = $computed({ :input-read-only="true" :open="readOnlyMode ? false : undefined" > - + From 161b080ca95ec8ee519f78157bf6434f2f321dfc Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Wed, 27 Jul 2022 18:31:56 +0530 Subject: [PATCH 023/288] refactor/gui-v2-user-management-added --- packages/nc-gui-v2/components.d.ts | 1 + .../dashboard/settings/SettingsModal.vue | 3 +- .../dashboard/settings/UserManagement.vue | 247 ++++++++++++++++++ .../settings/userManagement/ShareBase.vue | 209 +++++++++++++++ .../settings/userManagement/UsersModal.vue | 215 +++++++++++++++ packages/nc-gui-v2/lib/enums.ts | 7 + packages/nc-gui-v2/package-lock.json | 38 +++ packages/nc-gui-v2/package.json | 2 + packages/nc-gui-v2/utils/miscUtils.ts | 56 ++++ packages/nc-gui-v2/utils/urlUtils.ts | 4 + packages/nc-gui-v2/utils/userUtils.ts | 8 + 11 files changed, 789 insertions(+), 1 deletion(-) create mode 100644 packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue create mode 100644 packages/nc-gui-v2/components/dashboard/settings/userManagement/ShareBase.vue create mode 100644 packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue create mode 100644 packages/nc-gui-v2/utils/miscUtils.ts create mode 100644 packages/nc-gui-v2/utils/userUtils.ts diff --git a/packages/nc-gui-v2/components.d.ts b/packages/nc-gui-v2/components.d.ts index 72c980072e..f5e940f2ba 100644 --- a/packages/nc-gui-v2/components.d.ts +++ b/packages/nc-gui-v2/components.d.ts @@ -19,6 +19,7 @@ declare module '@vue/runtime-core' { ADatePicker: typeof import('ant-design-vue/es')['DatePicker'] ADivider: typeof import('ant-design-vue/es')['Divider'] ADropdown: typeof import('ant-design-vue/es')['Dropdown'] + ADropdownButton: typeof import('ant-design-vue/es')['DropdownButton'] AForm: typeof import('ant-design-vue/es')['Form'] AFormItem: typeof import('ant-design-vue/es')['FormItem'] AInput: typeof import('ant-design-vue/es')['Input'] diff --git a/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue b/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue index b3eb076fa7..207152df00 100644 --- a/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue +++ b/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue @@ -4,6 +4,7 @@ import AuditTab from './AuditTab.vue' import AppStore from './AppStore.vue' import Metadata from './Metadata.vue' import UIAcl from './UIAcl.vue' +import UserManagement from './UserManagement.vue' import StoreFrontOutline from '~icons/mdi/storefront-outline' import TeamFillIcon from '~icons/ri/team-fill' import MultipleTableIcon from '~icons/mdi/table-multiple' @@ -39,7 +40,7 @@ const tabsInfo: TabGroup = { subTabs: { usersManagement: { title: 'Users Management', - body: () => AuditTab, + body: () => UserManagement, }, apiTokenManagement: { title: 'API Token Management', diff --git a/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue b/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue new file mode 100644 index 0000000000..dd7c683ac1 --- /dev/null +++ b/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue @@ -0,0 +1,247 @@ + + + + + diff --git a/packages/nc-gui-v2/components/dashboard/settings/userManagement/ShareBase.vue b/packages/nc-gui-v2/components/dashboard/settings/userManagement/ShareBase.vue new file mode 100644 index 0000000000..54cf704f0e --- /dev/null +++ b/packages/nc-gui-v2/components/dashboard/settings/userManagement/ShareBase.vue @@ -0,0 +1,209 @@ + + + + + diff --git a/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue b/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue new file mode 100644 index 0000000000..3f14d324b0 --- /dev/null +++ b/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue @@ -0,0 +1,215 @@ + + + + + diff --git a/packages/nc-gui-v2/lib/enums.ts b/packages/nc-gui-v2/lib/enums.ts index d2705374bc..11acd9ae1c 100644 --- a/packages/nc-gui-v2/lib/enums.ts +++ b/packages/nc-gui-v2/lib/enums.ts @@ -4,6 +4,13 @@ export enum Role { User = 'user', } +export enum ProjectRole { + Owner = 'owner', + Editor = 'editor', + User = 'user', + Guest = 'guest', +} + export enum ClientType { MYSQL = 'mysql2', MSSQL = 'mssql', diff --git a/packages/nc-gui-v2/package-lock.json b/packages/nc-gui-v2/package-lock.json index b80358c982..8a97243ea7 100644 --- a/packages/nc-gui-v2/package-lock.json +++ b/packages/nc-gui-v2/package-lock.json @@ -26,7 +26,9 @@ "devDependencies": { "@antfu/eslint-config": "^0.25.2", "@iconify-json/clarity": "^1.1.4", + "@iconify-json/eva": "^1.1.2", "@iconify-json/ic": "^1.1.7", + "@iconify-json/lucide": "^1.1.36", "@iconify-json/material-symbols": "^1.1.8", "@iconify-json/mdi": "^1.1.25", "@iconify-json/ri": "^1.1.3", @@ -10427,6 +10429,15 @@ "@iconify/types": "*" } }, + "node_modules/@iconify-json/eva": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@iconify-json/eva/-/eva-1.1.2.tgz", + "integrity": "sha512-4n3sAzXYH4vX2ehi2+kMPP7VHM1TTZ2AKJyUrAogAdbEKWhHr891huFhOSZPRJ9F2/4D4Us8SjRxBHYyUvX80w==", + "dev": true, + "dependencies": { + "@iconify/types": "*" + } + }, "node_modules/@iconify-json/ic": { "version": "1.1.7", "dev": true, @@ -10435,6 +10446,15 @@ "@iconify/types": "*" } }, + "node_modules/@iconify-json/lucide": { + "version": "1.1.37", + "resolved": "https://registry.npmjs.org/@iconify-json/lucide/-/lucide-1.1.37.tgz", + "integrity": "sha512-GfeDEy61ols35CYLfNxQWCIWdVTf/V0GI29D5IT74ToxcwqjtInQ6YVeNJCfKSGsTnnuyG+M6drd6YXLEfdjvQ==", + "dev": true, + "dependencies": { + "@iconify/types": "*" + } + }, "node_modules/@iconify-json/material-symbols": { "version": "1.1.8", "dev": true, @@ -23062,6 +23082,15 @@ "@iconify/types": "*" } }, + "@iconify-json/eva": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@iconify-json/eva/-/eva-1.1.2.tgz", + "integrity": "sha512-4n3sAzXYH4vX2ehi2+kMPP7VHM1TTZ2AKJyUrAogAdbEKWhHr891huFhOSZPRJ9F2/4D4Us8SjRxBHYyUvX80w==", + "dev": true, + "requires": { + "@iconify/types": "*" + } + }, "@iconify-json/ic": { "version": "1.1.7", "dev": true, @@ -23069,6 +23098,15 @@ "@iconify/types": "*" } }, + "@iconify-json/lucide": { + "version": "1.1.37", + "resolved": "https://registry.npmjs.org/@iconify-json/lucide/-/lucide-1.1.37.tgz", + "integrity": "sha512-GfeDEy61ols35CYLfNxQWCIWdVTf/V0GI29D5IT74ToxcwqjtInQ6YVeNJCfKSGsTnnuyG+M6drd6YXLEfdjvQ==", + "dev": true, + "requires": { + "@iconify/types": "*" + } + }, "@iconify-json/material-symbols": { "version": "1.1.8", "dev": true, diff --git a/packages/nc-gui-v2/package.json b/packages/nc-gui-v2/package.json index 2ade8b06ff..38f3be3d54 100644 --- a/packages/nc-gui-v2/package.json +++ b/packages/nc-gui-v2/package.json @@ -32,7 +32,9 @@ "devDependencies": { "@antfu/eslint-config": "^0.25.2", "@iconify-json/clarity": "^1.1.4", + "@iconify-json/eva": "^1.1.2", "@iconify-json/ic": "^1.1.7", + "@iconify-json/lucide": "^1.1.36", "@iconify-json/material-symbols": "^1.1.8", "@iconify-json/mdi": "^1.1.25", "@iconify-json/ri": "^1.1.3", diff --git a/packages/nc-gui-v2/utils/miscUtils.ts b/packages/nc-gui-v2/utils/miscUtils.ts new file mode 100644 index 0000000000..6506fd9df7 --- /dev/null +++ b/packages/nc-gui-v2/utils/miscUtils.ts @@ -0,0 +1,56 @@ +export const copyTextToClipboard = (text: string) => { + const textArea = document.createElement('textarea') + + // + // *** This styling is an extra step which is likely not required. *** + // + // Why is it here? To ensure: + // 1. the element is able to have focus and selection. + // 2. if element was to flash render it has minimal visual impact. + // 3. less flakyness with selection and copying which **might** occur if + // the textarea element is not visible. + // + // The likelihood is the element won't even render, not even a + // flash, so some of these are just precautions. However in + // Internet Explorer the element is visible whilst the popup + // box asking the user for permission for the web page to + // copy to the clipboard. + // + + // Place in top-left corner of screen regardless of scroll position. + textArea.style.position = 'fixed' + textArea.style.top = '0' + textArea.style.left = '0' + + // Ensure it has a small width and height. Setting to 1px / 1em + // doesn't work as this gives a negative w/h on some browsers. + textArea.style.width = '2em' + textArea.style.height = '2em' + + // We don't need padding, reducing the size if it does flash render. + textArea.style.padding = '0' + + // Clean up any borders. + textArea.style.border = 'none' + textArea.style.outline = 'none' + textArea.style.boxShadow = 'none' + + // Avoid flash of white box if rendered for any reason. + textArea.style.background = 'transparent' + + textArea.addEventListener('focusin', (e) => e.stopPropagation()) + + textArea.value = text + + document.body.appendChild(textArea) + textArea.focus() + textArea.select() + + try { + document.execCommand('copy') + } catch (err) { + console.log('Oops, unable to copy') + } + + document.body.removeChild(textArea) +} diff --git a/packages/nc-gui-v2/utils/urlUtils.ts b/packages/nc-gui-v2/utils/urlUtils.ts index c43f9a1efc..5f71c720a1 100644 --- a/packages/nc-gui-v2/utils/urlUtils.ts +++ b/packages/nc-gui-v2/utils/urlUtils.ts @@ -17,6 +17,10 @@ export const replaceUrlsWithLink = (text: string): boolean | string => { return found && out } +export const dashboardUrl = () => { + return `${location.origin}${location.pathname || ''}` +} + // ref : https://stackoverflow.com/a/5717133 export const isValidURL = (str: string) => { const pattern = diff --git a/packages/nc-gui-v2/utils/userUtils.ts b/packages/nc-gui-v2/utils/userUtils.ts new file mode 100644 index 0000000000..27f70ef391 --- /dev/null +++ b/packages/nc-gui-v2/utils/userUtils.ts @@ -0,0 +1,8 @@ +import { ProjectRole } from '~/lib/enums' + +export const projectRoleTagColors = { + [ProjectRole.Owner]: '#cfdffe', + [ProjectRole.Editor]: '#c2f5e8', + [ProjectRole.User]: '#4caf50', + [ProjectRole.Guest]: '#9e9e9e', +} From c9dc180f44cc75afac4c490f40f1a4a87eb462db Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Thu, 28 Jul 2022 11:39:49 +0530 Subject: [PATCH 024/288] refactor/gui-v2-user-management-tooltip-added and ui improvemnts --- .../dashboard/settings/UserManagement.vue | 88 ++++++++++++++----- .../settings/userManagement/ShareBase.vue | 82 ++++++++++------- .../settings/userManagement/UsersModal.vue | 21 +++-- 3 files changed, 123 insertions(+), 68 deletions(-) diff --git a/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue b/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue index dd7c683ac1..846875bb11 100644 --- a/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue +++ b/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue @@ -1,5 +1,6 @@ @@ -207,7 +203,7 @@ onMounted(() => { () const emits = defineEmits(['closed']) const toast = useToast() + interface Props { show: boolean selectedUser?: User } interface Users { - emails: string + emails?: string role: ProjectRole invitationToken?: string } @@ -28,8 +29,7 @@ interface Users { const { project } = useProject() const { $api, $e } = useNuxtApp() -const usersData = $ref({ emails: '', role: ProjectRole.Guest, invitationToken: undefined }) -let isFirstRender = $ref(true) +const usersData = $ref({ emails: undefined, role: ProjectRole.Guest, invitationToken: undefined }) const inviteToken = $ref(null) const formRef = ref() @@ -58,11 +58,10 @@ const validators = computed(() => { const { validateInfos } = useForm(usersData, validators) onMounted(() => { - if (isFirstRender && selectedUser) { + if (!usersData.emails && selectedUser?.email) { usersData.emails = selectedUser.email usersData.role = selectedUser.roles } - if (isFirstRender) isFirstRender = false }) const saveUser = async () => { @@ -112,7 +111,7 @@ const clickInviteMore = () => { $e('c:user:invite-more') usersData.invitationToken = undefined usersData.role = ProjectRole.Guest - usersData.emails = '' + usersData.emails = undefined } From 4be23a7b912e2aa2305cdc6c29ca1910a2e696d1 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Thu, 28 Jul 2022 13:46:17 +0530 Subject: [PATCH 027/288] refactor/gui-v2-user-management-invite-ui-improvements --- .../dashboard/settings/userManagement/UsersModal.vue | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue b/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue index b14c554bed..89c4f4fcd1 100644 --- a/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue +++ b/packages/nc-gui-v2/components/dashboard/settings/userManagement/UsersModal.vue @@ -151,9 +151,9 @@ const clickInviteMore = () => {
Looks like you have not configured mailer yet! Please copy above invite link and send it to - {{ usersData.invitationToken && usersData.emails }}. + {{ usersData.invitationToken && usersData.emails }}
-
+
@@ -198,7 +198,8 @@ const clickInviteMore = () => {
-
+
Save
+
Invite
From 48138df979d7f72aa0a335e63695492fa0cf29e9 Mon Sep 17 00:00:00 2001 From: Muhammed Mustafa Date: Thu, 28 Jul 2022 14:18:54 +0530 Subject: [PATCH 028/288] refactor/gui-v2-user-management-invite-cleanup --- .../dashboard/settings/UserManagement.vue | 32 +++++++++++-------- .../settings/userManagement/ShareBase.vue | 20 ++++++------ .../settings/userManagement/UsersModal.vue | 11 ++++--- 3 files changed, 36 insertions(+), 27 deletions(-) diff --git a/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue b/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue index 846875bb11..12e89319d3 100644 --- a/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue +++ b/packages/nc-gui-v2/components/dashboard/settings/UserManagement.vue @@ -1,6 +1,7 @@ + + From 38f3a34673634484d81e7d1a91cd1cc52bfda70e Mon Sep 17 00:00:00 2001 From: braks <78412429+bcakmakoglu@users.noreply.github.com> Date: Wed, 27 Jul 2022 14:09:30 +0200 Subject: [PATCH 072/288] feat(gui-v2): edit view name on dblclick --- .../components/smartsheet/Sidebar.vue | 95 +++++++++++++++++-- 1 file changed, 86 insertions(+), 9 deletions(-) diff --git a/packages/nc-gui-v2/components/smartsheet/Sidebar.vue b/packages/nc-gui-v2/components/smartsheet/Sidebar.vue index 73b35ecc0e..c16bedaf31 100644 --- a/packages/nc-gui-v2/components/smartsheet/Sidebar.vue +++ b/packages/nc-gui-v2/components/smartsheet/Sidebar.vue @@ -1,7 +1,7 @@ From e052aa19072db78b6b8fce2c20f6c3423e8de53f Mon Sep 17 00:00:00 2001 From: braks <78412429+bcakmakoglu@users.noreply.github.com> Date: Wed, 27 Jul 2022 14:42:38 +0200 Subject: [PATCH 073/288] feat(gui-v2): properly cancel input --- .../components/smartsheet/Sidebar.vue | 89 ++++++++++++++----- 1 file changed, 66 insertions(+), 23 deletions(-) diff --git a/packages/nc-gui-v2/components/smartsheet/Sidebar.vue b/packages/nc-gui-v2/components/smartsheet/Sidebar.vue index c16bedaf31..a37282aa62 100644 --- a/packages/nc-gui-v2/components/smartsheet/Sidebar.vue +++ b/packages/nc-gui-v2/components/smartsheet/Sidebar.vue @@ -1,9 +1,10 @@ -
@@ -251,7 +324,7 @@ function onStopEdit() {

{{ $t('activity.createView') }}

- +