clients/web: fix imports following merge conflict

clients/apps/web/src/app/(main)/dashboard/[organization]/(header)/customers/[id]/ClientPage.tsx

@@ -11,12 +11,12 @@ import { SubscriptionStatusLabel } from '@/components/Subscriptions/utils'
 import { useListSubscriptions, useMetrics } from '@/hooks/queries'
 import { useOrders } from '@/hooks/queries/orders'
 import { Customer, Organization } from '@polar-sh/api'
+import Button from '@polar-sh/ui/components/atoms/Button'
+import { DataTable } from '@polar-sh/ui/components/atoms/DataTable'
+import FormattedDateTime from '@polar-sh/ui/components/atoms/FormattedDateTime'
+import ShadowBox from '@polar-sh/ui/components/atoms/ShadowBox'
 import { RowSelectionState } from '@tanstack/react-table'
 import Link from 'next/link'
-import { FormattedDateTime } from 'polarkit/components/ui/atoms'
-import Button from 'polarkit/components/ui/atoms/button'
-import { DataTable } from 'polarkit/components/ui/atoms/datatable'
-import ShadowBox from 'polarkit/components/ui/atoms/shadowbox'
 import React, { useEffect, useState } from 'react'
 
 interface ClientPageProps {

clients/apps/web/src/app/(main)/dashboard/[organization]/(header)/sales/[id]/ClientPage.tsx

@@ -1,5 +1,6 @@
 'use client'
 
+import { CustomerContextView } from '@/components/Customer/CustomerContextView'
 import CustomFieldValue from '@/components/CustomFields/CustomFieldValue'
 import { DashboardBody } from '@/components/Layout/DashboardLayout'
 import { InlineModal } from '@/components/Modal/InlineModal'
@@ -17,6 +18,7 @@ import { useRefunds } from '@/hooks/queries/refunds'
 import { markdownOptionsJustText } from '@/utils/markdown'
 import { Organization, Product, RefundReason } from '@polar-sh/api'
 import Button from '@polar-sh/ui/components/atoms/Button'
+import { DataTable } from '@polar-sh/ui/components/atoms/DataTable'
 import FormattedDateTime from '@polar-sh/ui/components/atoms/FormattedDateTime'
 import Pill from '@polar-sh/ui/components/atoms/Pill'
 import ShadowBox from '@polar-sh/ui/components/atoms/ShadowBox'

clients/apps/web/src/app/(main)/dashboard/[organization]/(header)/sales/subscriptions/ClientPage.tsx

@@ -7,7 +7,6 @@ import { SubscriptionModal } from '@/components/Subscriptions/SubscriptionModal'
 import { SubscriptionStatus as SubscriptionStatusComponent } from '@/components/Subscriptions/SubscriptionStatus'
 import SubscriptionStatusSelect from '@/components/Subscriptions/SubscriptionStatusSelect'
 import SubscriptionTiersSelect from '@/components/Subscriptions/SubscriptionTiersSelect'
-import { subscriptionStatusDisplayNames } from '@/components/Subscriptions/utils'
 import { useListSubscriptions, useProducts } from '@/hooks/queries'
 import { getServerURL } from '@/utils/api'
 import {
@@ -16,11 +15,7 @@ import {
   getAPIParams,
   serializeSearchParams,
 } from '@/utils/datatable'
-import {
-  AccessTimeOutlined,
-  CancelOutlined,
-  FileDownloadOutlined,
-} from '@mui/icons-material'
+import { FileDownloadOutlined } from '@mui/icons-material'
 import {
   Organization,
   Product,
@@ -35,108 +30,9 @@ import {
   DataTableColumnHeader,
 } from '@polar-sh/ui/components/atoms/DataTable'
 import FormattedDateTime from '@polar-sh/ui/components/atoms/FormattedDateTime'
-import Pill from '@polar-sh/ui/components/atoms/Pill'
 import { RowSelectionState } from '@tanstack/react-table'
 import { useRouter } from 'next/navigation'
 import React, { useEffect, useState } from 'react'
-import { twMerge } from 'tailwind-merge'
-
-const CANCELLATION_REASONS: {
-  [key: string]: string
-} = {
-  unused: 'Unused',
-  too_expensive: 'Too Expensive',
-  missing_features: 'Missing Features',
-  switched_service: 'Switched Service',
-  customer_service: 'Customer Service',
-  low_quality: 'Low Quality',
-  too_complex: 'Too Complicated',
-  other: 'Other',
-}
-
-const getHumanCancellationReason = (key: string | null) => {
-  if (key && key in CANCELLATION_REASONS) {
-    return CANCELLATION_REASONS[key]
-  }
-  return null
-}
-
-const StatusLabel = ({
-  color,
-  dt,
-  icon,
-  children,
-}: {
-  color: string
-  dt?: string | null
-  icon?: React.ReactNode
-  children: React.ReactNode
-}) => {
-  let prettyEventDate = null
-  if (dt) {
-    const event = new Date(dt)
-    const now = new Date()
-    if (event.getFullYear() != now.getFullYear()) {
-      prettyEventDate = event.toLocaleDateString('en-US', {
-        day: 'numeric',
-        month: 'short',
-        year: 'numeric',
-      })
-    } else {
-      prettyEventDate = event.toLocaleDateString('en-US', {
-        day: 'numeric',
-        month: 'short',
-      })
-    }
-  }
-
-  return (
-    <div className={`flex flex-row items-center gap-x-2`}>
-      <span className={twMerge('h-2 w-2 rounded-full border-2', color)} />
-      <span className="capitalize">{children}</span>
-      {prettyEventDate && (
-        <Pill color="gray" className="flex flex-row">
-          {icon}
-          <span className="!ml-1">{prettyEventDate}</span>
-        </Pill>
-      )}
-    </div>
-  )
-}
-
-const Status = ({ subscription }: { subscription: Subscription }) => {
-  switch (subscription.status) {
-    case 'active':
-      if (!subscription.ends_at) {
-        return <StatusLabel color="border-emerald-500">Active</StatusLabel>
-      }
-      return (
-        <StatusLabel
-          color="border-yellow-500"
-          dt={subscription.ends_at}
-          icon={<AccessTimeOutlined fontSize="inherit" />}
-        >
-          Ending
-        </StatusLabel>
-      )
-    case 'canceled':
-      return (
-        <StatusLabel
-          color="border-red-500"
-          dt={subscription.ended_at}
-          icon={<CancelOutlined fontSize="inherit" />}
-        >
-          Canceled
-        </StatusLabel>
-      )
-    default:
-      return (
-        <StatusLabel color="border-red-500">
-          {subscriptionStatusDisplayNames[subscription.status]}
-        </StatusLabel>
-      )
-  }
-}
 
 interface ClientPageProps {
   organization: Organization

clients/apps/web/src/components/Refunds/RefundModal.tsx

@@ -1,24 +1,24 @@
 import { useCreateRefund } from '@/hooks/queries'
 import { Order, RefundCreate, RefundReason } from '@polar-sh/api'
-import { formatCurrencyAndAmount } from '@polarkit/lib/money'
-import Button from 'polarkit/components/ui/atoms/button'
-import MoneyInput from 'polarkit/components/ui/atoms/moneyinput'
+import Button from '@polar-sh/ui/components/atoms/button'
+import MoneyInput from '@polar-sh/ui/components/atoms/moneyinput'
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue,
-} from 'polarkit/components/ui/atoms/select'
-import { Checkbox } from 'polarkit/components/ui/checkbox'
+} from '@polar-sh/ui/components/atoms/select'
+import { Checkbox } from '@polar-sh/ui/components/ui/checkbox'
 import {
   Form,
   FormControl,
   FormField,
   FormItem,
   FormLabel,
   FormMessage,
-} from 'polarkit/components/ui/form'
+} from '@polar-sh/ui/components/ui/form'
+import { formatCurrencyAndAmount } from '@polar-sh/ui/lib/money'
 import { useForm } from 'react-hook-form'
 import { toast } from '../Toast/use-toast'
 import { RefundReasonDisplay } from './utils'

clients/apps/web/src/components/Subscriptions/SubscriptionModal.tsx

@@ -11,17 +11,17 @@ import {
   SubscriptionCancel,
   ValidationError,
 } from '@polar-sh/api'
-import { FormattedDateTime } from 'polarkit/components/ui/atoms'
-import Avatar from 'polarkit/components/ui/atoms/avatar'
-import Button from 'polarkit/components/ui/atoms/button'
+import FormattedDateTime from '@polar-sh/ui/components/atoms/FormattedDateTime'
+import Avatar from '@polar-sh/ui/components/atoms/avatar'
+import Button from '@polar-sh/ui/components/atoms/button'
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue,
-} from 'polarkit/components/ui/atoms/select'
-import TextArea from 'polarkit/components/ui/atoms/textarea'
+} from '@polar-sh/ui/components/atoms/select'
+import TextArea from '@polar-sh/ui/components/atoms/textarea'
 import {
   Form,
   FormControl,
@@ -30,7 +30,7 @@ import {
   FormItem,
   FormLabel,
   FormMessage,
-} from 'polarkit/components/ui/form'
+} from '@polar-sh/ui/components/ui/form'
 import { useCallback, useState } from 'react'
 import { useForm } from 'react-hook-form'
 import CustomFieldValue from '../CustomFields/CustomFieldValue'

clients/apps/web/src/components/Subscriptions/SubscriptionStatus.tsx

@@ -3,7 +3,7 @@ import { CancelOutlined } from '@mui/icons-material'
 import { AccessTimeOutlined } from '@mui/icons-material'
 
 import { Subscription } from '@polar-sh/api'
-import { Pill } from 'polarkit/components/ui/atoms'
+import Pill from '@polar-sh/ui/components/atoms/Pill'
 import { twMerge } from 'tailwind-merge'
 import { subscriptionStatusDisplayNames } from './utils'