Karimaldeen/hijabi-dashboard
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Done

Browse Source
This commit is contained in:
KarimAldeen 2024-02-29 14:29:00 +03:00
parent 77b8f31fc2
commit 7fa5a79391
60 changed files with 2553 additions and 221 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/Components/Columns/ColumnsImage.tsx
View File

@ -14,10 +14,8 @@ import useImageError from '../../Hooks/useImageError';
const ColumnsImage= ({src}:any) => { const ColumnsImage= ({src}:any) => {
const ErrorImage = "https://upload.wikimedia.org/wikipedia/commons/thumb/6/65/No-Image-Placeholder.svg/832px-No-Image-Placeholder.svg.png" const ErrorImage = "https://upload.wikimedia.org/wikipedia/commons/thumb/6/65/No-Image-Placeholder.svg/832px-No-Image-Placeholder.svg.png"
console.log(ImageBaseURL + src,"ColumnsImage");
const imageUrl = ImageBaseURL + src || ErrorImage; const imageUrl = ImageBaseURL + src || ErrorImage;
console.log(imageUrl);
const handleError = useImageError; const handleError = useImageError;
// or you can download flipped and rotated image // or you can download flipped and rotated image

13
src/Pages/Categories/View/AddForm.tsx → src/Pages/Categories/View/Add/AddForm.tsx
View File

@ -1,16 +1,15 @@
import React from 'react' import React from 'react'
import { Col, Row } from 'reactstrap'; import { Col, Row } from 'reactstrap';
import ValidationField from '../../../Components/ValidationField/ValidationField'; import ValidationField from '../../../../Components/ValidationField/ValidationField';
import { useFormikContext } from 'formik'; import { useFormikContext } from 'formik';
import { DatePicker } from 'antd'; import { DatePicker } from 'antd';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useGetCategories } from '../../../api/Categories'; import { useGetCategories } from '../../../../api/Categories';
import useFormatToSelect from '../../../Hooks/useFormatToSelect'; import useFormatToSelect from '../../../../Hooks/useFormatToSelect';
import { useGetOneAttribute } from '../../../api/attribute'; import { useGetOneAttribute } from '../../../../api/attribute';
import Atteibute from './Atteibute'; import Atteibute from '../Atteibute';
import ObjectField from './Field/Object';
function Form() { function Form() {
const formik = useFormikContext<any>(); const formik = useFormikContext<any>();
@ -31,7 +30,7 @@ function Form() {
<Col> <Col>
<ValidationField name="parent_id" type="Search" option={SelectData} searchBy={"search"} /> <ValidationField name="parent_id" type="Search" option={SelectData} searchBy={"search"} />
<ValidationField name="photo" type="File" /> <ValidationField name="photo" type="File" />
<ObjectField/> {/* <ObjectField/> */}
{/* {values?.id && {/* {values?.id &&
<Atteibute /> <Atteibute />
} */} } */}

72
src/Pages/Categories/View/Add/AttributeTab/AttributeTabs.tsx Normal file
View File

@ -0,0 +1,72 @@
// AttributeTabs.tsx
import React from 'react';
import { Col, Row } from 'reactstrap';
import { FormItem } from './Field/FormItem';
import { useFormikContext, FormikValues } from 'formik';
import File from './Field/File';
import { useTranslation } from 'react-i18next';
import { TabsContainer } from '../AttributeValueTab/TabsContainer';
import SelectField from './Field/Select';
interface AttributeTabsProps {
tabKey: string;
}
export const AttributeTabs: React.FC<AttributeTabsProps> = ({ tabKey }) => {
const { t } = useTranslation();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const handleFieldChange = (fieldName: string) => (
e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | any
) => {
handleChange(`Attribute.${tabKey}.${fieldName}`)(e); // Prepend "Attribute"
};
const FormikName = (FormikFieldname: any) => values?.Attribute?.[tabKey]?.[FormikFieldname];
return (
<>
<h5>{t("Attributes")} {tabKey}</h5>
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<FormItem
label={t(`name_en`)}
value={FormikName("name_en")}
onChange={handleFieldChange('name_en')}
/>
<FormItem
label={t(`name_ar`)}
value={FormikName("name_ar")}
onChange={handleFieldChange('name_ar')}
/>
</Col>
<Col>
<FormItem
label={t(`name_de`)}
value={FormikName("name_de")}
onChange={handleFieldChange('name_de')}
/>
{/* <FormItem
label={t(`type`)}
value={FormikName("type")}
onChange={handleFieldChange('type')}
/> */}
<SelectField tabKey={tabKey}/>
</Col>
</Row>
<div className='mt-3'>
<TabsContainer parentKey={tabKey} />
</div>
</>
);
};

62
src/Pages/Categories/View/Add/AttributeTab/Field/File.tsx Normal file
View File

@ -0,0 +1,62 @@
import { Button, Upload, UploadFile } from 'antd'
import { UploadOutlined } from '@ant-design/icons';
import { useTranslation } from 'react-i18next';
import { useFormikContext } from 'formik';
const File = ({ tabKey}:any) => {
const { t } = useTranslation();
const formik = useFormikContext<any>();
const name = `Attribute[${tabKey}].${"main_photo"}`;
const imageUrl = formik?.values?.Attribute[tabKey]?.main_photo ? URL.createObjectURL(formik?.values?.Attribute[tabKey]?.main_photo) : "" ;
const fileList: UploadFile[] = [
{
uid: '-1',
name: formik?.values?.Attribute[tabKey]?.main_photo?.name ?? "",
status: 'done',
url: imageUrl ,
thumbUrl: imageUrl ,
}
];
const FilehandleChange = (value:any) => {
formik.setFieldValue(name, value.file.originFileObj)
};
const customRequest = async ({ onSuccess}: any) => {
onSuccess();
};
return (
<div className="ValidationField">
<label className="text">
{t(`main_photo`)}
</label>
<Upload
listType="picture"
maxCount={1}
defaultFileList={[...fileList]}
onChange={ FilehandleChange}
customRequest={customRequest}
className={`w-100`}
>
<Button className={" w-100"} icon={<UploadOutlined />}>
{ t("upload_image") }
</Button>
</Upload>
</div>
)
}
export default File

19
src/Pages/Categories/View/Add/AttributeTab/Field/FormItem.tsx Normal file
View File

@ -0,0 +1,19 @@
// FormItem.tsx
import React from 'react';
import { Input, Label } from 'reactstrap';
interface FormItemProps {
label: string;
value: string;
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
type?: any
}
export const FormItem: React.FC<FormItemProps> = ({ label, value, onChange ,type = "text"}) => {
return (
<>
<Label className="tabstext">{label}</Label>
<Input value={value} type={type} onChange={onChange} />
</>
);
};

41
src/Pages/Categories/View/Add/AttributeTab/Field/Select.tsx Normal file
View File

@ -0,0 +1,41 @@
import { Form, Select } from 'antd'
import { useFormikContext } from 'formik';
import React from 'react'
import { useTranslation } from 'react-i18next';
const SelectField = ({tabKey}: any) => {
const { t } = useTranslation();
const formik = useFormikContext<any>();
const Formikname = `Attribute[${tabKey}].type`;
const FormikValue = formik?.values?.Attribute[tabKey]?.["type"];
const onChange = (value:any) => {
formik.setFieldValue(Formikname,value)
console.log(value);
}
const Data = [{label: "color",value :"color"},{label: "text",value :"text"},{label: "image",value :"image"}]
return (
<div className='ValidationField'>
<label className="text">
{t(`${"type"}`)}
</label>
<Select
placeholder={t(`${"type"}`)}
options={Data}
size="large"
className={` w-100`}
defaultValue={FormikValue}
allowClear
onChange={onChange}
/>
</div>
)
}
export default React.memo(SelectField);

102
src/Pages/Categories/View/Add/AttributeTab/TabsContainer.tsx Normal file
View File

@ -0,0 +1,102 @@
// TabsContainer.tsx
import React, { useEffect, useState } from 'react';
import { Tabs, Space } from 'antd';
import { CopyOutlined } from '@ant-design/icons';
import { toast } from 'react-toastify';
import { FormikValues, useFormikContext } from 'formik';
import { useTranslation } from 'react-i18next';
import { AttributeTabs } from './AttributeTabs';
const { TabPane } = Tabs;
const initialItemShape: any = {
label: 'Attribute 1',
key: '1',
closable: true,
};
export const TabsContainer: React.FC = () => {
const [activeKey, setActiveKey] = useState('1');
const [items, setItems] = useState([initialItemShape]);
const { setFieldValue } = useFormikContext();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const [width, setWidth] = useState(window.innerWidth);
const [t] = useTranslation()
const handleAdd = () => {
const newKey = `${items.length + 1}`;
setItems([...items, { key: newKey, label: `Attribute ${newKey}`, closable: true }]);
setActiveKey(newKey);
};
const handleDuplicate = (targetKey: string) => {
const targetItem = items.find((item) => item.key === targetKey);
if (targetItem) {
const newKey = `${items.length + 1}`;
const newItem = { ...targetItem, key: newKey, label: `Attribute ${newKey}` };
setItems([...items, newItem]);
setActiveKey(newKey);
const originalValues = values?.Attribute?.[targetKey];
setFieldValue(`Attribute.${newKey}`, originalValues);
}
};
const handleRemove = (targetKey: string) => {
const newItems = items.filter((item) => item.key !== targetKey);
if (newItems.length > 0) {
const newActiveKey = newItems.length ? newItems[newItems.length - 1].key : '1';
setItems(newItems);
setActiveKey(newActiveKey);
setFieldValue(`Attribute.${targetKey}`, undefined);
} else {
toast.error("Cannot close the last tab");
}
};
useEffect(() => {
const handleResize = () => {
setWidth(window.innerWidth);
};
window.addEventListener('resize', handleResize);
return () => {
window.removeEventListener('resize', handleResize);
};
}, []);
const tabPosition = width > 1000 ? 'left' : 'top';
return (
<Tabs
type="editable-card"
onChange={setActiveKey}
activeKey={activeKey}
onEdit={(targetKey:any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
tabPosition={tabPosition}
>
{items.map((item :any) =>{
return (
<TabPane
key={item?.key}
tab={
<Space>
{t(`${item.label}`)}
<CopyOutlined onClick={() => handleDuplicate(item.key)} />
</Space>
}
closable={item.closable}
>
<AttributeTabs tabKey={item?.key} />
</TabPane>
)
})}
</Tabs>
);
};

63
src/Pages/Categories/View/Add/AttributeValueTab/AttributeTabs.tsx Normal file
View File

@ -0,0 +1,63 @@
// AttributeValueTabs.tsx
import React from 'react';
import { Col, Row } from 'reactstrap';
import { FormItem } from './Field/FormItem';
import { useFormikContext, FormikValues } from 'formik';
import File from './Field/File';
import { useTranslation } from 'react-i18next';
interface AttributeValueTabsProps {
tabKey: string;
parentKey:string
}
export const AttributeValueTabs: React.FC<AttributeValueTabsProps> = ({ parentKey,tabKey }) => {
const { t } = useTranslation();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const handleFieldChange = (fieldName: string) => (
e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | any
) => {
handleChange(`Attribute.${parentKey}.AttributeValue.${tabKey}.${fieldName}`)(e); // Prepend "AttributeValue"
};
const FormikName = (FormikFieldname: any) => values?.Attribute?.[parentKey]?.AttributeValue?.[tabKey]?.[FormikFieldname];
return (
<>
<h5>{t("Values")} {tabKey}</h5>
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<FormItem
label={t(`value_en`)}
value={FormikName("value_en")}
onChange={handleFieldChange('value_en')}
/>
<FormItem
label={t(`value_ar`)}
value={FormikName("value_ar")}
onChange={handleFieldChange('value_ar')}
/>
</Col>
<Col>
<FormItem
label={t(`value_de`)}
value={FormikName("value_de")}
onChange={handleFieldChange('value_de')}
/>
<File parentKey={parentKey} tabKey={tabKey} />
</Col>
</Row>
</>
);
};

62
src/Pages/Categories/View/Add/AttributeValueTab/Field/File.tsx Normal file
View File

@ -0,0 +1,62 @@
import { Button, Upload, UploadFile } from 'antd'
import { UploadOutlined } from '@ant-design/icons';
import { useTranslation } from 'react-i18next';
import { useFormikContext } from 'formik';
const File = ({ parentKey,tabKey}:any) => {
const { t } = useTranslation();
const formik = useFormikContext<any>();
const name = `Attribute.[${parentKey}].AttributeValue[${tabKey}].${"main_photo"}`;
const imageUrl = formik?.values?.Attribute?.[parentKey]?.AttributeValue?.[tabKey]?.["main_photo"] ? URL.createObjectURL(formik?.values?.Attribute?.[parentKey]?.AttributeValue?.[tabKey]?.["main_photo"]) : "" ;
const fileList: UploadFile[] = [
{
uid: '-1',
name: "",
status: 'done',
url: imageUrl ,
thumbUrl: imageUrl ,
}
];
const FilehandleChange = (value:any) => {
formik.setFieldValue(name, value.file.originFileObj)
};
const customRequest = async ({ onSuccess}: any) => {
onSuccess();
};
return (
<div className="ValidationField">
<label className="text">
{t(`main_photo`)}
</label>
<Upload
listType="picture"
maxCount={1}
defaultFileList={[...fileList]}
onChange={ FilehandleChange}
customRequest={customRequest}
className={`w-100`}
>
<Button className={" w-100"} icon={<UploadOutlined />}>
{ t("upload_image") }
</Button>
</Upload>
</div>
)
}
export default File

19
src/Pages/Categories/View/Add/AttributeValueTab/Field/FormItem.tsx Normal file
View File

@ -0,0 +1,19 @@
// FormItem.tsx
import React from 'react';
import { Input, Label } from 'reactstrap';
interface FormItemProps {
label: string;
value: string;
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
type?: any
}
export const FormItem: React.FC<FormItemProps> = ({ label, value, onChange ,type = "text"}) => {
return (
<>
<Label className="tabstext">{label}</Label>
<Input value={value} type={type} onChange={onChange} />
</>
);
};

112
src/Pages/Categories/View/Add/AttributeValueTab/TabsContainer.tsx Normal file
View File

@ -0,0 +1,112 @@
// TabsContainer.tsx
import React, { useEffect, useState } from 'react';
import { Tabs, Space } from 'antd';
import { CopyOutlined } from '@ant-design/icons';
import { toast } from 'react-toastify';
import { FormikValues, useFormikContext } from 'formik';
import { useTranslation } from 'react-i18next';
import { AttributeValueTabs } from './AttributeTabs';
const { TabPane } = Tabs;
const initialItemShape: any = {
label: 'Value 1',
key: '1',
closable: true,
};
export const TabsContainer= ({parentKey}:any) => {
const [activeKey, setActiveKey] = useState('1');
const [t] = useTranslation()
const { setFieldValue } = useFormikContext();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const [width, setWidth] = useState(window.innerWidth);
const varianCount = values?.Attribute[parentKey]?.AttributeValue?.slice(1)?.map((item:any,index:any)=>{
return {
label: `${t(`Value`)}`+ `${index+1}`,
key: index+1,
closable: true,
}
})?? initialItemShape
const [items, setItems] = useState(Array.isArray(varianCount) ? varianCount : [initialItemShape]); // Ensure items is always an array
const handleAdd = () => {
const newKey = `${items.length + 1}`;
setItems([...items, { key: newKey, label: `Value ${newKey}`, closable: true }]);
setActiveKey(newKey);
};
const handleDuplicate = (targetKey: string) => {
const targetItem = items.find((item:any) => item.key === targetKey);
if (targetItem) {
const newKey = `${items.length + 1}`;
const newItem = { ...targetItem, key: newKey, label: `Value ${newKey}` };
setItems([...items, newItem]);
setActiveKey(newKey);
const originalValues = values?.Attribute?.[parentKey]?.AttributeValue?.[targetKey];
setFieldValue(`Attribute.${parentKey}.AttributeValue.${newKey}`, originalValues);
}
};
const handleRemove = (targetKey: string) => {
const newItems = items.filter((item:any) => item.key !== targetKey);
if (newItems.length > 0) {
const newActiveKey = newItems.length ? newItems[newItems.length - 1].key : '1';
setItems(newItems);
setActiveKey(newActiveKey);
setFieldValue(`Attribute.${parentKey}.AttributeValue.${targetKey}`, undefined);
} else {
toast.error("Cannot close the last tab");
}
};
useEffect(() => {
const handleResize = () => {
setWidth(window.innerWidth);
};
window.addEventListener('resize', handleResize);
return () => {
window.removeEventListener('resize', handleResize);
};
}, []);
const tabPosition ='top';
return (
<Tabs
type="editable-card"
onChange={setActiveKey}
activeKey={activeKey}
onEdit={(targetKey:any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
tabPosition={tabPosition}
>
{items.map((item :any) =>{
return (
<TabPane
key={item?.key}
tab={
<Space>
{t(`${item.label}`)}
<CopyOutlined onClick={() => handleDuplicate(item.key)} />
</Space>
}
closable={item.closable}
>
<AttributeValueTabs parentKey={parentKey} tabKey={item?.key} />
</TabPane>
)
})}
</Tabs>
);
};

85
src/Pages/Categories/View/AddPage.tsx
View File

@ -8,31 +8,98 @@ import { useTranslation } from 'react-i18next';
import { BsInfoCircle } from 'react-icons/bs'; import { BsInfoCircle } from 'react-icons/bs';
import useNavigateOnSuccess from '../../../Hooks/useNavigateOnSuccess'; import useNavigateOnSuccess from '../../../Hooks/useNavigateOnSuccess';
import { useAddCategories } from '../../../api/Categories'; import { useAddCategories } from '../../../api/Categories';
import Form from './AddForm'; import Form from './Add/AddForm';
import { usePageState } from '../../../lib/state mangment/LayoutPagestate'; import { usePageState } from '../../../lib/state mangment/LayoutPagestate';
import { useAddAttribute } from '../../../api/attribute';
import { TabsContainer } from './Add/AttributeTab/TabsContainer';
import { useAddAttributeValue } from '../../../api/attributeValue';
const AddcategoriesPage = () => { const AddcategoriesPage = () => {
const { setObjectToEdit, objectToEdit } = usePageState() const { setObjectToEdit, objectToEdit } = usePageState()
const {mutate , isLoading , isSuccess} = useAddCategories() const {mutate , isLoading,isSuccess,data } = useAddCategories()
const {mutate:AddAttribute, isSuccess : isSuccessAttribute,data:AttributeData} = useAddAttribute()
const {mutate:AddAttributeValue,isSuccess : isSuccessAttributeValue} = useAddAttributeValue()
const [Attribute , setAttribute] = useState<any[]>([])
const [AttributeValues , setAttributeValues] = useState<any[]>([])
const handleSubmit = (values:any)=>{ const handleSubmit = (values:any)=>{
values['attribute'] = changeShapeInfo(values?.new_attribute)
values["name"]= { setAttribute(values?.Attribute?.slice(1))
const CategoriesValues = {
name: {
en:values?.name_en, en:values?.name_en,
ar:values?.name_ar, ar:values?.name_ar,
de:values?.name_de de:values?.name_de
},
parent_id:values?.parent_id,
photo:values?.photo,
} }
mutate(CategoriesValues)
console.log();
mutate(values)
} }
useEffect(()=>{
if(isSuccess){
const categoryId = (data as any )?.id ;
Attribute?.map((dataToSend:any , index:number)=>{
const Attribute = dataToSend
setAttributeValues((prev) => ([
...prev,
...Attribute?.AttributeValue,
]));
const NewAttribute = {
name:{
en:Attribute?.name_en,
ar:Attribute?.name_ar,
de:Attribute?.name_de
},
type:Attribute?.type,
category_id:categoryId,
}
AddAttribute(NewAttribute)
})
}
},[isSuccess])
useEffect(()=>{
if(isSuccessAttribute){
const AttributeId = (AttributeData as any )?.id ;
AttributeValues?.slice(1)?.map((dataToSend:any , index:number)=>{
const AttributeValues = dataToSend
const NewAttributeValues = {
value:{
en:AttributeValues?.value_en,
ar:AttributeValues?.value_ar,
de:AttributeValues?.value_de
},
image:AttributeValues?.main_photo,
attribute_id:AttributeId,
}
AddAttributeValue(NewAttributeValues)
})
}
},[isSuccessAttribute])
const {t} = useTranslation(); const {t} = useTranslation();
useNavigateOnSuccess(isSuccess , '/categories' ) useNavigateOnSuccess(isSuccessAttributeValue , '/categories' )
useEffect(() => { useEffect(() => {
@ -52,12 +119,16 @@ const AddcategoriesPage = () => {
<TabList> <TabList>
<Tab><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><MdLanguage size={20} /></span> <h6 className='SingleDriverInfo'>{t("BasicInfo")}</h6></div></Tab> <Tab><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><MdLanguage size={20} /></span> <h6 className='SingleDriverInfo'>{t("BasicInfo")}</h6></div></Tab>
<Tab><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><MdLanguage size={20} /></span> <h6 className='SingleDriverInfo'>{t("attributes")}</h6></div></Tab>
</TabList> </TabList>
<TabBody > <TabBody >
<div className=" mt-4"><Form /></div> <div className=" mt-4"><Form /></div>
</TabBody> </TabBody>
<TabBody >
<div className=" mt-4"><TabsContainer /></div>
</TabBody>
</Tabs> </Tabs>
</ViewPage> </ViewPage>

55
src/Pages/Categories/View/Edit/AttributeTab/AttributeTabs.tsx Normal file
View File

@ -0,0 +1,55 @@
// AttributeTabs.tsx
import React from 'react';
import { Col, Row } from 'reactstrap';
import { FormItem } from './Field/FormItem';
import { useFormikContext, FormikValues } from 'formik';
import File from './Field/File';
import { useTranslation } from 'react-i18next';
import { TabsContainer } from '../AttributeValueTab/TabsContainer';
import SelectField from './Field/Select';
interface AttributeTabsProps {
tabKey: string;
}
export const AttributeTabs: React.FC<AttributeTabsProps> = ({ tabKey }) => {
const { t } = useTranslation();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const handleFieldChange = (fieldName: string) => (
e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | any
) => {
handleChange(`Attribute.${tabKey}.${fieldName}`)(e); // Prepend "Attribute"
};
const FormikName = (FormikFieldname: any) => values?.Attribute[tabKey]?.[FormikFieldname];
console.log(values?.Attribute,"value");
return (
<>
<h5>{t("Attributes")} {tabKey}</h5>
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<FormItem
label={t(`name`)}
value={FormikName("name")}
onChange={handleFieldChange('name')}
/>
</Col>
<Col>
<SelectField tabKey={tabKey}/>
</Col>
</Row>
<div className='mt-3'>
<TabsContainer parentKey={tabKey} />
</div>
</>
);
};

62
src/Pages/Categories/View/Edit/AttributeTab/Field/File.tsx Normal file
View File

@ -0,0 +1,62 @@
import { Button, Upload, UploadFile } from 'antd'
import { UploadOutlined } from '@ant-design/icons';
import { useTranslation } from 'react-i18next';
import { useFormikContext } from 'formik';
const File = ({ tabKey}:any) => {
const { t } = useTranslation();
const formik = useFormikContext<any>();
const name = `Attribute[${tabKey}].${"main_photo"}`;
const imageUrl = formik?.values?.Attribute[tabKey]?.main_photo ? URL.createObjectURL(formik?.values?.Attribute[tabKey]?.main_photo) : "" ;
const fileList: UploadFile[] = [
{
uid: '-1',
name: formik?.values?.Attribute[tabKey]?.main_photo?.name ?? "",
status: 'done',
url: imageUrl ,
thumbUrl: imageUrl ,
}
];
const FilehandleChange = (value:any) => {
formik.setFieldValue(name, value.file.originFileObj)
};
const customRequest = async ({ onSuccess}: any) => {
onSuccess();
};
return (
<div className="ValidationField">
<label className="text">
{t(`main_photo`)}
</label>
<Upload
listType="picture"
maxCount={1}
defaultFileList={[...fileList]}
onChange={ FilehandleChange}
customRequest={customRequest}
className={`w-100`}
>
<Button className={" w-100"} icon={<UploadOutlined />}>
{ t("upload_image") }
</Button>
</Upload>
</div>
)
}
export default File

20
src/Pages/Categories/View/Edit/AttributeTab/Field/FormItem.tsx Normal file
View File

@ -0,0 +1,20 @@
// FormItem.tsx
import React from 'react';
import { Input, Label } from 'reactstrap';
interface FormItemProps {
label: string;
value: string;
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
type?: any
}
export const FormItem: React.FC<FormItemProps> = ({ label, value, onChange ,type = "text"}) => {
return (
<>
<Label className="tabstext">{label}</Label>
<Input value={value} type={type} onChange={onChange} />
</>
);
};

41
src/Pages/Categories/View/Edit/AttributeTab/Field/Select.tsx Normal file
View File

@ -0,0 +1,41 @@
import { Form, Select } from 'antd'
import { useFormikContext } from 'formik';
import React from 'react'
import { useTranslation } from 'react-i18next';
const SelectField = ({tabKey}: any) => {
const { t } = useTranslation();
const formik = useFormikContext<any>();
const Formikname = `Attribute[${tabKey}].type`;
const FormikValue = formik?.values?.Attribute[tabKey]?.["type"];
const onChange = (value:any) => {
formik.setFieldValue(Formikname,value)
console.log(value);
}
const Data = [{label: "color",value :"color"},{label: "text",value :"text"},{label: "image",value :"image"}]
return (
<div className='ValidationField'>
<label className="text">
{t(`${"type"}`)}
</label>
<Select
placeholder={t(`${"type"}`)}
options={Data}
size="large"
className={` w-100`}
defaultValue={FormikValue}
allowClear
onChange={onChange}
/>
</div>
)
}
export default React.memo(SelectField);

114
src/Pages/Categories/View/Edit/AttributeTab/TabsContainer.tsx Normal file
View File

@ -0,0 +1,114 @@
// TabsContainer.tsx
import React, { useEffect, useState } from 'react';
import { Tabs, Space } from 'antd';
import { CopyOutlined } from '@ant-design/icons';
import { toast } from 'react-toastify';
import { FormikValues, useFormikContext } from 'formik';
import { useTranslation } from 'react-i18next';
import { AttributeTabs } from './AttributeTabs';
const { TabPane } = Tabs;
const initialItemShape: any = {
label: 'Attribute 1',
key: '1',
closable: true,
};
export const TabsContainer: React.FC = () => {
const [activeKey, setActiveKey] = useState('1');
const { setFieldValue } = useFormikContext();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const [width, setWidth] = useState(window.innerWidth);
const [t] = useTranslation()
const varianCount = values?.Attribute?.slice(1)?.map((item:any,index:any)=>{
return {
label: `${t(`Attribute`)}`+ `${index+1}`,
key: index+1,
closable: true,
}
})?? initialItemShape
const [items, setItems] = useState(varianCount ?? [initialItemShape]); // Ensure items is always an array
console.log(values,"items");
const handleAdd = () => {
const newKey = `${items.length + 1}`;
setItems([...items, { key: newKey, label: `Attribute ${newKey}`, closable: true }]);
setActiveKey(newKey);
};
const handleDuplicate = (targetKey: string) => {
const targetItem = items.find((item:any) => item.key === targetKey);
if (targetItem) {
const newKey = `${items.length + 1}`;
const newItem = { ...targetItem, key: newKey, label: `Attribute ${newKey}` };
setItems([...items, newItem]);
setActiveKey(newKey);
const originalValues = values?.Attribute?.[targetKey];
setFieldValue(`Attribute.${newKey}`, originalValues);
}
};
const handleRemove = (targetKey: string) => {
const newItems = items.filter((item:any) => item.key !== targetKey);
if (newItems.length > 0) {
const newActiveKey = newItems.length ? newItems[newItems.length - 1].key : '1';
setItems(newItems);
setActiveKey(newActiveKey);
setFieldValue(`Attribute.${targetKey}`, undefined);
} else {
toast.error("Cannot close the last tab");
}
};
useEffect(() => {
const handleResize = () => {
setWidth(window.innerWidth);
};
window.addEventListener('resize', handleResize);
return () => {
window.removeEventListener('resize', handleResize);
};
}, []);
const tabPosition = width > 1000 ? 'left' : 'top';
return (
<Tabs
type="editable-card"
onChange={setActiveKey}
activeKey={activeKey}
onEdit={(targetKey:any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
tabPosition={tabPosition}
>
{items.map((item :any) =>{
return (
<TabPane
key={item?.key}
tab={
<Space>
{t(`${item.label}`)}
<CopyOutlined onClick={() => handleDuplicate(item.key)} />
</Space>
}
closable={item.closable}
>
<AttributeTabs tabKey={item?.key} />
</TabPane>
)
})}
</Tabs>
);
};

52
src/Pages/Categories/View/Edit/AttributeValueTab/AttributeTabs.tsx Normal file
View File

@ -0,0 +1,52 @@
// AttributeValueTabs.tsx
import React from 'react';
import { Col, Row } from 'reactstrap';
import { FormItem } from './Field/FormItem';
import { useFormikContext, FormikValues } from 'formik';
import File from './Field/File';
import { useTranslation } from 'react-i18next';
interface AttributeValueTabsProps {
tabKey: string;
parentKey:string
}
export const AttributeValueTabs: React.FC<AttributeValueTabsProps> = ({ parentKey,tabKey }) => {
const { t } = useTranslation();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const handleFieldChange = (fieldName: string) => (
e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | any
) => {
handleChange(`Attribute.${parentKey}.AttributeValue.${tabKey}.${fieldName}`)(e); // Prepend "AttributeValue"
};
const FormikName = (FormikFieldname: any) => values?.Attribute?.[parentKey]?.AttributeValue?.[tabKey]?.[FormikFieldname];
return (
<>
<h5>{t("Values")} {tabKey}</h5>
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<FormItem
label={t(`value`)}
value={FormikName("value")}
onChange={handleFieldChange('value')}
/>
</Col>
<Col>
<File parentKey={parentKey} tabKey={tabKey} />
</Col>
</Row>
</>
);
};

62
src/Pages/Categories/View/Edit/AttributeValueTab/Field/File.tsx Normal file
View File

@ -0,0 +1,62 @@
import { Button, Upload, UploadFile } from 'antd'
import { UploadOutlined } from '@ant-design/icons';
import { useTranslation } from 'react-i18next';
import { useFormikContext } from 'formik';
const File = ({ parentKey,tabKey}:any) => {
const { t } = useTranslation();
const formik = useFormikContext<any>();
const name = `Attribute.[${parentKey}].AttributeValue[${tabKey}].${"main_photo"}`;
const imageUrl = formik?.values?.Attribute?.[parentKey]?.AttributeValue?.[tabKey]?.["main_photo"] ? URL.createObjectURL(formik?.values?.Attribute?.[parentKey]?.AttributeValue?.[tabKey]?.["main_photo"]) : "" ;
const fileList: UploadFile[] = [
{
uid: '-1',
name: "",
status: 'done',
url: imageUrl ,
thumbUrl: imageUrl ,
}
];
const FilehandleChange = (value:any) => {
formik.setFieldValue(name, value.file.originFileObj)
};
const customRequest = async ({ onSuccess}: any) => {
onSuccess();
};
return (
<div className="ValidationField">
<label className="text">
{t(`main_photo`)}
</label>
<Upload
listType="picture"
maxCount={1}
defaultFileList={[...fileList]}
onChange={ FilehandleChange}
customRequest={customRequest}
className={`w-100`}
>
<Button className={" w-100"} icon={<UploadOutlined />}>
{ t("upload_image") }
</Button>
</Upload>
</div>
)
}
export default File

19
src/Pages/Categories/View/Edit/AttributeValueTab/Field/FormItem.tsx Normal file
View File

@ -0,0 +1,19 @@
// FormItem.tsx
import React from 'react';
import { Input, Label } from 'reactstrap';
interface FormItemProps {
label: string;
value: string;
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
type?: any
}
export const FormItem: React.FC<FormItemProps> = ({ label, value, onChange ,type = "text"}) => {
return (
<>
<Label className="tabstext">{label}</Label>
<Input value={value} type={type} onChange={onChange} />
</>
);
};

111
src/Pages/Categories/View/Edit/AttributeValueTab/TabsContainer.tsx Normal file
View File

@ -0,0 +1,111 @@
// TabsContainer.tsx
import React, { useEffect, useState } from 'react';
import { Tabs, Space } from 'antd';
import { CopyOutlined } from '@ant-design/icons';
import { toast } from 'react-toastify';
import { FormikValues, useFormikContext } from 'formik';
import { useTranslation } from 'react-i18next';
import { AttributeValueTabs } from './AttributeTabs';
const { TabPane } = Tabs;
const initialItemShape: any = {
label: 'Value 1',
key: '1',
closable: true,
};
export const TabsContainer= ({parentKey}:any) => {
const [activeKey, setActiveKey] = useState('1');
const [t] = useTranslation()
const { setFieldValue } = useFormikContext();
const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext;
const [width, setWidth] = useState(window.innerWidth);
const varianCount = values?.Attribute[parentKey]?.AttributeValue?.slice(1)?.map((item:any,index:any)=>{
return {
label: `${t(`Value`)}`+ `${index+1}`,
key: index+1,
closable: true,
}
})?? initialItemShape
const [items, setItems] = useState(Array.isArray(varianCount) ? varianCount : [initialItemShape]); // Ensure items is always an array
const handleAdd = () => {
const newKey = `${items.length + 1}`;
setItems([...items, { key: newKey, label: `Value ${newKey}`, closable: true }]);
setActiveKey(newKey);
};
const handleDuplicate = (targetKey: string) => {
const targetItem = items.find((item:any) => item.key === targetKey);
if (targetItem) {
const newKey = `${items.length + 1}`;
const newItem = { ...targetItem, key: newKey, label: `Value ${newKey}` };
setItems([...items, newItem]);
setActiveKey(newKey);
const originalValues = values?.Attribute?.[parentKey]?.AttributeValue?.[targetKey];
setFieldValue(`Attribute.${parentKey}.AttributeValue.${newKey}`, originalValues);
}
};
const handleRemove = (targetKey: string) => {
const newItems = items.filter((item:any) => item.key !== targetKey);
if (newItems.length > 0) {
const newActiveKey = newItems.length ? newItems[newItems.length - 1].key : '1';
setItems(newItems);
setActiveKey(newActiveKey);
setFieldValue(`Attribute.${parentKey}.AttributeValue.${targetKey}`, undefined);
} else {
toast.error("Cannot close the last tab");
}
};
useEffect(() => {
const handleResize = () => {
setWidth(window.innerWidth);
};
window.addEventListener('resize', handleResize);
return () => {
window.removeEventListener('resize', handleResize);
};
}, []);
const tabPosition ='top';
return (
<Tabs
type="editable-card"
onChange={setActiveKey}
activeKey={activeKey}
onEdit={(targetKey:any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
tabPosition={tabPosition}
>
{items.map((item :any) =>{
return (
<TabPane
key={item?.key}
tab={
<Space>
{t(`${item.label}`)}
<CopyOutlined onClick={() => handleDuplicate(item.key)} />
</Space>
}
closable={item.closable}
>
<AttributeValueTabs parentKey={parentKey} tabKey={item?.key} />
</TabPane>
)
})}
</Tabs>
);
};

40
src/Pages/Categories/View/Edit/Form.tsx Normal file
View File

@ -0,0 +1,40 @@
import React from 'react'
import { Col, Row } from 'reactstrap';
import ValidationField from '../../../../Components/ValidationField/ValidationField';
import { useFormikContext } from 'formik';
import { DatePicker } from 'antd';
import { useTranslation } from 'react-i18next';
import { useGetCategories } from '../../../../api/Categories';
import useFormatToSelect from '../../../../Hooks/useFormatToSelect';
import { useGetOneAttribute } from '../../../../api/attribute';
import Atteibute from '../Atteibute';
function Form() {
const formik = useFormikContext<any>();
const [t] = useTranslation();
const { data } = useGetCategories()
const SelectData = useFormatToSelect(data?.categories)
const { values } = useFormikContext<any>();
return (
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<ValidationField name="name" />
<ValidationField name="parent_id" type="Search" option={SelectData} searchBy={"search"} />
</Col>
<Col>
<ValidationField name="photo" type="File" />
</Col>
</Row>
)
}
export default Form

54
src/Pages/Categories/View/EditForm.tsx
View File

@ -1,54 +0,0 @@
import React from 'react'
import { Col, Row } from 'reactstrap';
import ValidationField from '../../../Components/ValidationField/ValidationField';
import { useFormikContext } from 'formik';
import { DatePicker } from 'antd';
import { useTranslation } from 'react-i18next';
import { useGetCategories } from '../../../api/Categories';
import useFormatToSelect from '../../../Hooks/useFormatToSelect';
import { useGetOneAttribute } from '../../../api/attribute';
import Atteibute from './Atteibute';
function Form() {
const {values} = useFormikContext<any>();
const [t] = useTranslation()
const { data } = useGetCategories()
const SelectData = useFormatToSelect(data?.categories)
const {data : AttributeData} = useGetOneAttribute()
return (
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<ValidationField name="name" />
<ValidationField name="parent_id" type="Search" option={SelectData} searchBy={"name"} />
</Col>
<Col>
<ValidationField name="photo" type="File" />
{values?.id &&
<Atteibute />
}
{/* {
AttributeData?.map((item:any)=>{
return(
<ValidationField
name="attributes"
option={item?.data}
/>
)
})
} */}
</Col>
</Row>
)
}
export default Form

30
src/Pages/Categories/View/EditPage.tsx
View File

@ -5,7 +5,7 @@ import 'react-tabs/style/react-tabs.css';
import { MdLanguage } from 'react-icons/md' import { MdLanguage } from 'react-icons/md'
import { FaSadCry } from 'react-icons/fa' import { FaSadCry } from 'react-icons/fa'
import ViewPage from '../../../Layout/Dashboard/ViewPage'; import ViewPage from '../../../Layout/Dashboard/ViewPage';
import { Rate } from 'antd'; import { Rate, Spin } from 'antd';
import { usePageState } from '../../../lib/state mangment/LayoutPagestate'; import { usePageState } from '../../../lib/state mangment/LayoutPagestate';
import { useParams } from 'react-router-dom'; import { useParams } from 'react-router-dom';
import LoadingPage from '../../../Layout/app/LoadingPage'; import LoadingPage from '../../../Layout/app/LoadingPage';
@ -13,21 +13,26 @@ import { useTranslation } from 'react-i18next';
import { BsInfoCircle } from 'react-icons/bs'; import { BsInfoCircle } from 'react-icons/bs';
import { useGetOneCategories, useUpdateCategories } from '../../../api/Categories'; import { useGetOneCategories, useUpdateCategories } from '../../../api/Categories';
import useNavigateOnSuccess from '../../../Hooks/useNavigateOnSuccess'; import useNavigateOnSuccess from '../../../Hooks/useNavigateOnSuccess';
import Form from './EditForm'; import Form from './Edit/Form';
import { changeShapeInfo } from '../../../utils/Array/changeShapeInfo'; import { changeShapeInfo } from '../../../utils/Array/changeShapeInfo';
import { TabsContainer } from './Edit/AttributeTab/TabsContainer';
import { useGetSingleAttribute } from '../../../api/attribute';
const EditPage = () => { const EditPage = () => {
const { setObjectToEdit, objectToEdit } = usePageState() const { setObjectToEdit, objectToEdit } = usePageState()
const {t} = useTranslation(); const {t} = useTranslation();
const { data } = useGetOneCategories() const { data ,isLoading } = useGetOneCategories()
const {id} = useParams()
const {data : Atrribute,isLoading : isLoadingAtrribute } = useGetSingleAttribute({ name:"category_id", id:id},{})
const {mutate ,isSuccess} = useUpdateCategories("post") const {mutate ,isSuccess} = useUpdateCategories("post")
const FormatedData = data?.category ;
const handleSubmit = (values:any)=>{ const handleSubmit = (values:any)=>{
const Imagetype = typeof values?.photo const Imagetype = typeof values?.photo
values['attribute'] = changeShapeInfo(values?.attribute) values['attribute'] = changeShapeInfo(values?.attribute)
if(Imagetype === "string") { if(Imagetype === "string") {
delete values['photo'] delete values['photo']
} }
mutate(values) mutate(values)
// return mutate(newData); // return mutate(newData);
} }
@ -37,9 +42,9 @@ const EditPage = () => {
useEffect(() => { useEffect(() => {
setObjectToEdit(data?.category); setObjectToEdit([data?.category,Atrribute?.data]);
}, [data]); }, [data?.category,Atrribute?.data]);
const getValidationSchema = () => { const getValidationSchema = () => {
@ -49,6 +54,10 @@ const EditPage = () => {
const ViewProps = { getInitialValues, getValidationSchema, getDataToSend, handleSubmit }; const ViewProps = { getInitialValues, getValidationSchema, getDataToSend, handleSubmit };
if (isLoadingAtrribute || isLoading || !objectToEdit || (Array.isArray(objectToEdit) && objectToEdit.some(item => item === undefined))) {
return <Spin/>
}
return ( return (
<div className='ViewPage'> <div className='ViewPage'>
@ -56,13 +65,18 @@ const EditPage = () => {
<ViewPage {...ViewProps}> <ViewPage {...ViewProps}>
<Tabs> <Tabs>
<TabList> <TabList>
<Tab><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><MdLanguage size={20} /></span> <h6 className='SingleDriverInfo'>{t("BasicInfo")}</h6></div></Tab> {/* <Tab><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><MdLanguage size={20} /></span> <h6 className='SingleDriverInfo'>{t("BasicInfo")}</h6></div></Tab> */}
<Tab><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><MdLanguage size={20} /></span> <h6 className='SingleDriverInfo'>{t("attributes")}</h6></div></Tab>
</TabList> </TabList>
{/*
<TabBody > <TabBody >
<div className=" mt-4"><Form /></div> <div className=" mt-4"><Form /></div>
</TabBody> </TabBody> */}
<TabBody >
<div className=" mt-4"><TabsContainer /></div>
</TabBody>
</Tabs> </Tabs>
</ViewPage> </ViewPage>

114
src/Pages/Categories/View/Field/Object.tsx
View File

@ -1,114 +0,0 @@
import React, { useEffect, useState } from 'react';
import { CloseOutlined } from '@ant-design/icons';
import { Button, Card, Form, Input, Space, Typography } from 'antd';
import { useFormikContext } from 'formik';
import { objectToArray } from '../../../../utils/Array/ArrayToObjectFormik';
import { useTranslation } from 'react-i18next';
const ObjectField = () => {
const [form] = Form.useForm();
const formik = useFormikContext<any>();
const [FieldItems, setFieldItems] = useState<any>(formik?.values?.new_attribute)
const [t] = useTranslation()
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const { name, value } = e.target;
setFieldItems((prevState:any) =>{
formik.setFieldValue(`new_attribute`, {
...prevState,
[name]: value
});
return ({
...prevState,
[name]: value
})
} )
};
useEffect(() => {
if (formik?.values?.new_attribute) {
const defaultValues = formik.values.new_attribute;
console.log(objectToArray( formik?.values?.new_attribute));
form.setFieldsValue({
items: [{ list:objectToArray( formik?.values?.new_attribute)}]
});
}
else {
form.setFieldsValue({
items: [{ list: [{ key: '', Description: '' }] },], });
}
}, []); // Update when tabKey or info[tabKey] changes
return (
<Form
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
form={form}
name="dynamic_form_complex"
style={{ width: '100%' }} // Set width to 100%
autoComplete="off"
>
<Form.List name="items">
{(fields, { add, remove }) => (
<div style={{ display: 'flex', rowGap: 16, flexDirection: 'column' }}>
{fields.map((field, index) => (
<div key={field.key}>
<Typography.Text strong style={{ marginBottom: 8 }}>
{t("Information")}
</Typography.Text>
{/* Nested Form.List for sub-items */}
<Form.Item>
<Form.List name={[field.name, 'list']}>
{(subFields, subOpt) => (
<div style={{ display: 'flex', flexDirection: 'column', rowGap: 16 }}>
{subFields.map((subField) => (
<Space key={subField.key}>
<Form.Item noStyle name={[subField.name, 'key']}>
<Input
placeholder={t("key")}
onChange={handleChange} // Assign onChange handler
name={`${subField.name}.key`} // Ensure proper name for dynamic state update
/>
</Form.Item>
<Form.Item noStyle name={[subField.name, 'Description']}>
<Input
placeholder={t("Description")}
onChange={handleChange} // Assign onChange handler
name={`${subField.name}.Description`} // Ensure proper name for dynamic state update
/>
</Form.Item>
<CloseOutlined
onClick={() => {
subOpt.remove(subField.name);
}}
/>
</Space>
))}
<Button type="dashed" onClick={() => subOpt.add()} block>
{t("+ Add Another Item")}
</Button>
</div>
)}
</Form.List>
</Form.Item>
</div>
))}
</div>
)}
</Form.List>
</Form>
);
};
export default ObjectField

46
src/Pages/Categories/formUtil.ts
View File

@ -20,16 +20,28 @@ interface ValidateSchema extends formUtilCommon {
} }
export const getInitialValues = (objectToEdit: any | null = null): any => { export const getInitialValues = (objectToEdit: any | null = null): any => {
const Attribute = objectToEdit[1]?.map((item: any) => {
const AttributeValue = item?.attribute_value?.map((item:any)=>({value:item?.value , image : item?.image} )
)
return (
{
name : item?.name,
type : item?.type,
id : item?.id,
icon : item?.icon,
category_id : item?.category_id,
AttributeValue : [{},...AttributeValue],
}
)
})
return { return {
id: objectToEdit?.id ?? 0, id: objectToEdit[0]?.id ?? 0,
name: objectToEdit?.name ?? "", name: objectToEdit[0]?.name ?? "",
name_ar: objectToEdit?.name?.ar ?? '', parent_id: objectToEdit[0]?.parent_id ?? "",
name_en: objectToEdit?.name?.en ?? '', photo: objectToEdit[0]?.photo ?? '',
name_de: objectToEdit?.name?.de ?? '', Attribute: [{},...Attribute],
parent_id: objectToEdit?.parent_id ?? "",
photo: objectToEdit?.photo ?? '',
attribute: objectToEdit?.attribute ?? "",
new_attribute: objectToEdit?.attribute ?? ""
}; };
}; };
@ -38,10 +50,10 @@ export const getInitialValuesForAdd = (objectToEdit: any | null = null): any =>
name_ar: '', name_ar: '',
name_en: '', name_en: '',
name_de: '', name_de: '',
parent_id: "", parent_id: null,
photo: '', photo: '',
attribute: "", Attribute: [{},{AttributeValue:[{},{}]}],
new_attribute: ""
}; };
}; };
@ -51,11 +63,11 @@ export const getInitialValuesForAdd = (objectToEdit: any | null = null): any =>
export const getValidationSchema = (editMode: boolean = false): Yup.Schema<any> => { export const getValidationSchema = (editMode: boolean = false): Yup.Schema<any> => {
// Validate input // Validate input
return Yup.object().shape({ return Yup.object().shape({
name_ar: Yup.string().required('Required'), // name_ar: Yup.string().required('Required'),
name_en: Yup.string().required('Required'), // name_en: Yup.string().required('Required'),
name_de: Yup.string().required('Required'), // name_de: Yup.string().required('Required'),
parent_id: Yup.string().required('Required'), // parent_id: Yup.string().required('Required'),
photo: Yup.string().required('Required'), // photo: Yup.string().required('Required'),
}); });
}; };

7
src/Pages/Products/View/AddPage.tsx
View File

@ -11,6 +11,7 @@ import useNavigateOnSuccess from '../../../Hooks/useNavigateOnSuccess';
import { useAddProduct, useAddProductVariation } from '../../../api/product'; import { useAddProduct, useAddProductVariation } from '../../../api/product';
import VarianInfo from './VarianInfo'; import VarianInfo from './VarianInfo';
import { usePageState } from '../../../lib/state mangment/LayoutPagestate'; import { usePageState } from '../../../lib/state mangment/LayoutPagestate';
import AttributeInfo from './AttributeInfo';
const AddProductPage = () => { const AddProductPage = () => {
@ -109,6 +110,8 @@ const AddProductPage = () => {
<Tab ><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><BsInfoCircle size={20} /></span> <h6 className='SingleInfo'>{t("VarianInfo")}</h6></div></Tab> <Tab ><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><BsInfoCircle size={20} /></span> <h6 className='SingleInfo'>{t("VarianInfo")}</h6></div></Tab>
{/* <Tab ><div className='SignleDriverContainer'><span className='SignleDriverInfoIcon'><BsInfoCircle size={20} /></span> <h6 className='SingleInfo'>{t("AttributeInfo")}</h6></div></Tab> */}
</TabList> </TabList>
<TabBody > <TabBody >
@ -117,7 +120,9 @@ const AddProductPage = () => {
<TabBody > <TabBody >
<div className=" mt-4"><VarianInfo /></div> <div className=" mt-4"><VarianInfo /></div>
</TabBody> </TabBody>
<TabBody >
{/* <div className=" mt-4"><AttributeInfo /></div> */}
</TabBody>
</Tabs> </Tabs>
</ViewPage> </ViewPage>

34
src/Pages/Products/View/AttributeInfo.tsx Normal file
View File

@ -0,0 +1,34 @@
import React, { useEffect, useState } from 'react'
import { Col, Row } from 'reactstrap'
import ValidationField from '../../../Components/ValidationField/ValidationField'
import { useTranslation } from 'react-i18next';
import { useFormikContext } from 'formik';
import { toast } from 'react-toastify';
import { useGetCategories } from '../../../api/Categories';
import useFormatToSelect from '../../../Hooks/useFormatToSelect';
const AttributeInfo = ({ setIsValed, IsValed }: any) => {
const [t] = useTranslation();
const formikContext = useFormikContext();
const Selectdata = [
{ label: "color", value:"color"}]
return (
<Row xs={1} sm={1} md={1} lg={2} xl={2}>
<Col>
<ValidationField name="name_ar" />
<ValidationField name="name_en" />
</Col>
<Col>
<ValidationField name="name_de" />
<ValidationField name="type" type="Select" label='type' placeholder='type' option={Selectdata} />
</Col>
</Row>
)
}
export default AttributeInfo

1
src/Pages/Products/View/Edit/FormikTab/TabsContainer.tsx
View File

@ -19,6 +19,7 @@ export const TabsContainer: React.FC = () => {
// const [items, setItems] = useState<TabItem[]>([]); // const [items, setItems] = useState<TabItem[]>([]);
const [t] = useTranslation() const [t] = useTranslation()
const { setFieldValue } = useFormikContext(); const { setFieldValue } = useFormikContext();
const formikContext = useFormikContext<FormikValues>(); const formikContext = useFormikContext<FormikValues>();
const { values, handleChange } = formikContext; const { values, handleChange } = formikContext;

3
src/Pages/Products/View/FormikTab/TabsContainer.tsx
View File

@ -65,6 +65,9 @@ export const TabsContainer: React.FC = () => {
const newActiveKey = newItems.length ? newItems[newItems.length - 1].key : '1'; const newActiveKey = newItems.length ? newItems[newItems.length - 1].key : '1';
setItems(newItems); setItems(newItems);
setActiveKey(newActiveKey); setActiveKey(newActiveKey);
setFieldValue(`variable.${targetKey}`, undefined);
setFieldValue(`info.${targetKey}`, undefined);
} else { } else {
toast.error("Cannot close the last tab"); toast.error("Cannot close the last tab");

3
src/Routes.tsx
View File

@ -16,8 +16,7 @@ import EditCategories from "./Pages/Categories/View/EditPage";
import ProductsPage from "./Pages/Products/ProductsPage"; import ProductsPage from "./Pages/Products/ProductsPage";
import AddProductPage from "./Pages/Products/View/AddPage"; import AddProductPage from "./Pages/Products/View/AddPage";
import EditProduct from "./Pages/Products/View/EditPage" import EditProduct from "./Pages/Products/View/EditPage";
;
import Order from "./Pages/order/view-one/Order"; import Order from "./Pages/order/view-one/Order";
import OrderPage from "./Pages/order/OrderPage"; import OrderPage from "./Pages/order/OrderPage";
import EditOrder from "./Pages/order/Edit/EditPage"; import EditOrder from "./Pages/order/Edit/EditPage";

4
src/api/attribute.ts
View File

@ -10,6 +10,7 @@ import useUpdateMutation from "./helper/useUpdateMutation";
const API = { const API = {
ADD: `attribute`, ADD: `attribute`,
GET_ALL: `attribute`, GET_ALL: `attribute`,
DELETE: `attribute`, DELETE: `attribute`,
UPDATE: `attribute`, UPDATE: `attribute`,
@ -19,9 +20,10 @@ const KEY = "ATTRIBUTE"
export const useGetAttribute = (params?:any) => useGetQueryPagination(KEY, API.GET_ALL,params); export const useGetAttribute = (params?:any) => useGetQueryPagination(KEY, API.GET_ALL,params);
export const useGetOneAttribute = (params?:any) => useGetOneQuery(KEY, API.GET_ALL,params); export const useGetOneAttribute = (params?:any) => useGetOneQuery(KEY, API.GET_ALL,params);
export const useGetSingleAttribute = (params?:any) => useGetSingleQuery(KEY, API.GET_ALL,params); export const useGetSingleAttribute = (params?:any,options?:any) => useGetSingleQuery(KEY, API.GET_ALL,params,options);
export const useAddAttribute = () => useAddMutation(KEY, API.ADD); export const useAddAttribute = () => useAddMutation(KEY, API.ADD);
export const useUpdateAttribute = () => useUpdateMutation(KEY, API.UPDATE); export const useUpdateAttribute = () => useUpdateMutation(KEY, API.UPDATE);
export const useUpdateAttributeStatus = () => useUpdateMutation(KEY, API.UPDATE); export const useUpdateAttributeStatus = () => useUpdateMutation(KEY, API.UPDATE);

30
src/api/attributeValue.ts Normal file
View File

@ -0,0 +1,30 @@
import useGetQueryPagination from "./helper/ueGetPagination";
import useAddMutation from "./helper/useAddMutation"
import useDeleteMutation from "./helper/useDeleteMutation"
import useGetOneQuery from "./helper/useGetOneQuery";
import useGetQuery from "./helper/useGetQuery"
import useGetSingleQuery from "./helper/useGetSingleQuery";
import useUpdateMutation from "./helper/useUpdateMutation";
const API = {
ADD: `attributeValue`,
GET_ALL: `attributeValue`,
DELETE: `attributeValue`,
UPDATE: `attributeValue`,
};
const KEY = "ATTRIBUTEVALUE"
export const useGetAttributeValue = (params?:any) => useGetQueryPagination(KEY, API.GET_ALL,params);
export const useGetOneAttributeValue = (params?:any) => useGetOneQuery(KEY, API.GET_ALL,params);
export const useGetSingleAttributeValue = (params?:any) => useGetSingleQuery(KEY, API.GET_ALL,params);
export const useAddAttributeValue = () => useAddMutation(KEY, API.ADD);
export const useUpdateAttributeValue = () => useUpdateMutation(KEY, API.UPDATE);
export const useUpdateAttributeValueStatus = () => useUpdateMutation(KEY, API.UPDATE);
export const useDeleteAttributeValue = () =>useDeleteMutation(KEY, API.DELETE);

2
src/api/config.ts
View File

@ -9,7 +9,7 @@ export const ImageBaseURL = `https://hijabi-back-dev.point-dev.net`;
export const BaseURL_IMAGE = BaseURL.slice(0,-1); export const BaseURL_IMAGE = BaseURL.slice(0,-1);
const PROJECT_NAME = "E_TAXI" const PROJECT_NAME = "Hijab"
export const TOKEN_KEY = PROJECT_NAME + "_TOKEN" export const TOKEN_KEY = PROJECT_NAME + "_TOKEN"

55
src/api/dist/Account.js vendored Normal file
View File

@ -0,0 +1,55 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
exports.__esModule = true;
exports.useUpdateMyAccount = exports.getDataToSend = exports.useDeleteAccount = exports.useChangePassword = exports.useUpdateAccount = exports.useAddAccount = exports.useUpdateWallet = exports.useGetWallet = exports.useGetAccounts = void 0;
var RoleConfige_1 = require("../config/RoleConfige");
var buildFormData_1 = require("./helper/buildFormData");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetQuery_1 = require("./helper/useGetQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
GET: "/api/admin/account/all",
GET_ALL_PER: "/api/admin/role/all-permissions",
GET_ALL_ROLE: "/api/admin/role/all",
ADD: "/api/admin/account/create",
GETWALLET: "/api/admin/account/get-wallet",
UPDATEWALLET: "/api/admin/account/add-to-wallet",
UPDATE: "/api/admin/account/update",
DELETE: "/api/admin/account/delete",
UPDATE_MY_ACCOUNT: "/api/admin/account/update-my-account",
UPDATE_PASSWORD: "/api/admin/account/change-password"
};
var KEY = "ADMINS";
var MY_ACCOUNT = "MY_ACCOUNT";
exports.useGetAccounts = function () { return useGetQuery_1["default"](MY_ACCOUNT, API.GET); };
exports.useGetWallet = function () { return useGetQuery_1["default"]("WALLET", API.GETWALLET); };
exports.useUpdateWallet = function () { return useAddMutation_1["default"]("WALLET", API.UPDATEWALLET); };
exports.useAddAccount = function () { return useAddMutation_1["default"](MY_ACCOUNT, API.ADD); };
exports.useUpdateAccount = function () { return useUpdateMutation_1["default"](MY_ACCOUNT, API.UPDATE); };
exports.useChangePassword = function () { return useUpdateMutation_1["default"](MY_ACCOUNT, API.UPDATE_PASSWORD); };
exports.useDeleteAccount = function () { return useDeleteMutation_1["default"](MY_ACCOUNT, API.DELETE); };
exports.getDataToSend = function (values, editMode, objectToEdit) {
var formData = new FormData();
var objectToSend = __assign(__assign({}, values), (editMode && { account_id: objectToEdit.id }));
if (editMode) {
delete objectToSend["password"];
delete objectToSend["password_confirmation"];
}
if (values.role !== RoleConfige_1.VENDOR) {
delete objectToSend["shop_id"];
}
buildFormData_1.buildFormData(formData, objectToSend);
return formData;
};
exports.useUpdateMyAccount = function () { return useUpdateMutation_1["default"](MY_ACCOUNT, API.UPDATE_MY_ACCOUNT); };

20
src/api/dist/Categories.js vendored Normal file
View File

@ -0,0 +1,20 @@
"use strict";
exports.__esModule = true;
exports.useDeleteCategories = exports.useUpdateCategories = exports.useAddCategories = exports.useGetOneCategories = exports.useGetCategories = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useUpdateMutationPut_1 = require("./helper/useUpdateMutationPut");
var API = {
ADD: "category",
GET_ALL: "category",
DELETE: "category",
UPDATE: "category"
};
var KEY = "CATEGORIES";
exports.useGetCategories = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneCategories = function () { return useGetOneQuery_1["default"](KEY, API.GET_ALL); };
exports.useAddCategories = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateCategories = function (method) { return useUpdateMutationPut_1["default"](KEY, API.UPDATE, method); };
exports.useDeleteCategories = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

20
src/api/dist/Coupon.js vendored Normal file
View File

@ -0,0 +1,20 @@
"use strict";
exports.__esModule = true;
exports.useDeleteCoupon = exports.useUpdateCoupon = exports.useAddCoupon = exports.useGetOneCoupon = exports.useGetCoupon = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "coupon",
GET_ALL: "coupon",
DELETE: "coupon",
UPDATE: "coupon"
};
var KEY = "COUPON";
exports.useGetCoupon = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneCoupon = function () { return useGetOneQuery_1["default"](KEY, API.GET_ALL); };
exports.useAddCoupon = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateCoupon = function (method) { return useUpdateMutation_1["default"](KEY, API.UPDATE, method); };
exports.useDeleteCoupon = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

20
src/api/dist/Slider.js vendored Normal file
View File

@ -0,0 +1,20 @@
"use strict";
exports.__esModule = true;
exports.useDeleteSlider = exports.useUpdateSlider = exports.useAddSlider = exports.useGetOneSlider = exports.useGetSlider = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "slider",
GET_ALL: "slider",
DELETE: "slider",
UPDATE: "slider"
};
var KEY = "SLIDER";
exports.useGetSlider = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneSlider = function () { return useGetOneQuery_1["default"](KEY, API.GET_ALL); };
exports.useAddSlider = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateSlider = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useDeleteSlider = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

18
src/api/dist/appSetting.js vendored Normal file
View File

@ -0,0 +1,18 @@
"use strict";
exports.__esModule = true;
exports.useDeleteAppSetting = exports.useUpdateAppSetting = exports.useAddAppSetting = exports.useGetAppSetting = void 0;
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetQuery_1 = require("./helper/useGetQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "/api/admin/app-setting/create",
GET: "/api/admin/app-setting/all",
UPDATE: "api/admin/app-setting/update",
DELETE: "/api/admin/app-setting/delete"
};
var KEY = "APPSETTING";
exports.useGetAppSetting = function (params) { return useGetQuery_1["default"](KEY, API.GET, params); };
exports.useAddAppSetting = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateAppSetting = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useDeleteAppSetting = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

23
src/api/dist/attribute.js vendored Normal file
View File

@ -0,0 +1,23 @@
"use strict";
exports.__esModule = true;
exports.useDeleteAttribute = exports.useUpdateAttributeStatus = exports.useUpdateAttribute = exports.useAddAttribute = exports.useGetSingleAttribute = exports.useGetOneAttribute = exports.useGetAttribute = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useGetSingleQuery_1 = require("./helper/useGetSingleQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "attribute",
GET_ALL: "attribute",
DELETE: "attribute",
UPDATE: "attribute"
};
var KEY = "ATTRIBUTE";
exports.useGetAttribute = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneAttribute = function (params) { return useGetOneQuery_1["default"](KEY, API.GET_ALL, params); };
exports.useGetSingleAttribute = function (params) { return useGetSingleQuery_1["default"](KEY, API.GET_ALL, params); };
exports.useAddAttribute = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateAttribute = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useUpdateAttributeStatus = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useDeleteAttribute = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

10
src/api/dist/auth.js vendored Normal file
View File

@ -0,0 +1,10 @@
"use strict";
exports.__esModule = true;
exports.useLoginAdmin = void 0;
var useAddMutation_1 = require("./helper/useAddMutation");
var KEY = "AUTH";
var API = {
LOGIN: "admin/login",
LOGOUT: "/api/admin/logout"
};
exports.useLoginAdmin = function () { return useAddMutation_1["default"](KEY, API.LOGIN); };

12
src/api/dist/config.js vendored Normal file
View File

@ -0,0 +1,12 @@
"use strict";
exports.__esModule = true;
exports.USER_KEY = exports.TOKEN_KEY = exports.BaseURL_IMAGE = exports.ImageBaseURL = exports.BaseURL = void 0;
// export const BaseURL = `https://etaxiapi.rayantaxi.com/`;
// export const BaseURL = `https://etaxi.Point.net/`;
exports.BaseURL = "https://hijabi-back-dev.point-dev.net/api/";
exports.ImageBaseURL = "https://hijabi-back-dev.point-dev.net";
// export const BaseURL = `http://192.168.1.14:8000/`;
exports.BaseURL_IMAGE = exports.BaseURL.slice(0, -1);
var PROJECT_NAME = "Hijab";
exports.TOKEN_KEY = PROJECT_NAME + "_TOKEN";
exports.USER_KEY = PROJECT_NAME + "_USER";

24
src/api/dist/order.js vendored Normal file
View File

@ -0,0 +1,24 @@
"use strict";
exports.__esModule = true;
exports.useDeliveredOrder = exports.useDeliverOrder = exports.useCancelOrder = exports.useAcceptOrder = exports.useDeleteOrder = exports.useUpdateOrder = exports.useAddOrder = exports.useGetOneOrder = exports.useGetOrder = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "order",
GET_ALL: "order",
DELETE: "order",
UPDATE: "order"
};
var KEY = "Order";
exports.useGetOrder = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneOrder = function (params) { return useGetOneQuery_1["default"](KEY, API.GET_ALL, params); };
exports.useAddOrder = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateOrder = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useDeleteOrder = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };
exports.useAcceptOrder = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useCancelOrder = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useDeliverOrder = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useDeliveredOrder = function () { return useAddMutation_1["default"](KEY, API.ADD); };

26
src/api/dist/product.js vendored Normal file
View File

@ -0,0 +1,26 @@
"use strict";
exports.__esModule = true;
exports.useDeleteProduct = exports.useUpdateProductStatus = exports.useUpdateProductVariation = exports.useUpdateProduct = exports.useAddProductVariation = exports.useAddProduct = exports.useGetOneProduct = exports.useGetProduct = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "baseProduct",
GET_ALL: "baseProduct",
DELETE: "baseProduct",
UPDATE: "baseProduct",
ADD_VAR: "product",
UPDATE_VAR: "product"
};
var KEY = "Product";
var ONEKEY = "OneProduct";
exports.useGetProduct = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneProduct = function (params) { return useGetOneQuery_1["default"](ONEKEY, API.GET_ALL, params); };
exports.useAddProduct = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useAddProductVariation = function () { return useAddMutation_1["default"](KEY, API.ADD_VAR); };
exports.useUpdateProduct = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useUpdateProductVariation = function () { return useUpdateMutation_1["default"](KEY, API.ADD_VAR); };
exports.useUpdateProductStatus = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useDeleteProduct = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

20
src/api/dist/users.js vendored Normal file
View File

@ -0,0 +1,20 @@
"use strict";
exports.__esModule = true;
exports.useDeleteUsers = exports.useUpdateUsers = exports.useAddUsers = exports.useGetOneUser = exports.useGetUsers = void 0;
var ueGetPagination_1 = require("./helper/ueGetPagination");
var useAddMutation_1 = require("./helper/useAddMutation");
var useDeleteMutation_1 = require("./helper/useDeleteMutation");
var useGetOneQuery_1 = require("./helper/useGetOneQuery");
var useUpdateMutation_1 = require("./helper/useUpdateMutation");
var API = {
ADD: "user",
GET_ALL: "user",
DELETE: "user",
UPDATE: "user"
};
var KEY = "User";
exports.useGetUsers = function (params) { return ueGetPagination_1["default"](KEY, API.GET_ALL, params); };
exports.useGetOneUser = function (params) { return useGetOneQuery_1["default"](KEY, API.GET_ALL, params); };
exports.useAddUsers = function () { return useAddMutation_1["default"](KEY, API.ADD); };
exports.useUpdateUsers = function () { return useUpdateMutation_1["default"](KEY, API.UPDATE); };
exports.useDeleteUsers = function () { return useDeleteMutation_1["default"](KEY, API.DELETE); };

40
src/api/helper/dist/AxiosBuilder.js vendored Normal file
View File

@ -0,0 +1,40 @@
"use strict";
exports.__esModule = true;
var axios_1 = require("axios");
var AxiosBuilder = /** @class */ (function () {
function AxiosBuilder() {
this.baseURL = '';
this.headers = {};
this.timeout = 60000; // Request failed with 60 second
this.withCreds = false;
this.responseType = 'json';
}
// Custom Another Props with Your Position
AxiosBuilder.prototype.withBaseURL = function (baseURL) {
this.baseURL = baseURL;
return this;
};
AxiosBuilder.prototype.withHeaders = function (headers) {
this.headers = headers;
return this;
};
AxiosBuilder.prototype.withTimeout = function (timeout) {
this.timeout = timeout;
return this;
};
AxiosBuilder.prototype.withResponseType = function (responseType) {
this.responseType = responseType;
return this;
};
AxiosBuilder.prototype.build = function () {
var config = {
baseURL: this.baseURL,
headers: this.headers,
timeout: this.timeout,
responseType: this.responseType
};
return axios_1["default"].create(config);
};
return AxiosBuilder;
}());
exports["default"] = AxiosBuilder;

61
src/api/helper/dist/Get.js vendored Normal file
View File

@ -0,0 +1,61 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var useAxios_1 = require("./useAxios");
function useGetQuery(key, url, params) {
var _this = this;
var axios = useAxios_1["default"]();
return react_query_1.useQuery(key, function () { return __awaiter(_this, void 0, void 0, function () {
var response;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.get(params ? url + params : url, params)];
case 1:
response = _a.sent();
return [2 /*return*/, response.data.data];
}
});
}); }, {
onError: function (error) {
console.error('An error occurred:', error);
},
refetchOnWindowFocus: false
});
}
exports["default"] = useGetQuery;

17
src/api/helper/dist/buildFormData.js vendored Normal file
View File

@ -0,0 +1,17 @@
"use strict";
exports.__esModule = true;
exports.buildFormData = void 0;
exports.buildFormData = function (formData, data, parentKey) {
if (data &&
typeof data === "object" &&
!(data instanceof Date) &&
!(data instanceof File)) {
Object.keys(data).forEach(function (key) {
exports.buildFormData(formData, data[key], parentKey ? parentKey + "[" + key + "]" : key);
});
}
else {
var value = data == null ? "" : data;
formData.append(parentKey, value);
}
};

84
src/api/helper/dist/ueGetPagination.js vendored Normal file
View File

@ -0,0 +1,84 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var useAxios_1 = require("./useAxios");
var react_router_dom_1 = require("react-router-dom");
var AuthState_1 = require("../../lib/state mangment/AuthState");
function useGetQueryPagination(KEY, Api, params, options) {
var _this = this;
var _a;
if (params === void 0) { params = {}; }
if (options === void 0) { options = {}; }
var axios = useAxios_1["default"]();
var location = react_router_dom_1.useLocation();
var pagination = (location === null || location === void 0 ? void 0 : location.search) || '';
// console.log(params);
var logout = AuthState_1["default"]().logout;
var language = (_a = localStorage.getItem("language")) !== null && _a !== void 0 ? _a : "en";
var navigate = react_router_dom_1.useNavigate();
return react_query_1.useQuery([KEY, pagination], function () { return __awaiter(_this, void 0, void 0, function () {
var response;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.get(Api + pagination, { params: params })];
case 1:
response = _a.sent();
return [2 /*return*/, response.data];
}
});
}); }, __assign({ onError: function (error) {
if (error.response.status == 401 || error.response.status == 403) {
logout();
navigate("/auth");
}
}, refetchOnWindowFocus: false }, options));
}
exports["default"] = useGetQueryPagination;
// export const useGetDynamic = (Api: string) => useGetQueryPagination(Api);

74
src/api/helper/dist/useAddMutation.js vendored Normal file
View File

@ -0,0 +1,74 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var react_toastify_1 = require("react-toastify");
var useAxios_1 = require("./useAxios");
var react_i18next_1 = require("react-i18next");
function useAddMutation(key, url) {
var _this = this;
var axios = useAxios_1["default"]();
var t = react_i18next_1.useTranslation()[0];
var queryClient = react_query_1.useQueryClient();
return react_query_1.useMutation(function (dataToSend) { return __awaiter(_this, void 0, void 0, function () {
var data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.post(url, dataToSend, {
headers: {
'Content-Type': 'multipart/form-data'
}
})];
case 1:
data = (_a.sent()).data;
return [2 /*return*/, data];
}
});
}); }, {
onSuccess: function (data) {
queryClient.invalidateQueries([key]);
react_toastify_1.toast.success(data.message || t("Add Successful"));
},
onError: function (error) {
var _a, _b;
var message = ((_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message) || t("failed_to_add_data");
react_toastify_1.toast.error(message);
}
});
}
exports["default"] = useAddMutation;

18
src/api/helper/dist/useAxios.js vendored Normal file
View File

@ -0,0 +1,18 @@
"use strict";
exports.__esModule = true;
var config_1 = require("../config");
var AuthState_1 = require("../../lib/state mangment/AuthState");
var AxiosBuilder_1 = require("./AxiosBuilder");
function useAxios() {
var _a = AuthState_1["default"](), isAuthenticated = _a.isAuthenticated, token = _a.token;
var buildAxios = new AxiosBuilder_1["default"]().
withBaseURL(config_1.BaseURL)
.withResponseType('json')
.withTimeout(120000)
.withHeaders({ "Content-Type": "application/json" });
if (isAuthenticated) {
buildAxios.withHeaders({ Authorization: 'Bearer ' + token });
}
return (buildAxios.build());
}
exports["default"] = useAxios;

79
src/api/helper/dist/useDeleteMutation.js vendored Normal file
View File

@ -0,0 +1,79 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var react_toastify_1 = require("react-toastify");
var useAxios_1 = require("./useAxios");
var react_i18next_1 = require("react-i18next");
function useDeleteMutation(key, url) {
var _this = this;
var axios = useAxios_1["default"]();
var queryClient = react_query_1.useQueryClient();
var t = react_i18next_1.useTranslation().t;
return react_query_1.useMutation(function (_a) {
var dataToSend = _a.dataToSend, id = _a.id;
return __awaiter(_this, void 0, void 0, function () {
var data;
return __generator(this, function (_b) {
switch (_b.label) {
case 0: return [4 /*yield*/, axios["delete"](url + "/" + id)];
case 1:
data = (_b.sent()).data;
return [2 /*return*/, __assign(__assign({}, data), { id: id, dataToSend: dataToSend })];
}
});
});
}, {
onSuccess: function (data) {
queryClient.invalidateQueries(key);
react_toastify_1.toast.success(t('deleted_successfully'));
}
});
}
exports["default"] = useDeleteMutation;

81
src/api/helper/dist/useGetOneQuery.js vendored Normal file
View File

@ -0,0 +1,81 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var useAxios_1 = require("./useAxios");
var AuthState_1 = require("../../lib/state mangment/AuthState");
var react_router_dom_1 = require("react-router-dom");
function useGetOneQuery(key, url, params, options) {
var _this = this;
var _a;
if (params === void 0) { params = {}; }
if (options === void 0) { options = {}; }
var axios = useAxios_1["default"]();
var logout = AuthState_1["default"]().logout;
var language = (_a = localStorage.getItem("language")) !== null && _a !== void 0 ? _a : "en";
var navigate = react_router_dom_1.useNavigate();
var id = react_router_dom_1.useParams().id;
return react_query_1.useQuery([id, key], function () { return __awaiter(_this, void 0, void 0, function () {
var response;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.get(url + "/" + id + ("?lang=" + language))];
case 1:
response = _a.sent();
return [2 /*return*/, response.data];
}
});
}); }, __assign({ onError: function (error) {
if (error.response.status == 401 || error.response.status == 403) {
logout();
navigate("/auth");
}
}, refetchOnWindowFocus: false }, options));
}
exports["default"] = useGetOneQuery;

81
src/api/helper/dist/useGetQuery.js vendored Normal file
View File

@ -0,0 +1,81 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var useAxios_1 = require("./useAxios");
var AuthState_1 = require("../../lib/state mangment/AuthState");
var react_router_dom_1 = require("react-router-dom");
function useGetQuery(key, url, params, options) {
var _this = this;
if (params === void 0) { params = {}; }
if (options === void 0) { options = {}; }
var axios = useAxios_1["default"]();
var logout = AuthState_1["default"]().logout;
var navigate = react_router_dom_1.useNavigate();
return react_query_1.useQuery(params ? [key, params] : key, function () { return __awaiter(_this, void 0, void 0, function () {
var response;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.get(url, { params: params })];
case 1:
response = _a.sent();
return [2 /*return*/, response.data.data];
}
});
}); }, __assign({ onError: function (error) {
console.log('====================================');
console.log(error.response.status);
console.log('====================================');
if (error.response.status == 401 || error.response.status == 403) {
logout();
navigate("/auth");
}
}, refetchOnWindowFocus: false }, options));
}
exports["default"] = useGetQuery;

81
src/api/helper/dist/useGetSingleQuery.js vendored Normal file
View File

@ -0,0 +1,81 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var useAxios_1 = require("./useAxios");
var AuthState_1 = require("../../lib/state mangment/AuthState");
var react_router_dom_1 = require("react-router-dom");
function useGetSingleQuery(key, url, params, options) {
var _this = this;
var _a;
if (params === void 0) { params = {}; }
if (options === void 0) { options = {}; }
var axios = useAxios_1["default"]();
var logout = AuthState_1["default"]().logout;
var language = (_a = localStorage.getItem("language")) !== null && _a !== void 0 ? _a : "en";
var navigate = react_router_dom_1.useNavigate();
var id = react_router_dom_1.useParams().id;
return react_query_1.useQuery([id, key, params === null || params === void 0 ? void 0 : params.id], function () { return __awaiter(_this, void 0, void 0, function () {
var response;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.get(url + "?" + (params === null || params === void 0 ? void 0 : params.name) + "=" + (params === null || params === void 0 ? void 0 : params.id) + ("?lang=" + language))];
case 1:
response = _a.sent();
return [2 /*return*/, response.data];
}
});
}); }, __assign({ onError: function (error) {
if (error.response.status == 401 || error.response.status == 403) {
logout();
navigate("/auth");
}
}, refetchOnWindowFocus: false }, options));
}
exports["default"] = useGetSingleQuery;

