<script>
import { markRaw } from 'vue'

import UserModal from '@inside-users/modals/UserModal.vue'
import { Link } from 'inside-collection/components'
import { BaseText } from 'inside-collection/atoms'
import { isSuperAdmin } from '@inside-library/helpers/Rights'

export default {
  name: 'user-modal',
  $_i18nRootPath: 'users.MODAL',
  components: { Link, BaseText },
  extends: UserModal,
  data() {
    return {
      selection: {
        uuid: 'uuid',
        image: 'image',
        firstname: 'firstname',
        lastname: 'lastname',
        function: 'function',
        email: 'email',
        phone: 'phone',
        mobile: 'mobile',
        cities: 'city',
        departments: 'departments.data',
        zip: 'zip',
        usersStatus: 'users_status.title',
        sectors: 'sectors',
        linkedin: 'linkedin',
        facebook: 'facebook',
        franchisedSpaces: 'franchised_spaces'
      }
    }
  },
  methods: {
    scaffold(fields) {
      return {
        avatar: fields.image,
        title: this.$_username(fields),
        subtitle: fields.function,
        socials: isSuperAdmin()
          ? [
              { url: fields.linkedin, icon: 'linkedin' },
              { url: fields.facebook, icon: 'facebook' }
            ]
          : [],
        sections: [
          {
            fields: [
              ...this.insertIf(!!fields.email && isSuperAdmin(), {
                label: this.$_tr('email'),
                tag: markRaw(Link),
                value: fields.email,
                data: {
                  href: `mailto:${fields.email}`,
                  icon: null,
                  external: true
                }
              }),
              ...this.insertIf(!!fields.phone && isSuperAdmin(), {
                label: this.$_tr('phone'),
                tag: markRaw(Link),
                value: fields.phone,
                data: {
                  href: `tel:${fields.phone}`,
                  icon: null,
                  external: true
                }
              }),
              ...this.insertIf(!!fields.mobile && isSuperAdmin(), {
                label: this.$_tr('mobile'),
                tag: markRaw(Link),
                value: fields.mobile,
                data: {
                  href: `tel:${fields.mobile}`,
                  icon: null,
                  external: true
                }
              }),
              ...this.insertIf(isSuperAdmin(), {
                label: this.$_tr('status'),
                value: fields.usersStatus
              }),
              ...this.insertIf(isSuperAdmin(), {
                label: this.$_tr('city'),
                value: fields.cities
              }),
              ...this.insertIf(
                this.isAlive(fields, ['departments', 0]) && isSuperAdmin(),
                {
                  label: this.$_tr('departments'),
                  children: (fields.departments || []).map(({ title }) => ({
                    value: title
                  }))
                }
              ),
              ...this.insertIf(isSuperAdmin(), {
                label: this.$_tr('zip'),
                value: fields.zip
              }),
              ...this.insertIf(isSuperAdmin(), {
                label: this.$_tr('sectors'),
                value: fields.sectors
              }),
              ...this.insertIf(!!fields.franchisedSpaces, {
                tag: markRaw(BaseText),
                label: this.$_tr('franchisedSpaces'),
                value: fields?.franchisedSpaces?.title
              })
            ]
          }
        ]
      }
    }
  }
}
</script>
