Browse Source

Merge branch 'develop' into feat/gui-v2-toolbar

pull/2860/head
Pranav C 2 years ago committed by GitHub
parent
commit
a15a2e5245
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 41
      packages/nc-gui-v2/components/cell/Email.vue
  2. 14
      packages/nc-gui-v2/components/cell/Url.vue
  3. 2
      packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue
  4. 2
      packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue
  5. 2
      packages/nc-gui-v2/components/virtual-cell/Formula.vue
  6. 1
      packages/nc-gui-v2/composables/index.ts
  7. 20
      packages/nc-gui-v2/composables/useInjectionState/index.ts
  8. 14
      packages/nc-gui-v2/composables/useUIPermission/index.ts
  9. 7
      packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts

41
packages/nc-gui-v2/components/cell/Email.vue

@ -2,40 +2,31 @@
import { computed } from '#imports' import { computed } from '#imports'
import { isEmail } from '~/utils' import { isEmail } from '~/utils'
const { modelValue: value } = defineProps<Props>()
const emit = defineEmits(['update:modelValue'])
const editEnabled = inject<boolean>('editEnabled')
interface Props { interface Props {
modelValue: string modelValue: string
} }
interface Emits {
(event: 'update:modelValue', model: string): void
}
const props = defineProps<Props>()
const emits = defineEmits<Emits>()
const root = ref<HTMLInputElement>() const root = ref<HTMLInputElement>()
const localState = computed({
get: () => value,
set: (val) => emit('update:modelValue', val),
})
const validEmail = computed(() => isEmail(value)) const editEnabled = inject<boolean>('editEnabled')
</script>
<script lang="ts"> const vModel = useVModel(props, 'modelValue', emits)
export default {
name: 'EmailCell', const validEmail = computed(() => isEmail(vModel.value))
}
</script> </script>
<template> <template>
<input v-if="editEnabled" ref="root" v-model="localState" /> <input v-if="editEnabled" ref="root" v-model="vModel" class="outline-none prose-sm" />
<a <a v-else-if="validEmail" class="prose-sm underline hover:opacity-75" :href="`mailto:${vModel}`" target="_blank">
v-else-if="validEmail" {{ vModel }}
class="caption py-2 text-primary underline hover:opacity-75"
:href="`mailto:${value}`"
target="_blank"
>
{{ value }}
</a> </a>
<span v-else>{{ value }}</span> <span v-else>{{ vModel }}</span>
</template> </template>

14
packages/nc-gui-v2/components/cell/Url.vue

