diff --git a/src/components/detailPage/index.tsx b/src/components/detailPage/index.tsx
index a9855ed..2d31596 100644
--- a/src/components/detailPage/index.tsx
+++ b/src/components/detailPage/index.tsx
@@ -222,7 +222,7 @@ const DetailModal: React.FC{errors.files.message as string}
} @@ -265,7 +276,7 @@ export default function CustomerForm({ type="button" className="flex-1" onClick={() => { - reset(getInitialValues()) + reset(getInitialValues(userData)) onCancel() }} > @@ -280,11 +291,11 @@ export default function CustomerForm({ } function FieldBlock({ - name, - label, - children, - error, -}: { + name, + label, + children, + error, + }: { name: string label: string children: React.ReactNode diff --git a/src/feature/dashboard/components/PipelineCard.tsx b/src/feature/dashboard/components/PipelineCard.tsx index cf1cd4e..229b7f7 100644 --- a/src/feature/dashboard/components/PipelineCard.tsx +++ b/src/feature/dashboard/components/PipelineCard.tsx @@ -1,9 +1,9 @@ "use client" -import React, { useEffect, useState } from "react" -import { useRouter } from "next/navigation" +import React, {useEffect, useState} from "react" +import {useRouter} from "next/navigation" import Loading from "@/components/ui/Loading" -import type { PipelineChartData } from "../types/Types" +import type {PipelineChartData} from "../types/Types" const CHART_HEIGHT = 236 @@ -39,11 +39,11 @@ export function PipelineCard({ range = "this_month" }: { range?: string }) { const mappedData: PipelineChartData = { title: "Pipeline", stages: [ - { stage: "New Leads", count: stats.newDeals }, - { stage: "Contacted", count: stats.contactedDeals }, - { stage: "Proposal Sent", count: stats.proposalDeals }, - { stage: "Negotiation", count: stats.negotiationDeals }, - { stage: "Won", count: stats.wonDeals }, + {stage: "New Leads", count: stats.newDeals, color: "bg-purple-500"}, + {stage: "Contacted", count: stats.contactedDeals, color: "bg-purple-400"}, + {stage: "Proposal Sent", count: stats.proposalDeals, color: "bg-purple-300"}, + {stage: "Negotiation", count: stats.negotiationDeals, color: "bg-purple-200"}, + {stage: "Won", count: stats.wonDeals, color: "bg-purple-100"}, ], conversionRates: [ stats.totalDeals > 0 ? (stats.contactedDeals / stats.totalDeals) * 100 : 0, @@ -139,23 +139,44 @@ export function PipelineCard({ range = "this_month" }: { range?: string }) { ))} -
+
{stages.map((stage, index) => {
// Calculate bar height as percentage of max stage count (increased scaling for more prominent bars)
const maxCount = Math.max(...stages.map(s => s.count));
- const barHeight = maxCount > 0 ? (stage.count / maxCount) * 250 : 0; // Increased from 150 to 250 for maximum prominence
-
+ let barHeight = maxCount > 0 ? (stage.count / maxCount) * 250 : 0; // Increased from 150 to 250 for maximum prominence
+ // Hauteur actuelle
+ const h = Math.max(barHeight, 8);
+
+ // hauteur du prochain (ou égal si dernier)
+ const nextH =
+ index < stages.length - 1
+ ? ((stages[index + 1].count / maxCount) * 250)
+ : h;
+ // Déterminer le clip-path pour créer l'effet 3D
+ let clipPath = "";
+ if (h < nextH) {
+ const percentageDiff = (Math.abs(nextH - h) / nextH) * 100;
+ // Si la barre actuelle est plus courte que la suivante, incliner vers la droite
+ clipPath = `polygon(0% ${percentageDiff}%, 100% 0%, 100% 100%, 0% 100%)`;
+ barHeight = nextH;
+ } else if (h > nextH) {
+ const percentageDiff = ((Math.abs(nextH - h) / h) * 100) - 2;
+ // Si la barre actuelle est plus haute que la suivante, incliner vers la gauche
+ clipPath = `polygon(0% 0%, 100% ${percentageDiff}%, 100% 100%, 0% 100%)`;
+ } else {
+ // Si les hauteurs sont égales, pas d'inclinaison
+ clipPath = `polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)`;
+ }
return (
({
resolver: zodResolver(prospectSchema),
- defaultValues: getInitialValues(),
+ defaultValues: getInitialValues(userData),
})
useEffect(() => {
- reset(getInitialValues())
+ reset(getInitialValues(userData))
}, [initialData, mode, userOptions, reset])
const values = watch()
@@ -158,7 +160,7 @@ export default function ProspectForm({
onSubmit(payload)
if (mode === "add") {
- reset(getInitialValues())
+ reset(getInitialValues(userData))
setTagInput("")
}
})
@@ -180,7 +182,7 @@ export default function ProspectForm({
name="company"
value={values.company}
options={getCompanyOptions()}
- onChange={(val) => setValue("company", val, { shouldValidate: true })}
+ onChange={(val) => setValue("company", val, {shouldValidate: true})}
placeholder="Search or create a company"
/>
@@ -208,7 +210,7 @@ export default function ProspectForm({
name="owner"
value={values.owner}
options={userOptions}
- onChange={(val) => setValue("owner", val, { shouldValidate: true })}
+ onChange={(val) => setValue("owner", val, {shouldValidate: true})}
placeholder="Select Owner"
showIcon={false}
maxOptions={20}
@@ -219,15 +221,15 @@ export default function ProspectForm({
setValue("status", val, { shouldValidate: true })}
+ onChange={(val) => setValue("status", val, {shouldValidate: true})}
placeholder="Select Status"
options={[
- { value: "New", label: "New" },
- { value: "Cold", label: "Cold" },
- { value: "Qualified", label: "Qualified" },
- { value: "Warmlead", label: "Warm Lead" },
- { value: "Converted", label: "Converted" },
- { value: "Notintrested", label: "Not Interested" },
+ {value: "New", label: "New"},
+ {value: "Cold", label: "Cold"},
+ {value: "Qualified", label: "Qualified"},
+ {value: "Warmlead", label: "Warm Lead"},
+ {value: "Converted", label: "Converted"},
+ {value: "Notintrested", label: "Not Interested"},
]}
/>
@@ -235,7 +237,7 @@ export default function ProspectForm({
setValue("tags", vals, { shouldValidate: true })}
+ setValue={(vals: string[]) => setValue("tags", vals, {shouldValidate: true})}
input={tagInput}
setInput={(value: string) => setTagInput(value)}
/>
@@ -257,7 +259,7 @@ export default function ProspectForm({
type="button"
className="flex-1"
onClick={() => {
- reset(getInitialValues())
+ reset(getInitialValues(userData))
onCancel()
}}
>
@@ -272,11 +274,11 @@ export default function ProspectForm({
}
function FieldBlock({
- name,
- label,
- children,
- error,
-}: {
+ name,
+ label,
+ children,
+ error,
+ }: {
name: string
label: string
children: React.ReactNode
diff --git a/src/feature/settings/email/components/EmailForm.tsx b/src/feature/settings/email/components/EmailForm.tsx
index 71913b3..530485d 100644
--- a/src/feature/settings/email/components/EmailForm.tsx
+++ b/src/feature/settings/email/components/EmailForm.tsx
@@ -40,7 +40,7 @@ export default function EmailForm() {
)}
{/* Container for bottom-up growth */}
);
})}
diff --git a/src/feature/dashboard/types/Types.tsx b/src/feature/dashboard/types/Types.tsx
index fb4a158..7d3c249 100644
--- a/src/feature/dashboard/types/Types.tsx
+++ b/src/feature/dashboard/types/Types.tsx
@@ -1,5 +1,6 @@
import type React from "react"
-import { ReactNode } from "react"
+import {ReactNode} from "react"
+
export interface MetricData {
title: string
value: string
@@ -11,12 +12,13 @@ export interface MetricData {
export interface PipelineStage {
stage: string
count: number
+ color?: string
}
export interface PipelineChartData {
- title: string
- stages: PipelineStage[]
- conversionRates: number[]
+ title: string
+ stages: PipelineStage[]
+ conversionRates: number[]
}
export interface Activity {
diff --git a/src/feature/prospects/components/ProspectForm.tsx b/src/feature/prospects/components/ProspectForm.tsx
index 78cd446..2f07103 100644
--- a/src/feature/prospects/components/ProspectForm.tsx
+++ b/src/feature/prospects/components/ProspectForm.tsx
@@ -1,18 +1,19 @@
"use client"
import type React from "react"
-import { useEffect, useState } from "react"
-import { useForm } from "react-hook-form"
-import { zodResolver } from "@hookform/resolvers/zod"
-import { z } from "zod"
-import { Button } from "@/components/ui/Button"
+import {useEffect, useState} from "react"
+import {useForm} from "react-hook-form"
+import {zodResolver} from "@hookform/resolvers/zod"
+import {z} from "zod"
+import {Button} from "@/components/ui/Button"
import SearchableDropdown from "@/components/ui/SearchableDropdown"
-import { useCompaniesStore } from "@/feature/companies/stores/useCompaniesStore"
-import { Prospect } from "../types/types"
-import { getCompanyOptions } from "../libs/companyData"
+import {useCompaniesStore} from "@/feature/companies/stores/useCompaniesStore"
+import {Prospect} from "../types/types"
+import {getCompanyOptions} from "../libs/companyData"
import TagInput from "@/components/ui/TagInput"
import CustomDropdown from "@/components/ui/CustomDropdown"
import {validateCompany, validateOwner} from "@/feature/forms/lib/formValidation";
+import {useSession} from "next-auth/react";
const prospectSchema = z.object({
fullName: z.string().trim().min(1, "Full name is required"),
@@ -34,13 +35,13 @@ const prospectSchema = z.object({
.trim()
.refine(
(val) => ["New", "Qualified", "Converted", "Cold", "Warmlead", "Notintrested"].includes(val),
- { message: "Status is required" }
+ {message: "Status is required"}
),
owner: z.string().refine(async (id) => {
return await validateOwner(id);
}, {
message: "User does not exist"
- }), tags: z.array(z.string().trim().min(1)).max(10, "Up to 10 tags allowed"),
+ }), tags: z.array(z.string().trim().min(1)).max(10, "Up to 10 tags allowed"),
notes: z.string().optional().or(z.literal("")),
})
@@ -58,13 +59,13 @@ const baseInitialValues: ProspectFormValues = {
}
export default function ProspectForm({
- onSubmit,
- onCancel,
- mode = "add",
- initialData,
- usersLoading: _usersLoading,
- userOptions,
-}: {
+ onSubmit,
+ onCancel,
+ mode = "add",
+ initialData,
+ usersLoading: _usersLoading,
+ userOptions,
+ }: {
onSubmit: (values: ProspectFormValues) => void
onCancel: () => void
mode?: "add" | "edit"
@@ -73,15 +74,16 @@ export default function ProspectForm({
userOptions: { id: string; value: string; label: string }[]
}) {
const [tagInput, setTagInput] = useState("")
- const { lastCompanyId } = useCompaniesStore();
+ const {lastCompanyId} = useCompaniesStore();
+ const {data: userData} = useSession();
useEffect(() => {
useCompaniesStore.getState().fetchCompanies()
}, [])
- const getInitialValues = (): ProspectFormValues => {
+ const getInitialValues = (userData: { user: { id: string } | null } | null): ProspectFormValues => {
if (mode === "edit" && initialData) {
- const { companies } = useCompaniesStore.getState()
+ const {companies} = useCompaniesStore.getState()
let companyValue = ""
if (initialData.company) {
@@ -127,7 +129,7 @@ export default function ProspectForm({
return {
...baseInitialValues,
company: lastCompanyId || "",
- owner: userOptions.length > 0 ? userOptions[0].id : "",
+ owner: userData?.user?.id || "",
}
}
@@ -137,14 +139,14 @@ export default function ProspectForm({
setValue,
reset,
watch,
- formState: { errors, isSubmitting },
+ formState: {errors, isSubmitting},
} = useForm
{/* 3D Effect Graph Bar - grows from bottom up */}
-
+
{/* 3D depth effect */}
@@ -163,7 +184,7 @@ export function PipelineCard({ range = "this_month" }: { range?: string }) {
-