89
src/api/helper/dist/useToggleStatus.js vendored Normal file
View File

@ -0,0 +1,89 @@
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
exports.useToggleStatus = void 0;
var react_query_1 = require("react-query");
var react_toastify_1 = require("react-toastify");
var react_i18next_1 = require("react-i18next");
var useAxios_1 = require("./useAxios");
exports.useToggleStatus = function (key, url, object_id) {
var axios = useAxios_1["default"]();
var queryClient = react_query_1.useQueryClient();
var t = react_i18next_1.useTranslation()[0];
return react_query_1.useMutation(function (_a) {
var id = _a.id, new_status = _a.new_status;
return __awaiter(void 0, void 0, void 0, function () {
var data;
var _b;
return __generator(this, function (_c) {
switch (_c.label) {
case 0: return [4 /*yield*/, axios.post(url, (_b = {},
_b[object_id] = id,
_b.new_status = new_status,
_b))];
case 1:
data = (_c.sent()).data;
return [2 /*return*/, __assign(__assign({}, data), { id: id, new_status: new_status })];
}
});
});
}, {
onSuccess: function (_a) {
var message = _a.message, id = _a.id, new_status = _a.new_status;
react_toastify_1.toast.success(message || t("toggle_success"));
queryClient.invalidateQueries([key]);
},
onError: function (err) {
var _a, _b;
var message = ((_b = (_a = err === null || err === void 0 ? void 0 : err.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message) || t("toggle_failed");
react_toastify_1.toast.error(message);
// validateSession(err.response);
}
});
};

79
src/api/helper/dist/useUpdateMutation.js vendored Normal file
View File

@ -0,0 +1,79 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var react_toastify_1 = require("react-toastify");
var useAxios_1 = require("./useAxios");
var react_i18next_1 = require("react-i18next");
var react_router_dom_1 = require("react-router-dom");
var useUpdateMutation = function (key, url, toastMessage, method) {
if (toastMessage === void 0) { toastMessage = true; }
var axios = useAxios_1["default"]();
var queryClient = react_query_1.useQueryClient();
var t = react_i18next_1.useTranslation()[0];
var id = react_router_dom_1.useParams().id;
return react_query_1.useMutation(function (dataToSend) { return __awaiter(void 0, void 0, void 0, function () {
var data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.put(url + "/" + id, dataToSend, {
headers: {
'Content-Type': 'multipart/form-data'
}
})];
case 1:
data = (_a.sent()).data;
return [2 /*return*/, data];
}
});
}); }, {
onSuccess: function (data) {
if (toastMessage) {
react_toastify_1.toast.success(data.message || t("updated_successfully"));
}
queryClient.invalidateQueries([key]);
},
onError: function (err) {
var _a, _b;
var message = ((_b = (_a = err === null || err === void 0 ? void 0 : err.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message) || t("failed_to_update_data");
react_toastify_1.toast.error(message);
// validateSession(err.response);
}
});
};
exports["default"] = useUpdateMutation;

