Browse Source

chore(gui-v2): remove duplicate and unused components

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/3262/head
Pranav C 2 years ago
parent
commit
6dea33e1e3
  1. 23
      packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/AddRow.vue
  2. 116
      packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/LockMenu.vue
  3. 17
      packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/Reload.vue
  4. 3
      packages/nc-gui-v2/utils/viewUtils.ts

23
packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/AddRow.vue

@ -1,23 +0,0 @@
<script setup lang="ts">
import { OpenNewRecordFormHookInj, inject } from '#imports'
const isLocked = inject(IsLockedInj)
const openNewRecordFormHook = inject(OpenNewRecordFormHookInj)!
const onClick = () => {
if (!isLocked?.value) openNewRecordFormHook.trigger()
}
</script>
<template>
<a-tooltip placement="bottom">
<template #title> {{ $t('activity.addRow') }} </template>
<div :class="{ 'group': !isLocked, 'disabled-ring': isLocked }" class="nc-add-row flex align-center">
<MdiPlusOutline
:class="{ 'cursor-pointer text-gray-500 group-hover:(text-primary) ': !isLocked, 'disabled': isLocked }"
@click="onClick"
/>
</div>
</a-tooltip>
</template>

116
packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/LockMenu.vue

@ -1,116 +0,0 @@
<script lang="ts" setup>
import { message } from 'ant-design-vue'
import { computed, useSmartsheetStoreOrThrow } from '#imports'
import { extractSdkResponseErrorMsg } from '~/utils'
import MdiLockOutlineIcon from '~icons/mdi/lock-outline'
import MdiAccountIcon from '~icons/mdi/account'
import MdiAccountGroupIcon from '~icons/mdi/account-group'
enum LockType {
Personal = 'personal',
Locked = 'locked',
Collaborative = 'collaborative',
}
const { view, $api } = useSmartsheetStoreOrThrow()
const { $e } = useNuxtApp()
async function changeLockType(type: LockType) {
$e('a:grid:lockmenu', { lockType: type })
if (type === 'personal') {
return message.info('Coming soon')
}
try {
;(view.value as any).lock_type = type
$api.dbView.update(view.value.id as string, {
lock_type: type,
})
message.success(`Successfully Switched to ${type} view`)
} catch (e: any) {
message.error(await extractSdkResponseErrorMsg(e))
}
}
const Icon = computed(() => {
switch ((view.value as any)?.lock_type) {
case LockType.Personal:
return MdiAccountIcon
case LockType.Locked:
return MdiLockOutlineIcon
case LockType.Collaborative:
default:
return MdiAccountGroupIcon
}
})
</script>
<template>
<a-dropdown max-width="350" :trigger="['click']">
<div class="nc-sidebar-right-item hover:after:bg-indigo-500 group nc-sidebar-lock-menu">
<Icon class="cursor-pointer group-hover:(!text-white)" />
</div>
<template #overlay>
<div class="min-w-[350px] max-w-[500px] shadow bg-white">
<div>
<div class="nc-menu-item" @click="changeLockType(LockType.Collaborative)">
<div>
<MdiCheck v-if="!view?.lock_type || view?.lock_type === LockType.Collaborative" />
<span v-else />
<div>
<MdiAccountGroupIcon />
Collaborative view
<div class="nc-subtitle">Collaborators with edit permissions or higher can change the view configuration.</div>
</div>
</div>
</div>
<div class="nc-menu-item" @click="changeLockType(LockType.Locked)">
<div>
<MdiCheck v-if="view.lock_type === LockType.Locked" />
<span v-else />
<div>
<MdiLockOutlineIcon />
Locked View
<div class="nc-subtitle">No one can edit the view configuration until it is unlocked.</div>
</div>
</div>
</div>
<div class="nc-menu-item" @click="changeLockType(LockType.Personal)">
<div>
<MdiCheck v-if="view.lock_type === LockType.Personal" />
<span v-else />
<div>
<MdiAccountIcon />
Personal view
<div class="nc-subtitle">
Only you can edit the view configuration. Other collaborators personal views are hidden by default.
</div>
</div>
</div>
</div>
</div>
</div>
</template>
</a-dropdown>
</template>
<style scoped>
.nc-menu-item > div {
@apply grid grid-cols-[30px,auto] gap-2 p-2 items-center;
}
.nc-menu-item > div > svg {
align-self: center;
}
.nc-menu-option > :first-child {
@apply self-center;
}
.nc-subtitle {
@apply font-size-sm font-weight-light;
}
</style>

17
packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/Reload.vue

@ -1,17 +0,0 @@
<script setup lang="ts">
import { ReloadViewDataHookInj, inject } from '#imports'
const reloadHook = inject(ReloadViewDataHookInj)!
const onClick = () => reloadHook.trigger()
</script>
<template>
<a-tooltip placement="bottom">
<template #title> {{ $t('general.reload') }} </template>
<div class="group flex align-center">
<MdiReload class="cursor-pointer text-gray-500 group-hover:(text-primary)" @click="onClick" />
</div>
</a-tooltip>
</template>

3
packages/nc-gui-v2/utils/viewUtils.ts

@ -1,4 +1,5 @@
import { ViewTypes } from 'nocodb-sdk' import { ViewTypes } from 'nocodb-sdk'
import { themeV2Colors } from '~/utils'
import MdiGridIcon from '~icons/mdi/grid-large' import MdiGridIcon from '~icons/mdi/grid-large'
import MdiFormIcon from '~icons/mdi/form-select' import MdiFormIcon from '~icons/mdi/form-select'
@ -9,7 +10,7 @@ import MdiEyeIcon from '~icons/mdi/eye-circle-outline'
export const viewIcons = { export const viewIcons = {
[ViewTypes.GRID]: { icon: MdiGridIcon, color: '#8f96f2' }, [ViewTypes.GRID]: { icon: MdiGridIcon, color: '#8f96f2' },
[ViewTypes.FORM]: { icon: MdiFormIcon, color: '#ec4899' }, [ViewTypes.FORM]: { icon: MdiFormIcon, color: themeV2Colors.pink['500'] },
calendar: { icon: MdiCalendarIcon, color: 'purple' }, calendar: { icon: MdiCalendarIcon, color: 'purple' },
[ViewTypes.GALLERY]: { icon: MdiGalleryIcon, color: 'orange' }, [ViewTypes.GALLERY]: { icon: MdiGalleryIcon, color: 'orange' },
[ViewTypes.KANBAN]: { icon: MdiKanbanIcon, color: 'green' }, [ViewTypes.KANBAN]: { icon: MdiKanbanIcon, color: 'green' },

Loading…
Cancel
Save