23 - Price tracking opt-in: migration, flag, conditional UI, onboarding checkbox

This commit is contained in:
myrmidex 2026-05-01 22:02:13 +02:00
parent 0861cff8b4
commit 818e8b2276
13 changed files with 119 additions and 74 deletions

View file

@ -24,6 +24,7 @@ public function current(): JsonResponse
return response()->json([
'asset' => $asset,
'price_tracking_enabled' => $user?->price_tracking_enabled ?? false,
]);
}

View file

@ -36,7 +36,11 @@ public function update(Request $request)
return back()->withErrors(['asset' => 'Please set an asset first.']);
}
$assetPrice = AssetPrice::updatePrice($user->asset_id, $validated['date'], $validated['price']);
AssetPrice::updatePrice($user->asset_id, $validated['date'], $validated['price']);
if (!$user->price_tracking_enabled) {
$user->update(['price_tracking_enabled' => true]);
}
return back()->with('success', 'Asset price updated successfully!');
}

View file

@ -26,6 +26,7 @@ class User extends Authenticatable
'email',
'password',
'asset_id',
'price_tracking_enabled',
];
/**
@ -43,6 +44,7 @@ protected function casts(): array
return [
'email_verified_at' => 'datetime',
'password' => 'hashed',
'price_tracking_enabled' => 'boolean',
];
}

View file

@ -18,6 +18,7 @@ public function up(): void
$table->timestamp('email_verified_at')->nullable();
$table->string('password');
$table->foreignId('asset_id')->nullable()->constrained()->onDelete('set null');
$table->boolean('price_tracking_enabled')->default(false);
$table->rememberToken();
$table->timestamps();

View file

@ -22,22 +22,6 @@ COPY --from=composer:latest /usr/bin/composer /usr/bin/composer
# Set working directory
WORKDIR /var/www/html
# Copy composer files and install PHP dependencies
COPY composer.json ./
RUN composer install --no-dev --optimize-autoloader --no-scripts
# Copy package.json and install Node dependencies
COPY package*.json ./
RUN npm ci
# Copy application code
COPY . .
# Set permissions
RUN chown -R www-data:www-data /var/www/html \
&& chmod -R 755 /var/www/html/storage \
&& chmod -R 755 /var/www/html/bootstrap/cache
# Copy and set up container start script
COPY docker/dev/podman/container-start.sh /usr/local/bin/container-start.sh
RUN chmod +x /usr/local/bin/container-start.sh

View file

@ -15,6 +15,10 @@ if ! grep -q "APP_KEY=base64:" /var/www/html/.env; then
sed -i "s/APP_KEY=/APP_KEY=$NEW_KEY/" /var/www/html/.env
fi
# Install dependencies if needed
[ ! -f vendor/autoload.php ] && composer install --no-interaction
[ ! -d node_modules/.bin ] && npm install
# Run migrations
php artisan migrate --force

View file

@ -21,8 +21,8 @@ services:
- VITE_PORT=5173
volumes:
- ../../../:/var/www/html:Z
- /var/www/html/node_modules
- /var/www/html/vendor
- app_node_modules:/var/www/html/node_modules
- app_vendor:/var/www/html/vendor
ports:
- "8000:8000"
- "5173:5173"
@ -70,3 +70,5 @@ networks:
volumes:
db_data:
driver: local
app_node_modules:
app_vendor:

2
package-lock.json generated
View file

@ -1,5 +1,5 @@
{
"name": "site",
"name": "html",
"lockfileVersion": 3,
"requires": true,
"packages": {

View file

@ -27,6 +27,7 @@ interface StatsBoxProps {
onAddMilestone?: () => void;
onUpdatePrice?: () => void;
assetSymbol?: string;
priceTrackingEnabled?: boolean;
}
export default function StatsBox({
@ -38,7 +39,8 @@ export default function StatsBox({
onAddPurchase,
onAddMilestone,
onUpdatePrice,
assetSymbol
assetSymbol,
priceTrackingEnabled = false,
}: StatsBoxProps) {
const [isDropdownOpen, setIsDropdownOpen] = useState(false);
@ -78,7 +80,7 @@ export default function StatsBox({
<ComponentTitle>Stats</ComponentTitle>
<div className="flex items-center space-x-2 relative">
{stats.currentPrice && (
{priceTrackingEnabled && stats.currentPrice && (
<div className="text-red-500 text-sm font-mono tracking-wider">
{assetSymbol ?? 'PRICE'}: {formatCurrencyDetailed(stats.currentPrice)}
</div>
@ -119,7 +121,7 @@ export default function StatsBox({
ADD MILESTONE
</button>
)}
{onUpdatePrice && (
{priceTrackingEnabled && onUpdatePrice && (
<button
onClick={() => {
onUpdatePrice();
@ -156,8 +158,8 @@ export default function StatsBox({
<tr>
<th className="text-left text-red-500 text-xs py-2">DESCRIPTION</th>
<th className="text-right text-red-500 text-xs py-2">SHARES</th>
<th className="text-right text-red-500 text-xs py-2 pr-4">SWR 3%</th>
<th className="text-right text-red-500 text-xs py-2">SWR 4%</th>
{priceTrackingEnabled && <th className="text-right text-red-500 text-xs py-2 pr-4">SWR 3%</th>}
{priceTrackingEnabled && <th className="text-right text-red-500 text-xs py-2">SWR 4%</th>}
</tr>
</thead>
<tbody>
@ -167,12 +169,16 @@ export default function StatsBox({
<td className="text-right py-1 pr-4">
{Math.floor(stats.totalShares).toLocaleString()}
</td>
{priceTrackingEnabled && (
<td className="text-right py-1 pr-4">
{stats.currentPrice ? formatCurrency(stats.totalShares * stats.currentPrice * 0.03) : 'N/A'}
</td>
)}
{priceTrackingEnabled && (
<td className="text-right py-1">
{stats.currentPrice ? formatCurrency(stats.totalShares * stats.currentPrice * 0.04) : 'N/A'}
</td>
)}
</tr>
{/* Render milestones after current */}
@ -197,12 +203,16 @@ export default function StatsBox({
<td className="text-right py-1 pr-4">
{Math.floor(milestone.target).toLocaleString()}
</td>
{priceTrackingEnabled && (
<td className="text-right py-1 pr-4">
{stats.currentPrice ? formatCurrency(swr3) : 'N/A'}
</td>
)}
{priceTrackingEnabled && (
<td className="text-right py-1">
{stats.currentPrice ? formatCurrency(swr4) : 'N/A'}
</td>
)}
</tr>
);
})}

