<template>
  <div class="flex flex-col w-full gap-2">
    <UButton
      leading-icon="i-heroicons-home"
      color="gray"
      variant="ghost"
      size="md"
      label="首页"
      to="/"
    />
    <UButton
      leading-icon="i-heroicons-rectangle-stack"
      color="gray"
      variant="ghost"
      size="md"
      label="主题"
      to="/library"
    />
    <ISearchHistory @sign="$openSign"/>
    <ClientOnly v-if="deploymentType === 'saas'">
      <UButton
        v-if="!$isSignIn"
        class="flex gap-2 justify-center"
        size="lg"
        label="登录"
        @click="handleClose"
      />
    </ClientOnly>
  </div>
  <UModal v-model="$isOpenSign">
    <ISign @close="$closeSign"/>
  </UModal>
</template>
<script setup>
const MenuSider = inject('MenuSider', null)
const { $isSignIn, $isOpenSign } = storeToRefs(useUserStore())
const { $openSign, $closeSign } = useUserStore()
const { deploymentType } = useConfig();
function handleClose () {
  MenuSider && MenuSider.handleToggleAside()
  $openSign()
}
</script>
