|
|
@ -67,10 +67,8 @@ onMounted(() => { |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div class="flex w-full flex-col p-1 border-t-1 border-gray-200 gap-y-2"> |
|
|
|
<div class="flex w-full flex-col p-1 border-t-1 border-gray-200 gap-y-2"> |
|
|
|
<NcDropdown v-model:visible="isMenuOpen" placement="topLeft" overlay-class-name="!min-w-64"> |
|
|
|
<NcDropdown v-model:visible="isMenuOpen" placement="topLeft" overlay-class-name="!min-w-64"> |
|
|
|
<div |
|
|
|
<div class="flex flex-row py-2 px-3 gap-x-2 items-center hover:bg-gray-200 rounded-lg cursor-pointer h-10" |
|
|
|
class="flex flex-row py-2 px-3 gap-x-2 items-center hover:bg-gray-200 rounded-lg cursor-pointer h-10" |
|
|
|
data-testid="nc-sidebar-userinfo"> |
|
|
|
data-testid="nc-sidebar-userinfo" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<GeneralUserIcon /> |
|
|
|
<GeneralUserIcon /> |
|
|
|
<div class="flex truncate"> |
|
|
|
<div class="flex truncate"> |
|
|
|
{{ name ? name : user?.email }} |
|
|
|
{{ name ? name : user?.email }} |
|
|
@ -82,28 +80,30 @@ onMounted(() => { |
|
|
|
<NcMenuItem data-testid="nc-sidebar-user-logout" @click="logout"> |
|
|
|
<NcMenuItem data-testid="nc-sidebar-user-logout" @click="logout"> |
|
|
|
<GeneralLoader v-if="isLoggingOut" class="!ml-0.5 !mr-0.5 !max-h-4.5 !-mt-0.5" /> |
|
|
|
<GeneralLoader v-if="isLoggingOut" class="!ml-0.5 !mr-0.5 !max-h-4.5 !-mt-0.5" /> |
|
|
|
<GeneralIcon v-else icon="signout" class="menu-icon" /> |
|
|
|
<GeneralIcon v-else icon="signout" class="menu-icon" /> |
|
|
|
Log Out</NcMenuItem |
|
|
|
Log Out |
|
|
|
> |
|
|
|
</NcMenuItem> |
|
|
|
<NcDivider /> |
|
|
|
<NcDivider /> |
|
|
|
<a href="https://docs.nocodb.com" target="_blank" class="!underline-transparent"> |
|
|
|
<a href="https://docs.nocodb.com" target="_blank" class="!underline-transparent"> |
|
|
|
<NcMenuItem> |
|
|
|
<NcMenuItem> |
|
|
|
<GeneralIcon icon="help" class="menu-icon" /> |
|
|
|
<GeneralIcon icon="help" class="menu-icon" /> |
|
|
|
Help Center</NcMenuItem |
|
|
|
Help Center |
|
|
|
> |
|
|
|
</NcMenuItem> |
|
|
|
</a> |
|
|
|
</a> |
|
|
|
<NcDivider /> |
|
|
|
<NcDivider /> |
|
|
|
<a href="https://discord.gg/5RgZmkW" target="_blank" class="!underline-transparent"> |
|
|
|
<a href="https://discord.gg/5RgZmkW" target="_blank" class="!underline-transparent"> |
|
|
|
<NcMenuItem class="social-icon-wrapper" |
|
|
|
<NcMenuItem class="social-icon-wrapper"> |
|
|
|
><GeneralIcon class="social-icon" icon="discord" />Join our Discord</NcMenuItem |
|
|
|
<GeneralIcon class="social-icon" icon="discord" />Join our Discord |
|
|
|
> |
|
|
|
</NcMenuItem> |
|
|
|
</a> |
|
|
|
</a> |
|
|
|
<a href="https://www.reddit.com/r/NocoDB" target="_blank" class="!underline-transparent"> |
|
|
|
<a href="https://www.reddit.com/r/NocoDB" target="_blank" class="!underline-transparent"> |
|
|
|
<NcMenuItem class="social-icon-wrapper"><GeneralIcon class="social-icon" icon="reddit" />/r/NocoDB</NcMenuItem> |
|
|
|
<NcMenuItem class="social-icon-wrapper"> |
|
|
|
|
|
|
|
<GeneralIcon class="social-icon" icon="reddit" />/r/NocoDB |
|
|
|
|
|
|
|
</NcMenuItem> |
|
|
|
</a> |
|
|
|
</a> |
|
|
|
<a href="https://twitter.com/nocodb" target="_blank" class="!underline-transparent"> |
|
|
|
<a href="https://twitter.com/nocodb" target="_blank" class="!underline-transparent"> |
|
|
|
<NcMenuItem class="social-icon-wrapper group" |
|
|
|
<NcMenuItem class="social-icon-wrapper group"> |
|
|
|
><GeneralIcon class="text-gray-500 group-hover:text-gray-800" icon="twitter" />Twitter</NcMenuItem |
|
|
|
<GeneralIcon class="text-gray-500 group-hover:text-gray-800" icon="twitter" />Twitter |
|
|
|
> |
|
|
|
</NcMenuItem> |
|
|
|
</a> |
|
|
|
</a> |
|
|
|
<template v-if="!appInfo.ee"> |
|
|
|
<template v-if="!appInfo.ee"> |
|
|
|
<NcDivider /> |
|
|
|
<NcDivider /> |
|
|
@ -114,7 +114,8 @@ onMounted(() => { |
|
|
|
<div class="flex items-center text-gray-400 text-xs">(Community Translated)</div> |
|
|
|
<div class="flex items-center text-gray-400 text-xs">(Community Translated)</div> |
|
|
|
<div class="flex-1" /> |
|
|
|
<div class="flex-1" /> |
|
|
|
|
|
|
|
|
|
|
|
<MaterialSymbolsChevronRightRounded class="transform group-hover:(scale-115 text-accent) text-xl text-gray-400" /> |
|
|
|
<MaterialSymbolsChevronRightRounded |
|
|
|
|
|
|
|
class="transform group-hover:(scale-115 text-accent) text-xl text-gray-400" /> |
|
|
|
</NcMenuItem> |
|
|
|
</NcMenuItem> |
|
|
|
|
|
|
|
|
|
|
|
<template #content> |
|
|
|
<template #content> |
|
|
@ -126,35 +127,34 @@ onMounted(() => { |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<NcDivider /> |
|
|
|
<NcDivider /> |
|
|
|
<NcMenuItem @click="onCopy" |
|
|
|
<NcMenuItem @click="onCopy"> |
|
|
|
><GeneralIcon v-if="isAuthTokenCopied" icon="check" class="group-hover:text-black menu-icon" /><GeneralIcon |
|
|
|
<GeneralIcon v-if="isAuthTokenCopied" icon="check" class="group-hover:text-black menu-icon" /> |
|
|
|
v-else |
|
|
|
<GeneralIcon v-else icon="copy" class="menu-icon" /> |
|
|
|
icon="copy" |
|
|
|
|
|
|
|
class="menu-icon" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<template v-if="isAuthTokenCopied"> Copied Auth Token </template> |
|
|
|
<template v-if="isAuthTokenCopied"> Copied Auth Token </template> |
|
|
|
<template v-else> Copy Auth Token </template> |
|
|
|
<template v-else> Copy Auth Token </template> |
|
|
|
</NcMenuItem> |
|
|
|
</NcMenuItem> |
|
|
|
<nuxt-link v-e="['c:navbar:user:email']" class="!no-underline" to="/account/profile"> |
|
|
|
<nuxt-link v-e="['c:navbar:user:email']" class="!no-underline" to="/account/profile"> |
|
|
|
<NcMenuItem><GeneralIcon icon="settings" class="menu-icon" /> Account Settings</NcMenuItem> |
|
|
|
<NcMenuItem> |
|
|
|
|
|
|
|
<GeneralIcon icon="settings" class="menu-icon" /> Account Settings |
|
|
|
|
|
|
|
</NcMenuItem> |
|
|
|
</nuxt-link> |
|
|
|
</nuxt-link> |
|
|
|
</NcMenu> |
|
|
|
</NcMenu> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</NcDropdown> |
|
|
|
</NcDropdown> |
|
|
|
|
|
|
|
|
|
|
|
<div v-if="appInfo.ee" class="text-gray-500 text-xs pl-3">© 2023 NocoDB. Inc</div> |
|
|
|
<div v-if="appInfo.ee" class="text-gray-500 text-xs pl-3">© 2023 NocoDB. Inc</div> |
|
|
|
<div v-else-if="isMounted" class="flex flex-row justify-between flex-wrap pt-1 truncate"> |
|
|
|
<div v-else-if="isMounted" class="flex flex-row justify-between pt-1 truncate"> |
|
|
|
<div class="flex items-start flex-row justify-center px-3 gap-2 mb-1"> |
|
|
|
<div class="flex flex-wrap mb-1"> |
|
|
|
<GithubButton href="https://github.com/nocodb/nocodb" data-icon="octicon-star" data-show-count="true" data-size="large"> |
|
|
|
<GithubButton class="px-3 mb-1" href="https://github.com/nocodb/nocodb" data-icon="octicon-star" |
|
|
|
|
|
|
|
data-show-count="true" data-size="large"> |
|
|
|
Star |
|
|
|
Star |
|
|
|
</GithubButton> |
|
|
|
</GithubButton> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="flex items-start flex-row justify-center gap-2"> |
|
|
|
|
|
|
|
<GeneralJoinCloud class="color-transition px-3 text-gray-500 cursor-pointer select-none hover:text-accent" /> |
|
|
|
<GeneralJoinCloud class="color-transition px-3 text-gray-500 cursor-pointer select-none hover:text-accent" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
<style lang="scss" scoped> |
|
|
@ -167,6 +167,7 @@ onMounted(() => { |
|
|
|
:deep(.ant-popover-inner-content) { |
|
|
|
:deep(.ant-popover-inner-content) { |
|
|
|
@apply !p-0 !rounded-md; |
|
|
|
@apply !p-0 !rounded-md; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.social-icon { |
|
|
|
.social-icon { |
|
|
|
// Make icon black and white |
|
|
|
// Make icon black and white |
|
|
|
filter: grayscale(100%); |
|
|
|
filter: grayscale(100%); |
|
|
@ -181,6 +182,7 @@ onMounted(() => { |
|
|
|
.nc-icon { |
|
|
|
.nc-icon { |
|
|
|
@apply mr-0.15; |
|
|
|
@apply mr-0.15; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
&:hover { |
|
|
|
.social-icon { |
|
|
|
.social-icon { |
|
|
|
filter: none !important; |
|
|
|
filter: none !important; |
|
|
|