useWorkspaceMenuItems.ts

import { computed } from 'vue'
import { useI18n } from 'vue-i18n'

import type { MenuItem } from 'primevue/menuitem'

import { useBillingContext } from '@/composables/billing/useBillingContext'
import { useWorkspaceUI } from '@/platform/workspace/composables/useWorkspaceUI'
import { useDialogService } from '@/services/dialogService'

/**
 * Builds the Plan & Credits overflow-menu model for the workspace subscription
 * panel. Visibility and the Delete enable/disable policy are derived from the
 * shared useWorkspaceUI state so this menu can't desync with the sibling
 * Plan & Credits panel menu.
 */
export function useWorkspaceMenuItems() {
  const { t } = useI18n()
  const { billingStatus, isFreeTier, subscription } = useBillingContext()
  const {
    permissions,
    uiConfig,
    isInPersonalWorkspace,
    isActiveSubscription,
    isSubscriptionCancelled,
    isDeleteDisabled,
    deleteDisabledTooltipKey
  } = useWorkspaceUI()
  const {
    showCancelSubscriptionFlow,
    showEditWorkspaceDialog,
    showDeleteWorkspaceDialog,
    showLeaveWorkspaceDialog
  } = useDialogService()

  function editWorkspace() {
    void showEditWorkspaceDialog()
  }

  function cancelSubscription() {
    if (
      !permissions.value.canManageSubscriptionLifecycle ||
      !canCancelPlan.value
    ) {
      return
    }
    void showCancelSubscriptionFlow(subscription.value?.endDate ?? undefined)
  }

  function deleteWorkspace() {
    if (
      !permissions.value.canManageSubscription ||
      isInPersonalWorkspace.value ||
      isDeleteDisabled.value
    ) {
      return
    }
    void showDeleteWorkspaceDialog()
  }

  function leaveWorkspace() {
    if (!permissions.value.canLeaveWorkspace) return
    void showLeaveWorkspaceDialog()
  }

  const canCancelPlan = computed(
    () =>
      permissions.value.canManageSubscriptionLifecycle &&
      (isActiveSubscription.value ||
        billingStatus.value === 'payment_failed' ||
        billingStatus.value === 'paused') &&
      !isSubscriptionCancelled.value &&
      !isFreeTier.value
  )

  const canDeleteWorkspace = computed(
    () =>
      permissions.value.canManageSubscription && !isInPersonalWorkspace.value
  )

  const deleteTooltip = computed(() => {
    const key = deleteDisabledTooltipKey.value
    return key ? t(key) : undefined
  })

  const menuItems = computed<MenuItem[]>(() => {
    const items: MenuItem[] = []

    if (uiConfig.value.showEditWorkspaceMenuItem) {
      items.push({
        label: t('workspacePanel.menu.editWorkspace'),
        command: editWorkspace
      })
    }

    if (canCancelPlan.value) {
      items.push({
        label: t('subscription.cancelPlan'),
        command: cancelSubscription
      })
    }

    if (canDeleteWorkspace.value) {
      items.push({
        label: t('workspacePanel.menu.deleteWorkspace'),
        class: isDeleteDisabled.value
          ? 'data-disabled:cursor-not-allowed data-disabled:text-destructive-background/50 data-disabled:pointer-events-auto'
          : 'text-destructive-background',
        disabled: isDeleteDisabled.value,
        tooltip: deleteTooltip.value,
        command: isDeleteDisabled.value ? undefined : deleteWorkspace
      })
    }

    if (permissions.value.canLeaveWorkspace) {
      items.push({
        label: t('workspacePanel.menu.leaveWorkspace'),
        command: leaveWorkspace
      })
    }

    return items
  })

  // Figma 3343-25140 renders a divider between every menu option.
  const menuEntries = computed<MenuItem[]>(() =>
    menuItems.value.flatMap((item, index) =>
      index === 0 ? [item] : [{ separator: true }, item]
    )
  )

  return { menuItems, menuEntries }
}