fix(deploy): tag rollback images before pull, prune after smoke test
Previously, `docker image prune` ran immediately after deploying new containers, potentially deleting the old images needed for rollback if smoke tests subsequently failed. Now the deploy pipeline: 1. Tags current images as :rollback before pulling new versions 2. Only runs `docker image prune` after smoke tests pass 3. Uses explicit :rollback tags for rollback instead of relying on Docker layer cache (which is fragile) Applied to: - scripts/deploy-production.sh (manual deploy script) - .github/workflows/deploy.yml (staging + production CI jobs) - docs/deployment.md (updated rollback documentation) Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
Ho Ngoc Hai
217
apps/web/components/listings/inquiry-modal.tsx
Normal file
217
apps/web/components/listings/inquiry-modal.tsx
Normal file
@@ -0,0 +1,217 @@
|
||||
'use client';
|
||||
|
||||
import * as React from 'react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from '@/components/ui/dialog';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { ApiError } from '@/lib/api-client';
|
||||
import { useAuthStore } from '@/lib/auth-store';
|
||||
import { useCreateInquiry } from '@/lib/hooks/use-inquiries';
|
||||
|
||||
interface InquiryModalProps {
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
listingId: string;
|
||||
listingTitle: string;
|
||||
sellerName: string;
|
||||
}
|
||||
|
||||
export function InquiryModal({
|
||||
open,
|
||||
onOpenChange,
|
||||
listingId,
|
||||
listingTitle,
|
||||
sellerName,
|
||||
}: InquiryModalProps) {
|
||||
const { user, isAuthenticated } = useAuthStore();
|
||||
const createInquiry = useCreateInquiry();
|
||||
|
||||
const [message, setMessage] = React.useState('');
|
||||
const [phone, setPhone] = React.useState('');
|
||||
const [error, setError] = React.useState<string | null>(null);
|
||||
const [success, setSuccess] = React.useState(false);
|
||||
|
||||
// Pre-fill phone from auth store when modal opens
|
||||
React.useEffect(() => {
|
||||
if (open && user?.phone) {
|
||||
setPhone(user.phone);
|
||||
}
|
||||
if (open) {
|
||||
setError(null);
|
||||
setSuccess(false);
|
||||
setMessage('');
|
||||
}
|
||||
}, [open, user?.phone]);
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (!isAuthenticated) {
|
||||
window.location.href = '/login';
|
||||
onOpenChange(false);
|
||||
return;
|
||||
}
|
||||
|
||||
const trimmedMessage = message.trim();
|
||||
const trimmedPhone = phone.trim();
|
||||
|
||||
if (!trimmedMessage) {
|
||||
setError('Vui long nhap noi dung tin nhan');
|
||||
return;
|
||||
}
|
||||
if (!trimmedPhone || trimmedPhone.length < 9) {
|
||||
setError('Vui long nhap so dien thoai hop le');
|
||||
return;
|
||||
}
|
||||
|
||||
setError(null);
|
||||
|
||||
try {
|
||||
await createInquiry.mutateAsync({
|
||||
listingId,
|
||||
message: trimmedMessage,
|
||||
phone: trimmedPhone,
|
||||
});
|
||||
setSuccess(true);
|
||||
} catch (err) {
|
||||
if (err instanceof ApiError && err.status === 401) {
|
||||
window.location.href = '/login';
|
||||
onOpenChange(false);
|
||||
return;
|
||||
}
|
||||
setError(
|
||||
err instanceof ApiError
|
||||
? err.message
|
||||
: 'Gui tin nhan that bai. Vui long thu lai.',
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
if (success) {
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Da gui thanh cong!</DialogTitle>
|
||||
<DialogDescription>
|
||||
Tin nhan cua ban da duoc gui den {sellerName}. Ho se lien he voi ban som nhat co the.
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className="flex justify-center py-4">
|
||||
<svg
|
||||
className="h-16 w-16 text-green-500"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button onClick={() => onOpenChange(false)}>Dong</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Nhan tin cho nguoi ban</DialogTitle>
|
||||
<DialogDescription>
|
||||
Gui tin nhan ve tin dang “{listingTitle}”
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
{error && (
|
||||
<div className="rounded-md bg-destructive/10 px-3 py-2 text-sm text-destructive">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="inquiry-message">Noi dung tin nhan</Label>
|
||||
<Textarea
|
||||
id="inquiry-message"
|
||||
placeholder="Toi quan tam den bat dong san nay. Vui long lien he voi toi..."
|
||||
value={message}
|
||||
onChange={(e) => setMessage(e.target.value)}
|
||||
rows={4}
|
||||
required
|
||||
disabled={createInquiry.isPending}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="inquiry-phone">So dien thoai</Label>
|
||||
<Input
|
||||
id="inquiry-phone"
|
||||
type="tel"
|
||||
placeholder="0912345678"
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
required
|
||||
disabled={createInquiry.isPending}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<DialogFooter>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
disabled={createInquiry.isPending}
|
||||
>
|
||||
Huy
|
||||
</Button>
|
||||
<Button type="submit" disabled={createInquiry.isPending}>
|
||||
{createInquiry.isPending ? (
|
||||
<span className="flex items-center gap-2">
|
||||
<svg
|
||||
className="h-4 w-4 animate-spin"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
className="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
strokeWidth="4"
|
||||
/>
|
||||
<path
|
||||
className="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"
|
||||
/>
|
||||
</svg>
|
||||
Dang gui...
|
||||
</span>
|
||||
) : (
|
||||
'Gui tin nhan'
|
||||
)}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user