Merge branch 'feature/security-hardening' into main

Author: pritpatel2412

client/src/components/app-sidebar.tsx

@@ -15,6 +15,8 @@ import {
   Search,
   ShoppingCart,
   Download,
+  CreditCard,
+  Megaphone,
 } from "lucide-react";
 import {
   Sidebar,
@@ -61,6 +63,11 @@ const navItems = [
     url: "/audit",
     icon: ShieldCheck,
   },
+  {
+    title: "Pricing Plans",
+    url: "/pricing",
+    icon: CreditCard,
+  },
   {
     title: "Settings",
     url: "/settings",
@@ -77,28 +84,33 @@ const adminNavItems = [
   {
     title: "Orders",
     url: "/admin/orders",
-    icon: ShoppingCart, // Assuming ShoppingCart icon is imported, let's check
+    icon: ShoppingCart,
   },
   {
     title: "Users",
     url: "/admin/users",
-    icon: ShieldCheck, // or another appropriate icon
+    icon: ShieldCheck,
   },
   {
     title: "Live Requests",
     url: "/admin/requests",
-    icon: Activity, // need to import
+    icon: Activity,
   },
   {
     title: "System Health",
     url: "/admin/system",
-    icon: Server, // need to import
+    icon: Server,
   },
   {
     title: "Free Audit Queue",
     url: "/admin/free-audit-queue",
     icon: ShieldCheck,
   },
+  {
+    title: "Free Audit Campaign",
+    url: "/free-audit-request",
+    icon: Megaphone,
+  },
   {
     title: "Audit Log",
     url: "/admin/audit-log",

client/src/pages/admin/overview.tsx

@@ -84,6 +84,37 @@ export default function AdminOverview() {
         </Card>
       </div>
 
+      <h2 className="text-xl font-bold mt-8 mb-4">Post-Audit Feedback</h2>
+      <div className="grid gap-4 md:grid-cols-3">
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Feedback Responses</CardTitle>
+            <Activity className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{metrics?.feedback?.count || 0}</div>
+          </CardContent>
+        </Card>
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Avg Accuracy Rating</CardTitle>
+            <ShieldCheck className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{metrics?.feedback?.avgAccuracy || "0.0"} <span className="text-sm font-normal text-muted-foreground">/ 5</span></div>
+          </CardContent>
+        </Card>
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Avg Value Rating</CardTitle>
+            <DollarSign className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{metrics?.feedback?.avgValue || "0.0"} <span className="text-sm font-normal text-muted-foreground">/ 5</span></div>
+          </CardContent>
+        </Card>
+      </div>
+
       <div className="grid gap-4 md:grid-cols-2">
         <Card className="col-span-1">
           <CardHeader>

client/src/pages/audit.tsx

@@ -10,13 +10,22 @@ import { apiRequest } from "@/lib/queryClient";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
 import { LineChart, Line, ResponsiveContainer } from "recharts";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from "@/components/ui/dialog";
+import { Textarea } from "@/components/ui/textarea";
 
 export default function AuditPage() {
   const [selectedRepoId, setSelectedRepoId] = useState("");
   const [branch, setBranch] = useState("");
   const [currentAuditId, setCurrentAuditId] = useState<string | null>(null);
   const [logs, setLogs] = useState<{log: string, progress: number, timestamp: string}[]>([]);
   const [progress, setProgress] = useState(0);
+  
+  // Feedback Modal State
+  const [showFeedbackModal, setShowFeedbackModal] = useState(false);
+  const [feedbackRating, setFeedbackRating] = useState<number | null>(null);
+  const [valueRating, setValueRating] = useState<number | null>(null);
+  const [feedbackText, setFeedbackText] = useState("");
+
   const { toast } = useToast();
   const queryClient = useQueryClient();
 
@@ -160,6 +169,45 @@ export default function AuditPage() {
     enabled: !!currentAuditId && audit?.status === "complete",
   });
 
+  const { data: feedbackData } = useQuery<any>({
+    queryKey: ["/api/audits", currentAuditId, "feedback"],
+    enabled: !!currentAuditId && audit?.status === "complete",
+  });
+
+  const showFeedbackMutation = useMutation({
+    mutationFn: async () => {
+      const res = await apiRequest("POST", `/api/audits/${currentAuditId}/feedback/show`);
+      return res.json();
+    }
+  });
+
+  const submitFeedbackMutation = useMutation({
+    mutationFn: async (data: { responses: any, freeText: string }) => {
+      const res = await apiRequest("POST", `/api/audits/${currentAuditId}/feedback/submit`, data);
+      return res.json();
+    },
+    onSuccess: () => {
+      toast({
+        title: "Feedback Submitted",
+        description: "Thank you for helping us improve CodeGuard!",
+      });
+      setShowFeedbackModal(false);
+      queryClient.invalidateQueries({ queryKey: ["/api/audits", currentAuditId, "feedback"] });
+    }
+  });
+
+  const handleDownloadPdf = () => {
+    window.open(`/api/audits/${currentAuditId}/pdf`, '_blank');
+    
+    // Wait a brief moment then show feedback prompt if they haven't responded yet
+    setTimeout(() => {
+      if (!feedbackData?.respondedAt) {
+        showFeedbackMutation.mutate();
+        setShowFeedbackModal(true);
+      }
+    }, 1500);
+  };
+
   const createOrderMutation = useMutation({
     mutationFn: async () => {
       const res = await apiRequest("POST", "/api/orders", { 
@@ -332,7 +380,7 @@ export default function AuditPage() {
                               <Download className="mr-2 h-4 w-4" />
                               JSON
                             </Button>
-                            <Button variant="outline" size="sm" onClick={() => window.open(`/api/audits/${currentAuditId}/pdf`, '_blank')}>
+                            <Button variant="outline" size="sm" onClick={handleDownloadPdf}>
                               <FileText className="mr-2 h-4 w-4" />
                               PDF
                             </Button>
@@ -457,6 +505,80 @@ export default function AuditPage() {
           </CardContent>
         </Card>
       )}
+
+      {/* Post-Download Feedback Modal */}
+      <Dialog open={showFeedbackModal} onOpenChange={setShowFeedbackModal}>
+        <DialogContent className="sm:max-w-[425px]">
+          <DialogHeader>
+            <DialogTitle>Quick Feedback</DialogTitle>
+            <DialogDescription>
+              We're constantly improving our ASVS 5.0 audit engine. How did we do on this report?
+            </DialogDescription>
+          </DialogHeader>
+          <div className="grid gap-6 py-4">
+            <div className="space-y-3">
+              <Label>How accurate were the security findings?</Label>
+              <div className="flex justify-between items-center">
+                <span className="text-xs text-muted-foreground">Poor</span>
+                {[1, 2, 3, 4, 5].map((val) => (
+                  <Button
+                    key={val}
+                    variant={feedbackRating === val ? "default" : "outline"}
+                    className="w-10 h-10 rounded-full p-0"
+                    onClick={() => setFeedbackRating(val)}
+                  >
+                    {val}
+                  </Button>
+                ))}
+                <span className="text-xs text-muted-foreground">Excellent</span>
+              </div>
+            </div>
+
+            <div className="space-y-3">
+              <Label>Would you pay for this level of automated audit?</Label>
+              <div className="flex justify-between items-center">
+                <span className="text-xs text-muted-foreground">No</span>
+                {[1, 2, 3, 4, 5].map((val) => (
+                  <Button
+                    key={`val-${val}`}
+                    variant={valueRating === val ? "default" : "outline"}
+                    className="w-10 h-10 rounded-full p-0"
+                    onClick={() => setValueRating(val)}
+                  >
+                    {val}
+                  </Button>
+                ))}
+                <span className="text-xs text-muted-foreground">Definitely</span>
+              </div>
+            </div>
+
+            <div className="space-y-2">
+              <Label htmlFor="feedback">Any additional comments? (Optional)</Label>
+              <Textarea
+                id="feedback"
+                placeholder="What was missing? What was helpful?"
+                value={feedbackText}
+                onChange={(e) => setFeedbackText(e.target.value)}
+              />
+            </div>
+          </div>
+          <DialogFooter>
+            <Button variant="ghost" onClick={() => setShowFeedbackModal(false)}>Skip</Button>
+            <Button 
+              onClick={() => {
+                submitFeedbackMutation.mutate({
+                  responses: { accuracy: feedbackRating, willingnessToPay: valueRating },
+                  freeText: feedbackText
+                });
+              }}
+              disabled={!feedbackRating || submitFeedbackMutation.isPending}
+            >
+              {submitFeedbackMutation.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+              Submit Feedback
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
     </div>
   );
 }