How To Install

Helpical React Components.

Include these components:
- Ticket List
- Ticket Create
- Ticket Reply

``
yarn add smartech-support
`

Hot To Use

1- Create a page in your app: (Tickets List)

Add MainTicket to this page:

`
import { MainTicket } from "smartech-support";

const Tickets = () => {
const nav = useNavigate();
const userEmail = '';
const currentDepartment = 'HELPICAL_DEPARTMENT_ID';

return (
router={nav}
options={{
createRoute: "/tickets/create",
editRoute: "/tickets/",
userEmail: userEmail,
currentDepartment: currentDepartment,
}}
/>
);
};

export default Tickets;

`

2- Create a page for add ticket:
add TicketCreate component like this:

`
import { useNavigate } from "react-router-dom";
import { TicketCreate } from "smartech-support";

import MainContainer from "@/components/container/MainContainer";
import { HELPICAL_DEPARTMENT_ID } from "@/utils/constants/configConstants";
import { useAccount } from "@/utils/hooks/useAuth";

const Ticket = () => {
const nav = useNavigate();
const { userDetail } = useAccount();

const userEmail = userDetail?.email;
const currentDepartment = HELPICAL_DEPARTMENT_ID;
const userProfile = {
email: userEmail,
firstName: userDetail?.first_name,
lastName: userDetail?.last_name,
id: userDetail?.mobile,
};

return (

router={nav}
options={{
routeList: "/tickets",
userProfile: userProfile,
currentDepartment: currentDepartment,
}}
/>

);
};

export default Ticket;

`

3- Create Reply page in your app:

`
import { useMatch, useNavigate } from "react-router-dom";
import { TicketReply as TicketReplyMain } from "smartech-support";

import MainContainer from "@/components/container/MainContainer";
import { HELPICAL_DEPARTMENT_ID } from "@/utils/constants/configConstants";
import { useAccount } from "@/utils/hooks/useAuth";

const TicketReply = () => {
const { userDetail } = useAccount();
const nav = useNavigate();
const replyId = useMatch("/tickets/:id")?.params?.id;
const selectedTicket = replyId;

const currentDepartment = HELPICAL_DEPARTMENT_ID;

const userProfile = {
email: userDetail?.email,
firstName: userDetail?.first_name,
lastName: userDetail?.last_name,
id: userDetail?.mobile,
};

return (

router={nav}
selectedTicket={selectedTicket}
options={{
currentDepartment: currentDepartment,
userProfile: userProfile,
}}
/>

);
};

export default TicketReply;

``