Sales Overview

"use client"

import { money } from "../price/money"
import type { SalesPoint, SalesQuery } from "@/components/blocks/sales-overview/sales"
import { SalesOverview } from "@/components/blocks/sales-overview/sales-overview"

type ShopifyqlResponse = {
  data: {
    shopifyqlQuery: {
      tableData: { columns: { name: string }[]; rows: Record<string, string>[] } | null
      parseErrors: string[]
    }
  }
}

const groupBy = { hour: "hour", day: "day", week: "week" } as const

async function shopifyql(query: string, signal: AbortSignal) {
  const response = await fetch("/api/shopify/graphql", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({
      query: `query Sales($q: String!) { shopifyqlQuery(query: $q) { tableData { columns { name } rows } parseErrors } }`,
      variables: { q: query },
    }),
    signal,
  })
  if (!response.ok) throw new Error("Shopify analytics didn’t respond. Try again in a minute.")
  const { data } = (await response.json()) as ShopifyqlResponse
  if (data.shopifyqlQuery.parseErrors.length) throw new Error(data.shopifyqlQuery.parseErrors[0])
  return data.shopifyqlQuery.tableData?.rows ?? []
}

function toPoints(rows: Record<string, string>[], currencyCode: string): SalesPoint[] {
  return rows.map((row) => ({
    date: row.hour ? row.hour.slice(0, 13) : (row.day ?? row.week).slice(0, 10),
    sales: money(row.total_sales, currencyCode),
    orders: Number(row.orders),
    sessions: row.sessions === undefined ? undefined : Number(row.sessions),
    customers: Number(row.customers),
    returningCustomers: Number(row.returning_customers),
  }))
}

async function loadSeries(query: SalesQuery, signal: AbortSignal) {
  const select = "SHOW total_sales, orders, sessions, customers, returning_customers"
  const range = (start: string, end: string) =>
    `FROM sales, sessions ${select} SINCE ${start} UNTIL ${end} TIMESERIES ${groupBy[query.granularity]}`
  const [current, previous] = await Promise.all([
    shopifyql(range(query.range.start, query.range.end), signal),
    query.comparison
      ? shopifyql(range(query.comparison.start, query.comparison.end), signal)
      : Promise.resolve(null),
  ])
  return {
    current: toPoints(current, "USD"),
    previous: previous ? toPoints(previous, "USD") : null,
  }
}

export function ShopifyHome({ shopTimeZone }: { shopTimeZone: string }) {
  return (
    <SalesOverview
      loaders={{ series: loadSeries }}
      currencyCode="USD"
      now={new Date().toISOString()}
      timeZone={shopTimeZone}
      title="Home"
    />
  )
}

"use client"

import { fromMinorUnits } from "../price/money"
import { bucketize, zonedNow, type SalesPoint, type SalesQuery } from "@/components/blocks/sales-overview/sales"
import { SalesOverview } from "@/components/blocks/sales-overview/sales-overview"

type StripeCharge = {
  id: string
  amount: number
  amount_refunded: number
  currency: string
  created: number
  status: "succeeded" | "pending" | "failed"
}

const timeZone = "America/New_York"

async function listCharges(start: string, end: string, signal: AbortSignal) {
  const params = new URLSearchParams({ start, end, timeZone })
  const response = await fetch(`/api/stripe/charges?${params}`, { signal })
  if (!response.ok) throw new Error("Couldn’t load charges from Stripe.")
  return (await response.json()) as StripeCharge[]
}

function chargesToRows(charges: StripeCharge[]): SalesPoint[] {
  return charges
    .filter((charge) => charge.status === "succeeded")
    .map((charge) => {
      const local = zonedNow(new Date(charge.created * 1000), timeZone)
      return {
        date: `${local.day}T${String(local.hour).padStart(2, "0")}`,
        sales: fromMinorUnits(charge.amount - charge.amount_refunded, charge.currency),
        orders: 1,
      }
    })
}

async function loadSeries(query: SalesQuery, signal: AbortSignal) {
  const current = await listCharges(query.range.start, query.range.end, signal)
  const previous = query.comparison
    ? await listCharges(query.comparison.start, query.comparison.end, signal)
    : null
  return {
    current: bucketize(chargesToRows(current), query.buckets, "USD"),
    previous: previous ? bucketize(chargesToRows(previous), query.comparisonBuckets, "USD") : null,
  }
}

export function StripeRevenue() {
  return (
    <SalesOverview
      loaders={{ series: loadSeries }}
      currencyCode="USD"
      now={new Date().toISOString()}
      timeZone={timeZone}
      metrics={["sales", "orders", "averageOrderValue"]}
      title="Revenue"
    />
  )
}

"use client"

import type { SalesChannelRow, TopProductRow } from "@/components/blocks/sales-overview/breakdowns"
import type { SalesQuery, SalesSeries } from "@/components/blocks/sales-overview/sales"
import { SalesOverview } from "@/components/blocks/sales-overview/sales-overview"

function report<T>(name: string) {
  return async (query: SalesQuery, signal: AbortSignal): Promise<T> => {
    const response = await fetch(`/api/reports/${name}`, {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        start: query.range.start,
        end: query.range.end,
        compareStart: query.comparison?.start,
        compareEnd: query.comparison?.end,
        granularity: query.granularity,
        timeZone: query.timeZone,
      }),
      signal,
    })
    if (!response.ok) {
      const body = (await response.json().catch(() => null)) as { error?: string } | null
      throw new Error(body?.error ?? "This report didn’t load.")
    }
    return response.json() as Promise<T>
  }
}

const loaders = {
  series: report<SalesSeries>("sales"),
  channels: report<SalesChannelRow[]>("channels"),
  products: report<TopProductRow[]>("top-products"),
}

export function Dashboard({ now, timeZone }: { now: string; timeZone: string }) {
  return (
    <SalesOverview
      loaders={loaders}
      currencyCode="EUR"
      locale="de-DE"
      now={now}
      timeZone={timeZone}
      title="Overview"
    />
  )
}