@ -8,11 +8,14 @@ interface Props {
} }
const { modelValue: value } = defineProps<Props>() const { modelValue: value } = defineProps<Props>()
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue'])
const column = inject(ColumnInj) const column = inject(ColumnInj)
const editEnabled = inject<boolean>('editEnabled') const editEnabled = inject<boolean>('editEnabled')
const localState = computed({ const vModel = computed({
get: () => value, get: () => value,
set: (val) => { set: (val) => {
if (!(column && column.meta && column.meta.validate) || isValidURL(val)) { if (!(column && column.meta && column.meta.validate) || isValidURL(val)) {
@ -24,19 +27,16 @@ const localState = computed({
const isValid = computed(() => value && isValidURL(value)) const isValid = computed(() => value && isValidURL(value))
const root = ref<HTMLInputElement>() const root = ref<HTMLInputElement>()
onMounted(() => { onMounted(() => {
root.value?.focus() root.value?.focus()
}) })
</script> </script>
<template> <template>
<span v-if="editEnabled"> <input v-if="editEnabled" ref="root" v-model="vModel" class="outline-none" />
<input ref="root" v-model="localState" /> <nuxt-link v-else-if="isValid" class="py-2 underline hover:opacity-75" :to="value" target="_blank">{{ value }}</nuxt-link>
</span>
<span v-else>
<a v-if="isValid" class="caption py-2 text-primary underline hover:opacity-75" :href="value" target="_blank">{{ value }}</a>
<span v-else>{{ value }}</span> <span v-else>{{ value }}</span>
</span>
</template> </template>
<style scoped></style> <style scoped></style>

2
packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue

@ -110,7 +110,7 @@ function onOpenModal(type: ViewTypes, title = '') {
</button> </button>
</div> </div>
<general-flipping-card class="my-4 lg:my-6 min-h-[100px] w-[250px]" :triggers="['click', { duration: 15000 }]"> <general-flipping-card class="my-4 lg:my-6 min-h-[100px]" :triggers="['click', { duration: 15000 }]">
<template #front> <template #front>
<div class="flex h-full w-full gap-6 flex-col"> <div class="flex h-full w-full gap-6 flex-col">
<general-social /> <general-social />

2
packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue

@ -210,7 +210,7 @@ function onDeleted() {
<style lang="scss"> <style lang="scss">
.nc-views-menu { .nc-views-menu {
@apply flex-1 max-h-[200px] overflow-y-scroll scrollbar-thin-primary; @apply flex-1 max-h-[20vh] overflow-y-scroll scrollbar-thin-primary;
.ghost, .ghost,
.ghost > * { .ghost > * {

2
packages/nc-gui-v2/components/virtual-cell/Formula.vue

@ -35,7 +35,7 @@ const urls = computed(() => replaceUrlsWithLink(result.value))
<div class="pa-2" @dblclick="showEditFormulaWarningMessage"> <div class="pa-2" @dblclick="showEditFormulaWarningMessage">
<div v-if="urls" v-html="urls" /> <div v-if="urls" v-html="urls" />
<div v-else>{{ result }}</div> <div v-else>{{ result }}</div>
<div v-if="showEditFormulaWarning" class="text-left mt-2 text-[#e65100]"> <div v-if="showEditFormulaWarning" class="text-left text-wrap mt-2 text-[#e65100]">
<!-- TODO: i18n --> <!-- TODO: i18n -->
Warning: Formula fields should be configured in the field menu dropdown. Warning: Formula fields should be configured in the field menu dropdown.
</div> </div>

1
packages/nc-gui-v2/composables/index.ts

@ -1,5 +1,6 @@
export * from './useApi' export * from './useApi'
export * from './useGlobal' export * from './useGlobal'
export * from './useInjectionState'
export * from './useUIPermission' export * from './useUIPermission'
export * from './useAttachment' export * from './useAttachment'
export * from './useBelongsTo' export * from './useBelongsTo'

20
packages/nc-gui-v2/composables/useInjectionState/index.ts

@ -0,0 +1,20 @@
import type { InjectionKey } from 'vue'
export function useInjectionState<Arguments extends any[], Return>(
composable: (...args: Arguments) => Return,
keyName = 'InjectionState',
): readonly [useProvidingState: (...args: Arguments) => void, useInjectedState: () => Return | undefined] {
const key: string | InjectionKey<Return> = Symbol(keyName)
const useProvidingState = (...args: Arguments) => {
const providedState = composable(...args)
provide(key, providedState)
return providedState
}
const useInjectedState = () => inject(key)
return [useProvidingState, useInjectedState]
}

14
packages/nc-gui-v2/composables/useUIPermission/index.ts

@ -1,4 +1,4 @@
import type { RolePermissions } from './rolePermissions' import type { Permission } from './rolePermissions'
import rolePermissions from './rolePermissions' import rolePermissions from './rolePermissions'
import { useState } from '#app' import { useState } from '#app'
import { USER_PROJECT_ROLES } from '~/lib/constants' import { USER_PROJECT_ROLES } from '~/lib/constants'
@ -7,7 +7,7 @@ export function useUIPermission() {
const { $state } = useNuxtApp() const { $state } = useNuxtApp()
const projectRoles = useState<Record<string, boolean>>(USER_PROJECT_ROLES, () => ({})) const projectRoles = useState<Record<string, boolean>>(USER_PROJECT_ROLES, () => ({}))
const isUIAllowed = (permission: RolePermissions, _skipPreviewAs = false) => { const isUIAllowed = (permission: Permission, _skipPreviewAs = false) => {
const user = $state.user const user = $state.user
let userRoles = user?.value?.roles || {} let userRoles = user?.value?.roles || {}
// if string populate key-value paired object // if string populate key-value paired object
@ -31,14 +31,10 @@ export function useUIPermission() {
// }; // };
// } // }
return Object.entries(roles).some(([role, hasRole]) => { return Object.entries<boolean>(roles).some(([role, hasRole]) => {
const rolePermission = rolePermissions[role as keyof typeof rolePermissions] const rolePermission = rolePermissions[role as keyof typeof rolePermissions] as '*' | Record<Permission, true>
return ( return hasRole && (rolePermission === '*' || rolePermission[permission])
hasRole &&
(rolePermission === '*' ||
(typeof rolePermission === 'object' && rolePermission[permission as keyof typeof rolePermission]))
)
}) })
} }

7
packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts

@ -40,9 +40,10 @@ export default rolePermissions
type GetKeys<T> = T extends Record<string, any> ? keyof T : never type GetKeys<T> = T extends Record<string, any> ? keyof T : never
export type RolePermissions<T extends typeof rolePermissions = typeof rolePermissions, K extends keyof T = keyof T> = export type Permission<T extends typeof rolePermissions = typeof rolePermissions, K extends keyof T = keyof T> = K extends
| T[K] extends string | 'creator'
| 'owner'
? T[K] ? T[K]
: never & T[K] extends Record<string, any> : never | T[K] extends Record<string, any>
? GetKeys<T[K]> ? GetKeys<T[K]>
: never : never

Loading…
Cancel
Save