Krow/Krow-workspace
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Initialize monorepo structure and comprehensive documentation

Browse Source 
This commit establishes the new monorepo architecture for the KROW Workforce platform.

Key changes include:
- Reorganized project into `frontend-web`, `mobile-apps`, `firebase`, `scripts`, and `secrets` directories.
- Updated `Makefile` to support the new monorepo layout and automate Base44 export integration.
- Fixed `scripts/prepare-export.js` for ES module compatibility and global component import resolution.
- Created and updated `CONTRIBUTING.md` for developer onboarding.
- Restructured, renamed, and translated all `docs/` files for clarity and consistency.
- Implemented an interactive internal launchpad with diagram viewing capabilities.
- Configured base Firebase project files (`firebase.json`, security rules).
- Updated `README.md` to reflect the new project structure and documentation overview.
This commit is contained in:
bwnyasse
2025-11-12 12:50:55 -05:00
parent 92fd0118be
commit 554dc9f9e3
203 changed files with 1414 additions and 732 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
frontend-web/src/components/events/EventsTable.jsx Normal file
View File

@@ -0,0 +1,136 @@
import React from "react";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Eye, MoreVertical, Users } from "lucide-react";
import { format } from "date-fns";
import { useNavigate } from "react-router-dom";
import { createPageUrl } from "@/utils";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import {
HoverCard,
HoverCardContent,
HoverCardTrigger,
} from "@/components/ui/hover-card";
const statusColors = {
Active: "bg-blue-100 text-blue-800 border-blue-200",
Pending: "bg-yellow-100 text-yellow-800 border-yellow-200",
Confirmed: "bg-purple-100 text-purple-800 border-purple-200",
Completed: "bg-green-100 text-green-800 border-green-200",
Canceled: "bg-red-100 text-red-800 border-red-200"
};
export default function EventsTable({ events }) {
const navigate = useNavigate();
return (
<div className="bg-white rounded-xl border border-slate-200 shadow-sm overflow-hidden">
<Table>
<TableHeader>
<TableRow className="bg-slate-50">
<TableHead className="font-semibold">ID</TableHead>
<TableHead className="font-semibold">Hub</TableHead>
<TableHead className="font-semibold">Status</TableHead>
<TableHead className="font-semibold">Date</TableHead>
<TableHead className="font-semibold">Event Name</TableHead>
<TableHead className="font-semibold">PO</TableHead>
<TableHead className="font-semibold text-center">Requested</TableHead>
<TableHead className="font-semibold text-center">Assigned</TableHead>
<TableHead className="font-semibold">Total</TableHead>
<TableHead className="font-semibold text-center">Actions</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{events.length > 0 ? (
events.map((event) => (
<TableRow key={event.id} className="hover:bg-slate-50 transition-colors">
<TableCell className="font-medium">{event.id?.slice(0, 8)}</TableCell>
<TableCell>
<div>
<p className="font-medium text-slate-900">{event.hub}</p>
{event.event_location && (
<p className="text-xs text-slate-500 truncate max-w-xs">{event.event_location}</p>
)}
</div>
</TableCell>
<TableCell>
<Badge className={`${statusColors[event.status]} border font-medium`}>
{event.status}
</Badge>
</TableCell>
<TableCell>
{event.date ? format(new Date(event.date), "MMM d, yyyy") : "-"}
</TableCell>
<TableCell className="font-medium">{event.event_name}</TableCell>
<TableCell>{event.po || "-"}</TableCell>
<TableCell className="text-center">{event.requested || 0}</TableCell>
<TableCell className="text-center">
{event.assigned_staff && event.assigned_staff.length > 0 ? (
<HoverCard>
<HoverCardTrigger asChild>
<button className="inline-flex items-center gap-1 text-blue-600 hover:text-blue-800 font-medium">
<Users className="w-4 h-4" />
{event.assigned_staff.length}
</button>
</HoverCardTrigger>
<HoverCardContent className="w-80">
<div className="space-y-2">
<h4 className="font-semibold text-sm">Assigned Staff:</h4>
<div className="space-y-2">
{event.assigned_staff.map((staff, idx) => (
<div key={idx} className="flex items-center gap-2 text-sm">
<div className="w-6 h-6 bg-blue-500 rounded-full flex items-center justify-center text-white text-xs font-bold">
{staff.staff_name?.charAt(0)}
</div>
<div>
<p className="font-medium">{staff.staff_name}</p>
{staff.position && (
<p className="text-xs text-slate-500">{staff.position}</p>
)}
</div>
</div>
))}
</div>
</div>
</HoverCardContent>
</HoverCard>
) : (
<span className="text-slate-400">0</span>
)}
</TableCell>
<TableCell className="font-semibold">${event.total?.toFixed(2) || "0.00"}</TableCell>
<TableCell>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon">
<MoreVertical className="w-4 h-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => navigate(createPageUrl(`EditEvent?id=${event.id}`))}>
<Eye className="w-4 h-4 mr-2" />
View Details
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
))
) : (
<TableRow>
<TableCell colSpan={10} className="text-center py-8 text-slate-500">
No events found
</TableCell>
</TableRow>
)}
</TableBody>
</Table>
</div>
);
}