Add current_period tracking to subscriptions, document prediction engine, and refactor station list UI
Some checks failed
linter / quality (push) Has been cancelled
tests / ci (8.3) (push) Has been cancelled
tests / ci (8.4) (push) Has been cancelled
tests / ci (8.5) (push) Has been cancelled

Add current_period_start, current_period_end, and stripe_data columns to subscriptions table via migration. Extend Subscription model with datetime casts for new fields. Create comprehensive prediction engine documentation covering signals, aggregation, confidence calibration, and weekly summary logic. Add PredictionFull Vue component displaying action label, reasoning, and 7-day context. Refactor StationList to collapse outdated stations behind expandable section. Add UpsellBanner component with station count formatting. Create .claude/settings.json denying .env file access. Add todo.md tracking Stripe dashboard setup, production deployment steps, and E2E QA checklist. Update .env.example with fuel-finder credentials, Anthropic config, and complete Stripe price IDs.
This commit is contained in:
Ovidiu U
2026-04-29 18:14:03 +01:00
parent 8695d5ec95
commit 775e076bb7
9 changed files with 517 additions and 20 deletions

View File

@@ -0,0 +1,52 @@
<template>
<div
v-if="!isPaidTier"
class="relative overflow-hidden rounded-2xl border border-accent/30 bg-gradient-to-r from-accent/10 via-accent/5 to-transparent p-5 sm:p-6"
>
<div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
<div class="flex items-start gap-4">
<div class="shrink-0 w-11 h-11 rounded-2xl bg-accent text-white flex items-center justify-center shadow-md">
<iconify-icon class="text-xl" icon="lucide:sparkles"></iconify-icon>
</div>
<div class="space-y-1">
<h3 class="text-lg sm:text-xl font-black text-zinc-800 leading-tight">
Stop guessing. Get a buy-or-wait alert before every fill-up.
</h3>
<p class="text-sm text-zinc-500">
14-day predictions + daily price-drop alerts across
<span class="font-bold text-zinc-800">{{ stationCountLabel }}</span> UK stations.
From <span class="font-bold text-zinc-800">£0.99/mo</span>.
</p>
</div>
</div>
<a
:href="ctaHref"
class="shrink-0 inline-flex items-center justify-center gap-2 px-5 py-3 rounded-xl bg-accent text-white text-sm font-black shadow-lg hover:bg-accent-content transition-colors"
>
{{ ctaLabel }}
<iconify-icon class="text-base" icon="lucide:arrow-right"></iconify-icon>
</a>
</div>
</div>
</template>
<script setup>
import { computed } from 'vue'
import { useAuth } from '../composables/useAuth.js'
const props = defineProps({
stationCount: { type: Number, default: null },
})
const { isAuthenticated, isPaidTier } = useAuth()
const stationCountLabel = computed(() => {
if (!props.stationCount) {
return '14,500+'
}
return new Intl.NumberFormat('en-GB').format(props.stationCount)
})
const ctaHref = computed(() => isAuthenticated.value ? '#pricing' : '/register?tier=plus&cadence=monthly')
const ctaLabel = computed(() => isAuthenticated.value ? 'See plans' : 'Start saving')
</script>