79
src/api/helper/dist/useUpdateMutationPut.js vendored Normal file
View File

@ -0,0 +1,79 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
var react_query_1 = require("react-query");
var react_toastify_1 = require("react-toastify");
var useAxios_1 = require("./useAxios");
var react_i18next_1 = require("react-i18next");
var react_router_dom_1 = require("react-router-dom");
var useUpdateMutationPost = function (key, url, toastMessage, method) {
if (toastMessage === void 0) { toastMessage = true; }
var axios = useAxios_1["default"]();
var queryClient = react_query_1.useQueryClient();
var t = react_i18next_1.useTranslation()[0];
var id = react_router_dom_1.useParams().id;
return react_query_1.useMutation(function (dataToSend) { return __awaiter(void 0, void 0, void 0, function () {
var data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, axios.post(url + "/" + id, dataToSend, {
headers: {
'Content-Type': 'multipart/form-data'
}
})];
case 1:
data = (_a.sent()).data;
return [2 /*return*/, data];
}
});
}); }, {
onSuccess: function (data) {
if (toastMessage) {
react_toastify_1.toast.success(data.message || t("updated_successfully"));
}
queryClient.invalidateQueries([key]);
},
onError: function (err) {
var _a, _b;
var message = ((_b = (_a = err === null || err === void 0 ? void 0 : err.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message) || t("failed_to_update_data");
react_toastify_1.toast.error(message);
// validateSession(err.response);
}
});
};
exports["default"] = useUpdateMutationPost;

