Files
SSA-Admin-Panel/src/Pages/ManagePost/ManagePost.tsx
2025-03-06 13:16:38 +05:30

114 lines
3.0 KiB
TypeScript

import { Box, HStack, Image, Input, Span, Text } from "@chakra-ui/react";
import MainFrame from "../../components/MainFrame";
import { InputGroup } from "../../components/ui/input-group";
import { LuSearch } from "react-icons/lu";
import DataTable from "../../components/DataTable";
import AlertDailog from "../../components/AlertDailog";
import { Switch } from "../../components/ui/switch";
import img from "../../assets/waterfall.jpg";
// import { RiDeleteBin5Line } from "react-icons/ri";
import ViewDailog from "./ViewDailog";
import Delete from "../../components/ActionIcons/Delete";
// import ViewDailog from './ViewDailog'
// table data
const tableHeadRow = [
"Sr. No",
"Images",
"Description",
"Publish Data",
"Activate/Deactivate",
"Action",
];
const managepost: any[] = [
...Array.from({ length: 12 }, (_, i) => ({
"Sr. No": i + 1,
Images: (
// <Image w={50} src={img} />
<Image rounded={"lg"} w={100} h={50} src={img} />
),
Description: (
<Text>
{`Lorem ipsum dolor, sit amet consectetur adipisicing elit.}`.slice(
0,
30
) + "..."}
</Text>
),
"Publish Data": "12/01/2025",
"Activate/Deactivate": (
<Box w={"100%"}>
<Switch size={"sm"} colorPalette={"teal"} />
</Box>
),
Action: (
<HStack justifyContent="center">
<ViewDailog />
<AlertDailog
AltertTiggerIcon={() => <Span><Delete /> </Span>}
alertText="Delete Users"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
alertCaption="are you sure you want to delete ?"
onConfirm={() => {
console.log("User deleted:", i + 1);
}}
/>
</HStack>
),
})),
];
const ManagePost = () => {
return (
<MainFrame>
<Box>
<HStack
w={"100%"}
justifyContent={"space-between"}
mb={4}
py={0}
px={3}
>
<Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
{/* Manage Post */}
</Text>
<HStack>
<InputGroup
startElement={
<LuSearch
fontSize={"xs"}
style={{ position: "relative", left: "10px" }}
/>
}
color={"#000"}
>
<Input
p={3}
w={300}
bg={"#fff"}
colorPalette={"blue"}
_focus={{ border: "1px solid #02A0A0" }}
rounded={"md"}
size={"xs"}
fontSize={"sm"}
placeholder="Search..."
bgColor={"#EEEEEE"}
ps={8}
/>
</InputGroup>
</HStack>
</HStack>
<DataTable
sortableColumns={["Name", "Registration Date "]}
tableHeadRow={tableHeadRow}
data={managepost}
/>
</Box>
</MainFrame>
);
};
export default ManagePost;