diff --git a/src/components/Tenanat/OrganizationInfo.jsx b/src/components/Tenanat/OrganizationInfo.jsx index 59401538..0c1e3054 100644 --- a/src/components/Tenanat/OrganizationInfo.jsx +++ b/src/components/Tenanat/OrganizationInfo.jsx @@ -2,10 +2,10 @@ import React, { useState } from "react"; import { useFormContext, Controller } from "react-hook-form"; import Label from "../common/Label"; import DatePicker from "../common/DatePicker"; -import { useIndustries } from "../../hooks/useTenant"; +import { useCreateTenant, useIndustries } from "../../hooks/useTenant"; import { LogoUpload } from "./LogoUpload"; -const OrganizationInfo = ({ onNext, onPrev,onSubmitTenant }) => { +const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => { const { data, isError, isLoading: industryLoading } = useIndustries(); const [logoPreview, setLogoPreview] = useState(null); const [logoName, setLogoName] = useState(""); @@ -18,27 +18,35 @@ const OrganizationInfo = ({ onNext, onPrev,onSubmitTenant }) => { formState: { errors }, } = useFormContext(); + const { + mutate: CreateTenant, + isError: tenantError, + error, + isPending, + } = useCreateTenant(() => onNext()); + const handleNext = async () => { - const valid = await trigger([ - "organizationName", - "officeNumber", - "domainName", - "description", - "onBoardingDate", - "organizationSize", - "taxId", - "industryId", - "reference", - "logoImage", - ]); + const valid = await trigger([ + "organizationName", + "officeNumber", + "domainName", + "description", + "onBoardingDate", + "organizationSize", + "taxId", + "industryId", + "reference", + "logoImage", + ]); - if (valid) { - const data = getValues(); - onSubmitTenant(data); - onNext(); - } -}; + if (valid) { + const tenantPayload = getValues(); + // onSubmitTenant(data); + // onNext(); + CreateTenant(tenantPayload); + } + }; const Reference = [ { val: "google", name: "Google" }, @@ -53,7 +61,6 @@ const OrganizationInfo = ({ onNext, onPrev,onSubmitTenant }) => { { val: "600", name: "500+" }, ]; - return (
@@ -167,7 +174,10 @@ const OrganizationInfo = ({ onNext, onPrev,onSubmitTenant }) => { {...register("organizationSize")} /> */} - {orgSize.map((org) => (
-
- - - - -
- +
+ + +
@@ -266,8 +277,9 @@ const OrganizationInfo = ({ onNext, onPrev,onSubmitTenant }) => { type="button" className="btn btn-sm btn-primary" onClick={handleNext} + disabled={isPending} > - Next + {isPending ? "Please Wait...":"Submit and Next"}
diff --git a/src/components/Tenanat/SubScription.jsx b/src/components/Tenanat/SubScription.jsx index 2835fe56..75d12f67 100644 --- a/src/components/Tenanat/SubScription.jsx +++ b/src/components/Tenanat/SubScription.jsx @@ -1,14 +1,15 @@ import React, { useState, useEffect } from "react"; -import { useSubscriptionPlan } from "../../hooks/useTenant"; +import { useAddSubscription, useSubscriptionPlan } from "../../hooks/useTenant"; import SegmentedControl from "./SegmentedControl"; import { useFormContext } from "react-hook-form"; import { CONSTANT_TEXT } from "../../utils/constants"; import Label from "../common/Label"; +import { useSelector } from "react-redux"; const SubScription = ({ onSubmitSubScription }) => { const [frequency, setFrequency] = useState(2); const [selectedPlanId, setSelectedPlanId] = useState(null); - + const selectedTenant = useSelector((store)=>store.globalVariables.currentTenant) const { data: plans = [], isError, @@ -23,7 +24,7 @@ const SubScription = ({ onSubmitSubScription }) => { formState: { errors }, } = useFormContext(); - + const {mutate:AddSubScription,isPending,error} = useAddSubscription() const handleSubscriptionSubmit = async () => { const isValid = await trigger([ "planId", @@ -36,7 +37,9 @@ const SubScription = ({ onSubmitSubScription }) => { if (isValid) { const payload = getValues(); - onSubmitSubScription(payload); + // onSubmitSubScription(payload); + const subscriptionPayload = {...payload,tenantId:selectedTenant.id} + AddSubScription(subscriptionPayload) } }; @@ -62,7 +65,7 @@ const SubScription = ({ onSubmitSubScription }) => {
handlePlanSelection(plan)} > @@ -83,11 +86,11 @@ const SubScription = ({ onSubmitSubScription }) => {
))}
@@ -187,10 +188,11 @@ const SubScription = ({ onSubmitSubScription }) => {
diff --git a/src/components/Tenanat/TenantForm.jsx b/src/components/Tenanat/TenantForm.jsx index a7c12e4b..9d7bf8da 100644 --- a/src/components/Tenanat/TenantForm.jsx +++ b/src/components/Tenanat/TenantForm.jsx @@ -59,7 +59,7 @@ const TenantForm = () => { }, { name: "Organization", - icon: "bx bx-home bx-md", + icon: "bx bx-buildings bx-md", subtitle: "Organization Details", component: , }, diff --git a/src/components/Tenanat/TenantsList.jsx b/src/components/Tenanat/TenantsList.jsx index 89782fd6..253cac22 100644 --- a/src/components/Tenanat/TenantsList.jsx +++ b/src/components/Tenanat/TenantsList.jsx @@ -1,6 +1,8 @@ import React, { useState } from "react"; import { useTenants } from "../../hooks/useTenant"; import { ITEMS_PER_PAGE } from "../../utils/constants"; +import { getTenantStatus } from "../../utils/dateUtils"; +import IconButton from "../common/IconButton"; const TenantsList = () => { const [currentPage, setCurrentPage] = useState(1); @@ -21,17 +23,110 @@ const TenantsList = () => {

Loading...

); - if (isError) return
{error}
; + if (isError) return
{error.message}
; + + const TenantColumns = [ + { + key: "name", + label: "Organization", + getValue: (t) => (
+ {t.name || "N/A"} +
), + align: "text-start", + }, + { + key: "domainName", + label: "Domain", + getValue: (t) =>( +
+ + + {t.domainName || "N/A"} + +
+ + ), + align: "text-start", + }, + { + key: "contactName", + label: "Contact Person", + getValue: (t) => (
{t.contactName || "N/A"}
), + align: "text-start", + }, + { + key: "contactNumber", + label: "Contact", + getValue: (t) => t.contactNumber || "N/A", + isAlwaysVisible: true, + }, + { + key: "status", + label: "Status", + align: "text-center", + getValue: (t) => ( + + {t.tenantStatus?.name || "Unknown"} + + ), + }, + ]; + + return ( -
-
- + <> + +
+
+ + + + {TenantColumns.map((col) => ( + + ))} + + + + + {data?.data.length > 0 ? ( + data.data.map((tenant) => ( + + {TenantColumns.map((col) => ( + + ))} + + )) + ) : ( + + + + )} + + +
+
{col.label}
+
+ {col.customRender + ? col.customRender(tenant) + : col.getValue(tenant)} +
+ No Tenants Found +
-
-
+
+ + ); }; -export default TenantsList; +export default TenantsList \ No newline at end of file diff --git a/src/components/common/IconButton.jsx b/src/components/common/IconButton.jsx index 362c1db9..616d8cd6 100644 --- a/src/components/common/IconButton.jsx +++ b/src/components/common/IconButton.jsx @@ -15,7 +15,7 @@ const IconButton = ({ iconClass, // icon class string like 'bx bx-user' color = "primary", onClick, - size = 20, + size = 5, radius=null, style = {}, ...rest @@ -31,7 +31,7 @@ const IconButton = ({ style={{ backgroundColor, color: iconColor, - padding: "0.4rem", + padding: "0.3rem", margin:'0rem 0.2rem', ...style, }} diff --git a/src/hooks/useTenant.js b/src/hooks/useTenant.js index 9d4aa15c..8a2207cd 100644 --- a/src/hooks/useTenant.js +++ b/src/hooks/useTenant.js @@ -2,6 +2,8 @@ import { useMutation, useQuery } from "@tanstack/react-query"; import { TenantRepository } from "../repositories/TenantRepository"; import { MarketRepository } from "../repositories/MarketRepository"; import showToast from "../services/toastService"; +import { useDispatch } from "react-redux"; +import { setCurrentTenant } from "../slices/globalVariablesSlice"; export const useTenants = ( pageSize, @@ -19,7 +21,6 @@ export const useTenants = ( return response.data; }, keepPreviousData: true, - staleTime: 5 * 60 * 1000, }); }; @@ -46,7 +47,8 @@ export const useSubscriptionPlan=(freq)=>{ // ------------Mutation--------------------- -export const usecreateTenant = (onSuccessCallback)=>{ +export const useCreateTenant = (onSuccessCallback)=>{ + const dispatch = useDispatch() return useMutation({ mutationFn:async(tenantPayload)=>{ const res = await TenantRepository.createTenant(tenantPayload); @@ -54,12 +56,25 @@ export const usecreateTenant = (onSuccessCallback)=>{ }, onSuccess:(data,variables)=>{ showToast("Tenant Created SuccessFully","success") - - if(onSuccessCallback) onSuccessCallback() + dispatch(setCurrentTenant(data)) + if(onSuccessCallback) onSuccessCallback() }, onError:(error)=>{ showToast(error.response.message || error.message || `Something went wrong`,"error") } }) +} + +export const useAddSubscription =(onSuccessCallback)=>{ + return useMutation({ + mutationFn:async(subscriptionPayload)=>{ + const res = await TenantRepository.createTenant(subscriptionPayload); + return res.data; + }, + onSuccess:(data,variables)=>{ + showToast("Tenant Plan Added SuccessFully","success") + if(onSuccessCallback) onSuccessCallback() + } + }) } \ No newline at end of file diff --git a/src/pages/Tenant/TenantPage.jsx b/src/pages/Tenant/TenantPage.jsx index 78eeb889..92637b66 100644 --- a/src/pages/Tenant/TenantPage.jsx +++ b/src/pages/Tenant/TenantPage.jsx @@ -1,8 +1,10 @@ import React from 'react' import Breadcrumb from '../../components/common/Breadcrumb' import TenantsList from '../../components/Tenanat/TenantsList' +import { useNavigate } from 'react-router-dom' const TenantPage = () => { + const navigate = useNavigate() return (
{ { label: "Tenant", link: null }, ]} /> +
+
+ +
+
diff --git a/src/repositories/TenantRepository.jsx b/src/repositories/TenantRepository.jsx index 6f868116..cd94d3df 100644 --- a/src/repositories/TenantRepository.jsx +++ b/src/repositories/TenantRepository.jsx @@ -4,11 +4,13 @@ export const TenantRepository = { getTenanatList:(pageSize, pageNumber, filter,searchString)=>{ const payloadJsonString = JSON.stringify(filter); - return api.get(`/api/Tenant/list?pageSize=${pageSize}&pageNumber=${pageNumber}&filter=${payloadJsonString}&searchString=${searchString}`) + return api.get(`/api/Tenant/list?pageSize=${pageSize}&pageNumber=${pageNumber}`) }, getSubscriptionPlan:(freq)=>api.get(`/api/Tenant/list/subscription-plan?frequency=${freq}`), - createTenant:(data)=>api.post('/api/Tenant/create',data) + createTenant:(data)=>api.post('/api/Tenant/create',data), + + addSubscription:(data)=>api.post('/api/Tenant/create',data) } diff --git a/src/slices/globalVariablesSlice.jsx b/src/slices/globalVariablesSlice.jsx index 4e14191d..7bdadd51 100644 --- a/src/slices/globalVariablesSlice.jsx +++ b/src/slices/globalVariablesSlice.jsx @@ -3,7 +3,8 @@ import { createSlice } from "@reduxjs/toolkit"; const globalVariablesSlice = createSlice({ name: "globalVariables", initialState: { - loginUser:null + loginUser:null, + currentTenant:null }, reducers: { setGlobalVariable: (state, action) => { @@ -13,9 +14,12 @@ const globalVariablesSlice = createSlice({ setLoginUserPermmisions: ( state, action ) => { state.loginUser = action.payload + }, + setCurrentTenant:(state,action)=>{ + state.currentTenant = action.payload } }, }); -export const { setGlobalVariable,setLoginUserPermmisions } = globalVariablesSlice.actions; +export const { setGlobalVariable,setLoginUserPermmisions,setCurrentTenant } = globalVariablesSlice.actions; export default globalVariablesSlice.reducer; diff --git a/src/utils/constants.jsx b/src/utils/constants.jsx index 65190679..3a7c0320 100644 --- a/src/utils/constants.jsx +++ b/src/utils/constants.jsx @@ -68,9 +68,11 @@ export const EXPENSE_MANAGEMENT = "a4e25142-449b-4334-a6e5-22f70e4732d7" export const BASIC_PLAN = "08ddd43e-ca62-4cf4-8d7b-569a364307f4" export const BASE_URL = process.env.VITE_BASE_URL; + +export const ActiveTenant = "62b05792-5115-4f99-8ff5-e8374859b191" // export const BASE_URL = "https://api.marcoaiot.com"; export const CONSTANT_TEXT = { - RenewsubscriptionLabel : " This option; if checked, will renew your productive subscription, if the current plan expires. However, this might prevent you from" + RenewsubscriptionLabel : " This option; if checked, will renew your productive subscription, if the current plan expires." } diff --git a/src/utils/dateUtils.jsx b/src/utils/dateUtils.jsx index a9c5f31d..f32ce652 100644 --- a/src/utils/dateUtils.jsx +++ b/src/utils/dateUtils.jsx @@ -1,4 +1,5 @@ import moment from "moment"; +import { ActiveTenant } from "./constants"; export const getDateDifferenceInDays = (startDate, endDate) => { if (!startDate || !endDate) { @@ -82,4 +83,8 @@ export const getCompletionPercentage = (completedWork, plannedWork)=> { const clamped = Math.min(Math.max(percentage, 0), 100); return clamped.toFixed(2); +} + +export const getTenantStatus =(statusId)=>{ + return ActiveTenant === statusId ? " bg-label-success":"bg-label-secondary" } \ No newline at end of file