93
src/api/helper/dist/useUploadWithProgress.js vendored Normal file
View File

@ -0,0 +1,93 @@
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
exports.__esModule = true;
exports.useUploadWithProgress = void 0;
var react_1 = require("react");
var react_query_1 = require("react-query");
var react_toastify_1 = require("react-toastify");
var useAxios_1 = require("./useAxios");
var react_i18next_1 = require("react-i18next");
exports.useUploadWithProgress = function (key, url) {
var axios = useAxios_1["default"]();
var queryClient = react_query_1.useQueryClient();
var _a = react_1.useState(0.0), percentCompleted = _a[0], setPercentCompleted = _a[1];
var t = react_i18next_1.useTranslation().t;
var mutation = react_query_1.useMutation(function (dataToSend) { return __awaiter(void 0, void 0, void 0, function () {
var data;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
setPercentCompleted(0.0);
return [4 /*yield*/, axios.post(url, dataToSend, {
onUploadProgress: function (event) {
var _a;
console.log();
if ((_a = event === null || event === void 0 ? void 0 : event.event) === null || _a === void 0 ? void 0 : _a.lengthComputable) {
setPercentCompleted(Math.round((event.loaded * 100) / event.total));
}
}
})];
case 1:
data = (_a.sent()).data;
return [2 /*return*/, data];
}
});
}); }, {
onSuccess: function (_a) {
var data = _a.data;
react_toastify_1.toast.success(data.message || t("_messages.success.upload"));
queryClient.invalidateQueries([key]);
},
onError: function (err) {
var _a, _b;
var message = ((_b = (_a = err === null || err === void 0 ? void 0 : err.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message) || t("_messages.error.upload");
react_toastify_1.toast.error(message);
// validateSession(err.response);
}
});
return {
percentCompleted: percentCompleted,
value: percentCompleted,
mutate: mutation.mutate,
isLoading: mutation.isLoading,
isError: mutation.isError,
error: mutation.error,
isSuccess: mutation.isSuccess,
status: mutation.status
};
};

2
src/config/AppKey.ts
View File

@ -1,7 +1,7 @@
const PROJECT_NAME = "E_TAXI_DAHBOARD" const PROJECT_NAME = "Hijab_DAHBOARD"
export const TOKEN_KEY = PROJECT_NAME + "_TOKEN" export const TOKEN_KEY = PROJECT_NAME + "_TOKEN"
export const TOKEN_KEY_SOCKET = PROJECT_NAME + "_SOKCET_TOKEN" export const TOKEN_KEY_SOCKET = PROJECT_NAME + "_SOKCET_TOKEN"