Browse Source

fix: remove Transition component

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/4495/head
Pranav C 2 years ago
parent
commit
70790f2b0b
  1. 156
      packages/nc-gui/pages/index/index/index.vue

156
packages/nc-gui/pages/index/index/index.vue

@ -212,92 +212,94 @@ const copyProjectMeta = async () => {
</a-dropdown> </a-dropdown>
</div> </div>
<Transition name="layout" mode="out-in"> <!--
<div v-if="isLoading"> TODO: bring back transition after fixing the bug with navigation
<a-skeleton /> <Transition name="layout" mode="out-in"> -->
</div> <div v-if="isLoading">
<a-skeleton />
<a-table </div>
v-else
:custom-row="customRow"
:data-source="filteredProjects"
:pagination="{ position: ['bottomCenter'] }"
:table-layout="md ? 'auto' : 'fixed'"
>
<template #emptyText>
<a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
</template>
<!-- Title --> <a-table
<a-table-column key="title" :title="$t('general.title')" data-index="title"> v-else
<template #default="{ text, record }"> :custom-row="customRow"
<div class="flex items-center"> :data-source="filteredProjects"
<div @click.stop> :pagination="{ position: ['bottomCenter'] }"
<a-menu class="!border-0 !m-0 !p-0" trigger-sub-menu-action="click"> :table-layout="md ? 'auto' : 'fixed'"
<template v-if="isUIAllowed('projectTheme')"> >
<a-sub-menu key="theme" popup-class-name="custom-color"> <template #emptyText>
<template #title> <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
<div </template>
class="color-selector"
:style="{ <!-- Title -->
'background-color': getProjectPrimary(record), <a-table-column key="title" :title="$t('general.title')" data-index="title">
'width': '8px', <template #default="{ text, record }">
'height': '100%', <div class="flex items-center">
}" <div @click.stop>
/> <a-menu class="!border-0 !m-0 !p-0" trigger-sub-menu-action="click">
</template> <template v-if="isUIAllowed('projectTheme')">
<a-sub-menu key="theme" popup-class-name="custom-color">
<template #title>
<div
class="color-selector"
:style="{
'background-color': getProjectPrimary(record),
'width': '8px',
'height': '100%',
}"
/>
</template>
<template #expandIcon></template> <template #expandIcon></template>
<LazyGeneralColorPicker <LazyGeneralColorPicker
:model-value="getProjectPrimary(record)" :model-value="getProjectPrimary(record)"
:colors="projectThemeColors" :colors="projectThemeColors"
:row-size="9" :row-size="9"
:advanced="false" :advanced="false"
@input="handleProjectColor(record.id, $event)" @input="handleProjectColor(record.id, $event)"
/> />
<a-sub-menu key="pick-primary"> <a-sub-menu key="pick-primary">
<template #title> <template #title>
<div class="nc-project-menu-item group !py-0"> <div class="nc-project-menu-item group !py-0">
<ClarityColorPickerSolid class="group-hover:text-accent" /> <ClarityColorPickerSolid class="group-hover:text-accent" />
Custom Color Custom Color
</div> </div>
</template> </template>
<template #expandIcon></template> <template #expandIcon></template>
<LazyGeneralChromeWrapper @input="handleProjectColor(record.id, $event)" /> <LazyGeneralChromeWrapper @input="handleProjectColor(record.id, $event)" />
</a-sub-menu>
</a-sub-menu> </a-sub-menu>
</template> </a-sub-menu>
</a-menu> </template>
</div> </a-menu>
<div
class="capitalize color-transition group-hover:text-primary !w-[400px] h-full overflow-hidden overflow-ellipsis whitespace-nowrap pl-2"
>
{{ text }}
</div>
</div> </div>
</template> <div
</a-table-column> class="capitalize color-transition group-hover:text-primary !w-[400px] h-full overflow-hidden overflow-ellipsis whitespace-nowrap pl-2"
<!-- Actions --> >
{{ text }}
<a-table-column key="id" :title="$t('labels.actions')" data-index="id">
<template #default="{ text, record }">
<div class="flex items-center gap-2">
<MdiEditOutline v-e="['c:project:edit:rename']" class="nc-action-btn" @click.stop="navigateTo(`/${text}`)" />
<MdiDeleteOutline
class="nc-action-btn"
:data-testid="`delete-project-${record.title}`"
@click.stop="deleteProject(record)"
/>
</div> </div>
</template> </div>
</a-table-column> </template>
</a-table> </a-table-column>
</Transition> <!-- Actions -->
<a-table-column key="id" :title="$t('labels.actions')" data-index="id">
<template #default="{ text, record }">
<div class="flex items-center gap-2">
<MdiEditOutline v-e="['c:project:edit:rename']" class="nc-action-btn" @click.stop="navigateTo(`/${text}`)" />
<MdiDeleteOutline
class="nc-action-btn"
:data-testid="`delete-project-${record.title}`"
@click.stop="deleteProject(record)"
/>
</div>
</template>
</a-table-column>
</a-table>
<!-- </Transition> -->
</div> </div>
</template> </template>

Loading…
Cancel
Save