<template>
  <ClientOnly>
    <div class="user _page _container">
      <template v-if="data || isRecovery">
        <NuxtPage />
      </template>

      <ProfileGuest
        v-else
        class="user__guest"
      />
    </div>
  </ClientOnly>
</template>

<script setup lang="ts">
import type { IProfileData } from '../types';

const route = useRoute();

const isRecovery = computed(() => String(route.name).includes('user-recovery-password'));

const data = computed(() => useState<IProfileData>('profileData').value);

useNoindex();
</script>

<style lang="scss">
.user {
  padding-block: 32px;
}

.user__guest {
  flex-grow: 1;
}
</style>