View file

@ -4,6 +4,44 @@ import AddPurchaseForm from '@/components/Transactions/AddPurchaseForm';
import AddMilestoneForm from '@/components/Milestones/AddMilestoneForm';
import UpdatePriceForm from '@/components/Pricing/UpdatePriceForm';
function PriceTrackingStep({ onEnable, onSkip }: { onEnable: () => void; onSkip?: () => void }) {
const [enabled, setEnabled] = useState(false);
return (
<div className="space-y-6">
<label className="flex items-center gap-3 cursor-pointer group">
<input
type="checkbox"
checked={enabled}
onChange={e => setEnabled(e.target.checked)}
className="w-4 h-4 accent-red-500"
/>
<span className="text-red-400 font-mono text-sm uppercase tracking-wider group-hover:text-red-300">
Enable price tracking (optional)
</span>
</label>
<p className="text-red-400/60 font-mono text-xs">
Track the current market price of your asset to see portfolio value and P&amp;L. You can enable this later in settings.
</p>
{enabled && (
<div className="border border-red-500/30 p-4">
<UpdatePriceForm onSuccess={onEnable} />
</div>
)}
{!enabled && (
<button
onClick={onSkip}
className="w-full py-2 font-mono text-xs uppercase tracking-wider border border-red-500/50 text-red-400 hover:bg-red-950/30 hover:text-red-300 transition-colors"
>
Skip and finish
</button>
)}
</div>
);
}
interface OnboardingStep {
id: string;
title: string;
@ -43,9 +81,9 @@ export default function OnboardingFlow({ onComplete }: OnboardingFlowProps) {
{
id: 'price',
title: 'CURRENT PRICE',
description: 'Set current asset price',
description: 'Set current asset price (optional)',
completed: false,
required: true,
required: false,
},
]);
@ -76,26 +114,23 @@ export default function OnboardingFlow({ onComplete }: OnboardingFlowProps) {
const priceData = await priceResponse.json();
const hasPrice = !!priceData.current_price;
setSteps(prev => prev.map(step => ({
const freshSteps = steps.map(step => ({
...step,
completed:
(step.id === 'asset' && hasAsset) ||
(step.id === 'purchases' && hasPurchases) ||
(step.id === 'milestones' && hasMilestones) ||
(step.id === 'price' && hasPrice)
})));
}));
// Find first incomplete required step
const firstIncompleteStep = steps.findIndex(step =>
step.required && !step.completed
);
setSteps(freshSteps);
if (firstIncompleteStep !== -1) {
setCurrentStep(firstIncompleteStep);
const firstIncompleteRequired = freshSteps.findIndex(s => s.required && !s.completed);
if (firstIncompleteRequired !== -1) {
setCurrentStep(firstIncompleteRequired);
} else {
// All required steps complete, check if we should call onComplete
const allRequiredComplete = steps.filter(s => s.required).every(s => s.completed);
if (allRequiredComplete && onComplete) {
if (onComplete) {
onComplete();
}
}
@ -110,23 +145,8 @@ export default function OnboardingFlow({ onComplete }: OnboardingFlowProps) {
index === currentStep ? { ...step, completed: true } : step
));
// Refresh onboarding status
// Refresh onboarding status — handles setCurrentStep and onComplete
await checkOnboardingStatus();
// Move to next incomplete step or complete onboarding
const nextIncompleteStep = steps.findIndex((step, index) =>
index > currentStep && step.required && !step.completed
);
if (nextIncompleteStep !== -1) {
setCurrentStep(nextIncompleteStep);
} else {
// All required steps complete
const allRequiredComplete = steps.filter(s => s.required).every(s => s.completed);
if (allRequiredComplete && onComplete) {
onComplete();
}
}
};
const handleStepSelect = (stepIndex: number) => {
@ -157,8 +177,9 @@ export default function OnboardingFlow({ onComplete }: OnboardingFlowProps) {
);
case 'price':
return (
<UpdatePriceForm
onSuccess={handleStepComplete}
<PriceTrackingStep
onEnable={handleStepComplete}
onSkip={onComplete}
/>
);
default:
@ -177,7 +198,7 @@ export default function OnboardingFlow({ onComplete }: OnboardingFlowProps) {
[SYSTEM] ONBOARDING SEQUENCE
</h1>
<p className="text-red-400/60 font-mono text-sm">
Initialize your asset tracking system
Set up your tracker
</p>
</div>

View file

@ -42,6 +42,7 @@ export default function Dashboard() {
const [loading, setLoading] = useState(true);
const [needsOnboarding, setNeedsOnboarding] = useState(false);
const [currentAsset, setCurrentAsset] = useState<any>(null);
const [priceTrackingEnabled, setPriceTrackingEnabled] = useState(false);
// Fetch purchase summary, current price, milestones, and check onboarding
useEffect(() => {
@ -72,6 +73,7 @@ export default function Dashboard() {
if (assetResponse.ok) {
const assetData = await assetResponse.json();
setCurrentAsset(assetData.asset);
setPriceTrackingEnabled(assetData.price_tracking_enabled ?? false);
}
// Check if onboarding is needed after all data is loaded
@ -238,6 +240,7 @@ export default function Dashboard() {
if (assetResponse.ok) {
const assetData = await assetResponse.json();
setCurrentAsset(assetData.asset);
setPriceTrackingEnabled(assetData.price_tracking_enabled ?? false);
}
};
@ -287,6 +290,7 @@ export default function Dashboard() {
onAddMilestone={() => setActiveForm('milestone')}
onUpdatePrice={() => setActiveForm('price')}
assetSymbol={currentAsset?.symbol}
priceTrackingEnabled={priceTrackingEnabled}
/>
</div>

View file

@ -60,9 +60,9 @@ pkgs.mkShell {
}
dev-rebuild() {
echo "Rebuilding services (down -v + up)..."
echo "Rebuilding services (down -v + up --build)..."
podman-compose -f $COMPOSE_FILE down -v
PODMAN_USERNS=keep-id podman-compose -f $COMPOSE_FILE up -d "$@"
PODMAN_USERNS=keep-id podman-compose -f $COMPOSE_FILE up -d --build "$@"
echo ""
podman-compose -f $COMPOSE_FILE ps
echo ""

View file

@ -5,6 +5,18 @@ import { resolve } from 'node:path';
import { defineConfig } from 'vite';
export default defineConfig({
server: {
host: '0.0.0.0',
port: 5173,
hmr: {
host: 'localhost',
clientPort: 5173,
},
watch: {
usePolling: true,
ignored: ['**/storage/framework/views/**'],
},
},
plugins: [
laravel({
input: ['resources/css/app.css', 'resources/js/app.tsx'],