+
+ Filter by :
+ {[1, 2, 3].map((item) => {
+ return (
+
+
+
+
+
+ Fruits
+ Apple
+ Banana
+ Blueberry
+
+
+
+ );
+ })}
+
+
+
+
{standard}
+
+ Add batch
+
+
+
+ {/*
*/}
+ {batches.map((batch, index) => (
+
+
+ );
+};
+
+export default StandardCard;
diff --git a/src/app/(root)/(dashboard)/batches/page.tsx b/src/app/(root)/(dashboard)/batches/page.tsx
new file mode 100644
index 0000000..a26a915
--- /dev/null
+++ b/src/app/(root)/(dashboard)/batches/page.tsx
@@ -0,0 +1,49 @@
+import { BatchGroup } from "@/types/batch";
+import FilterBatches from "./_components/FilterBatches";
+import StandardCard from "./_components/StandardCard";
+import Head from "next/head";
+
+async function getBatches(): Promise
{
+ const res = await fetch("http://localhost:3000/api/batches", {
+ cache: "no-store",
+ });
+
+ if (!res.ok) {
+ throw new Error("Failed to fetch batch data");
+ }
+
+ return res.json();
+}
+
+const BatchesPage = async () => {
+ const batches = await getBatches();
+
+ return (
+ <>
+
+ Student Batches - Institute Name
+
+
+ Student Batches of Institute
+
+
+
+
+ );
+};
+
+export default BatchesPage;
diff --git a/src/app/(root)/(dashboard)/page.tsx b/src/app/(root)/(dashboard)/page.tsx
index 75a3155..09e3fa8 100644
--- a/src/app/(root)/(dashboard)/page.tsx
+++ b/src/app/(root)/(dashboard)/page.tsx
@@ -1,7 +1,44 @@
-import Image from "next/image";
+import { Button } from "@/components/ui/button";
+import StudentsOverview from "./_components/StudentsOverview";
+import TeachersOverview from "./_components/TeachersOverview";
+import { Pencil } from "lucide-react";
+import InstituteCard from "./_components/InstituteCard";
export default function Home() {
return (
- <>Home
+
+
+
+ Institute Overview & Management
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default Loader;
diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx
new file mode 100644
index 0000000..e87d62b
--- /dev/null
+++ b/src/components/ui/badge.tsx
@@ -0,0 +1,36 @@
+import * as React from "react"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const badgeVariants = cva(
+ "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+ {
+ variants: {
+ variant: {
+ default:
+ "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+ secondary:
+ "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+ destructive:
+ "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
+ outline: "text-foreground",
+ },
+ },
+ defaultVariants: {
+ variant: "default",
+ },
+ }
+)
+
+export interface BadgeProps
+ extends React.HTMLAttributes,
+ VariantProps {}
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+ return (
+
+ )
+}
+
+export { Badge, badgeVariants }
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
new file mode 100644
index 0000000..65d4fcd
--- /dev/null
+++ b/src/components/ui/button.tsx
@@ -0,0 +1,57 @@
+import * as React from "react"
+import { Slot } from "@radix-ui/react-slot"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "@/lib/utils"
+
+const buttonVariants = cva(
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+ {
+ variants: {
+ variant: {
+ default:
+ "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+ destructive:
+ "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+ outline:
+ "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+ secondary:
+ "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+ ghost: "hover:bg-accent hover:text-accent-foreground",
+ link: "text-primary underline-offset-4 hover:underline",
+ },
+ size: {
+ default: "h-9 px-4 py-2",
+ sm: "h-8 rounded-md px-3 text-xs",
+ lg: "h-10 rounded-md px-8",
+ icon: "h-9 w-9",
+ },
+ },
+ defaultVariants: {
+ variant: "default",
+ size: "default",
+ },
+ }
+)
+
+export interface ButtonProps
+ extends React.ButtonHTMLAttributes,
+ VariantProps {
+ asChild?: boolean
+}
+
+const Button = React.forwardRef(
+ ({ className, variant, size, asChild = false, ...props }, ref) => {
+ const Comp = asChild ? Slot : "button"
+ return (
+
+>(({ className, ...props }, ref) => (
+
+))
+Card.displayName = "Card"
+
+const CardHeader = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+))
+CardHeader.displayName = "CardHeader"
+
+const CardTitle = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+))
+CardTitle.displayName = "CardTitle"
+
+const CardDescription = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+))
+CardDescription.displayName = "CardDescription"
+
+const CardContent = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+))
+CardContent.displayName = "CardContent"
+
+const CardFooter = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+>(({ className, ...props }, ref) => (
+
+))
+CardFooter.displayName = "CardFooter"
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
new file mode 100644
index 0000000..69b64fb
--- /dev/null
+++ b/src/components/ui/input.tsx
@@ -0,0 +1,22 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+const Input = React.forwardRef>(
+ ({ className, type, ...props }, ref) => {
+ return (
+ {
+ indicatorColor?: string;
+}
+
+const Progress = React.forwardRef<
+ React.ElementRef,
+ CustomProgressProps
+>(({ className, value, indicatorColor, ...props }, ref) => (
+
+
+));
+
+Progress.displayName = ProgressPrimitive.Root.displayName;
+
+export { Progress };
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
new file mode 100644
index 0000000..cd3c745
--- /dev/null
+++ b/src/components/ui/select.tsx
@@ -0,0 +1,159 @@
+"use client"
+
+import * as React from "react"
+import * as SelectPrimitive from "@radix-ui/react-select"
+import { Check, ChevronDown, ChevronUp } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const Select = SelectPrimitive.Root
+
+const SelectGroup = SelectPrimitive.Group
+
+const SelectValue = SelectPrimitive.Value
+
+const SelectTrigger = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, children, ...props }, ref) => (
+ span]:line-clamp-1",
+ className
+ )}
+ {...props}
+ >
+ {children}
+
+
+
+))
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
+
+const SelectScrollUpButton = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+
+))
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
+
+const SelectScrollDownButton = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+
+))
+SelectScrollDownButton.displayName =
+ SelectPrimitive.ScrollDownButton.displayName
+
+const SelectContent = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, children, position = "popper", ...props }, ref) => (
+
+
+
+ {children}
+
+
+
+))
+SelectContent.displayName = SelectPrimitive.Content.displayName
+
+const SelectLabel = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+ ,
+ React.ComponentPropsWithoutRef
+>(({ className, children, ...props }, ref) => (
+
+
+
+
+
+ {children}
+
+))
+SelectItem.displayName = SelectPrimitive.Item.displayName
+
+const SelectSeparator = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+ ([]);
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState(null);
+
+ useEffect(() => {
+ if (!id) return;
+
+ const fetchData = async () => {
+ setLoading(true);
+ try {
+ const response = await apiClient.get(`/batches/${id}`);
+ console.log("response", response.data);
+ setData(response.data);
+
+ return response.data;
+ } catch (err) {
+ setError(err);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ fetchData();
+ }, [id]);
+
+ return { data, loading, error };
+};
+
+export default useFetchStudentsOfBatch;
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
new file mode 100644
index 0000000..bd0c391
--- /dev/null
+++ b/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+ return twMerge(clsx(inputs))
+}
diff --git a/src/types/batch.ts b/src/types/batch.ts
new file mode 100644
index 0000000..1b87353
--- /dev/null
+++ b/src/types/batch.ts
@@ -0,0 +1,14 @@
+export interface Batch {
+ standard: string;
+ className: string;
+ status: "active" | "inactive";
+ subjects: string[];
+ totalStudents: number;
+ maxCapacity: number;
+ instructor: string;
+}
+
+export interface BatchGroup {
+ standard: string;
+ batch: Batch[];
+}
diff --git a/src/types/student.ts b/src/types/student.ts
new file mode 100644
index 0000000..82fcfed
--- /dev/null
+++ b/src/types/student.ts
@@ -0,0 +1,6 @@
+export interface Student {
+ name: string;
+ class: number;
+ level: number;
+ status: "excellent" | "optimal" | "inefficient";
+}
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 2873606..3cb74f6 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -11,111 +11,143 @@ const config = {
],
prefix: '',
theme: {
- container: {
- center: true,
- padding: '2rem',
- screens: {
- '2xl': '1400px',
- },
- },
- extend: {
- screens: {
- '2xl': '1400px',
- },
- fontFamily: {
- sans: ['var(--font-sans)', ...fontFamily.sans],
- },
- colors: {
- border: 'hsl(var(--border))',
- input: 'hsl(var(--input))',
- ring: 'hsl(var(--ring))',
- background: 'hsl(var(--background))',
- foreground: 'hsl(var(--foreground))',
- 'sidebar-background': 'hsla(262, 86%, 46%, 0.03)',
- primary: {
- DEFAULT: 'hsl(var(--primary))',
- foreground: 'hsl(var(--primary-foreground))',
- },
- secondary: {
- DEFAULT: 'hsl(var(--secondary))',
- foreground: 'hsl(var(--secondary-foreground))',
- },
- destructive: {
- DEFAULT: 'hsl(var(--destructive))',
- foreground: 'hsl(var(--destructive-foreground))',
- },
- muted: {
- DEFAULT: 'hsl(var(--muted))',
- foreground: 'hsl(var(--muted-foreground))',
- },
- accent: {
- DEFAULT: 'hsl(var(--accent))',
- foreground: 'hsl(var(--accent-foreground))',
- },
- popover: {
- DEFAULT: 'hsl(var(--popover))',
- foreground: 'hsl(var(--popover-foreground))',
- },
- card: {
- DEFAULT: 'hsl(var(--card))',
- foreground: 'hsl(var(--card-foreground))',
- },
- },
- borderRadius: {
- lg: 'var(--radius)',
- md: 'calc(var(--radius) - 2px)',
- sm: 'calc(var(--radius) - 4px)',
- },
- keyframes: {
- 'accordion-down': {
- from: { height: '0' },
- to: { height: 'var(--radix-accordion-content-height)' },
- },
- 'accordion-up': {
- from: { height: 'var(--radix-accordion-content-height)' },
- to: { height: '0' },
- },
- 'collapsible-down': {
- from: { height: '0' },
- to: { height: 'var(--radix-collapsible-content-height)' },
- },
- 'collapsible-up': {
- from: { height: 'var(--radix-collapsible-content-height)' },
- to: { height: '0' },
- },
- 'caret-blink': {
- '0%,70%,100%': { opacity: '1' },
- '20%,50%': { opacity: '0' },
- },
- },
- animation: {
- 'accordion-down': 'accordion-down 0.2s ease-out',
- 'accordion-up': 'accordion-up 0.2s ease-out',
- 'collapsible-down': 'collapsible-down 0.2s ease-out',
- 'collapsible-up': 'collapsible-up 0.2s ease-out',
- 'caret-blink': 'caret-blink 1.25s ease-out infinite',
- },
- fontSize: {
- 'page-title': ['40px', '52px'],
- },
- width: {
- sidebar: '261px',
- },
- height: {
- 'main-height': 'calc(100dvh - 24px)',
- },
- boxShadow: {
- custom: '0px 17px 37px 0px rgba(165, 92, 255, 0.0)',
- dialog: '0 0 21.5px 2px rgba(0, 0, 0, 0.29)',
- tracker_subject_overview:
- '2px 1px 10.5px 0 rgba(151, 83, 245, 0.18), inset 0 0 32px -7px rgba(151, 83, 245, 0.18)',
- question: ' 0px 0px 26.7px -10px #00000033',
- 'custom-back': 'inset 1.68px 3.37px 5.31px 0 rgba(0, 0, 0, 0.1)',
- 'section':' 0px 1px 24.8px -9px #00000038',
- 'card':'0px 1.15px 21.31px 0px #FF990012'
- },
- },
- },
+ container: {
+ center: true,
+ padding: '2rem',
+ screens: {
+ '2xl': '1400px'
+ }
+ },
+ extend: {
+ screens: {
+ '2xl': '1400px'
+ },
+ fontFamily: {
+ sans: [
+ 'var(--font-sans)',
+ ...fontFamily.sans
+ ]
+ },
+ colors: {
+ border: 'hsl(var(--border))',
+ input: 'hsl(var(--input))',
+ ring: 'hsl(var(--ring))',
+ background: 'hsl(var(--background))',
+ foreground: 'hsl(var(--foreground))',
+ 'sidebar-background': 'hsla(262, 86%, 46%, 0.03)',
+ primary: {
+ DEFAULT: 'hsl(var(--primary))',
+ foreground: 'hsl(var(--primary-foreground))'
+ },
+ secondary: {
+ DEFAULT: 'hsl(var(--secondary))',
+ foreground: 'hsl(var(--secondary-foreground))'
+ },
+ destructive: {
+ DEFAULT: 'hsl(var(--destructive))',
+ foreground: 'hsl(var(--destructive-foreground))'
+ },
+ muted: {
+ DEFAULT: 'hsl(var(--muted))',
+ foreground: 'hsl(var(--muted-foreground))'
+ },
+ accent: {
+ DEFAULT: 'hsl(var(--accent))',
+ foreground: 'hsl(var(--accent-foreground))'
+ },
+ popover: {
+ DEFAULT: 'hsl(var(--popover))',
+ foreground: 'hsl(var(--popover-foreground))'
+ },
+ card: {
+ DEFAULT: 'hsl(var(--card))',
+ foreground: 'hsl(var(--card-foreground))'
+ },
+ chart: {
+ '1': 'hsl(var(--chart-1))',
+ '2': 'hsl(var(--chart-2))',
+ '3': 'hsl(var(--chart-3))',
+ '4': 'hsl(var(--chart-4))',
+ '5': 'hsl(var(--chart-5))'
+ }
+ },
+ borderRadius: {
+ lg: 'var(--radius)',
+ md: 'calc(var(--radius) - 2px)',
+ sm: 'calc(var(--radius) - 4px)'
+ },
+ keyframes: {
+ 'accordion-down': {
+ from: {
+ height: '0'
+ },
+ to: {
+ height: 'var(--radix-accordion-content-height)'
+ }
+ },
+ 'accordion-up': {
+ from: {
+ height: 'var(--radix-accordion-content-height)'
+ },
+ to: {
+ height: '0'
+ }
+ },
+ 'collapsible-down': {
+ from: {
+ height: '0'
+ },
+ to: {
+ height: 'var(--radix-collapsible-content-height)'
+ }
+ },
+ 'collapsible-up': {
+ from: {
+ height: 'var(--radix-collapsible-content-height)'
+ },
+ to: {
+ height: '0'
+ }
+ },
+ 'caret-blink': {
+ '0%,70%,100%': {
+ opacity: '1'
+ },
+ '20%,50%': {
+ opacity: '0'
+ }
+ }
+ },
+ animation: {
+ 'accordion-down': 'accordion-down 0.2s ease-out',
+ 'accordion-up': 'accordion-up 0.2s ease-out',
+ 'collapsible-down': 'collapsible-down 0.2s ease-out',
+ 'collapsible-up': 'collapsible-up 0.2s ease-out',
+ 'caret-blink': 'caret-blink 1.25s ease-out infinite'
+ },
+ fontSize: {
+ 'page-title': [
+ '40px',
+ '52px'
+ ]
+ },
+ width: {
+ sidebar: '261px'
+ },
+ height: {
+ 'main-height': 'calc(100dvh - 24px)'
+ },
+ boxShadow: {
+ custom: '0px 17px 37px 0px rgba(165, 92, 255, 0.0)',
+ dialog: '0 0 21.5px 2px rgba(0, 0, 0, 0.29)',
+ tracker_subject_overview: '2px 1px 10.5px 0 rgba(151, 83, 245, 0.18), inset 0 0 32px -7px rgba(151, 83, 245, 0.18)',
+ question: ' 0px 0px 26.7px -10px #00000033',
+ 'custom-back': 'inset 1.68px 3.37px 5.31px 0 rgba(0, 0, 0, 0.1)',
+ section: ' 0px 1px 24.8px -9px #00000038',
+ card: '0px 1.15px 21.31px 0px #FF990012'
+ }
+ }
+ },
plugins: [require('tailwindcss-animate')],
} satisfies Config;
+ 
+ 
+