This commit is contained in:
2024-05-25 00:19:29 +05:30
parent 9aaf5c4fec
commit 688844083e
7 changed files with 335 additions and 255 deletions

View File

@@ -142,6 +142,30 @@
);
}
.text-animate{
animation-name: text;
animation-duration: 4s;
animation-iteration-count: infinite;
}
@keyframes text {
0% {
color: #0B0B27;
/* margin-bottom: -40px; */
}
30% {
letter-spacing: 15px;
/* margin-bottom: -40px; */
}
85% {
letter-spacing: 8px;
/* margin-bottom: -40px; */
}
100% {
/* margin-bottom: 20px; */
}
}
.rotate{

View File

@@ -110,6 +110,17 @@ const AddBlogsAndArticles = () => {
});
reset();
navigate("/blogs-articles");
}else if(response?.error?.status === 500){
setIsLoading(false);
toast({
render: () => (
<ToastBox
status={"success"}
message={response?.error?.status?.error?.message}
/>
),
});
}
})
.catch((error) => {

View File

@@ -129,6 +129,7 @@ const EditBlogsAndArticles = () => {
updateBlog({ id: id, data: formData })
.then((response) => {
// Handle the response here
console.log("Mutation response:", response?.error?.status);
console.log("Mutation response:", response?.data?.statusCode);
console.log("Mutation response:", response?.data?.message);
console.log(response);
@@ -145,6 +146,17 @@ const EditBlogsAndArticles = () => {
});
reset();
navigate("/blogs-articles");
}else if(response?.error?.status === 500){
setIsLoading01(false);
toast({
render: () => (
<ToastBox
status={"success"}
message={response?.error?.status?.error?.message}
/>
),
});
}
})
.catch((error) => {
@@ -204,208 +216,6 @@ const EditBlogsAndArticles = () => {
<Box display={"flex"}>
<Box className="col-5 d-flex flex-column gap-2 pt-4">
{/* <span className="web-text-large fw-bold rubix-text-dark">
Author's Info
</span>
<span className="web-text-medium text-secondary">
Select the platform for which you need to create this campaign.
</span>
<Divider /> */}
<span className="web-text-large fw-bold rubix-text-dark">
Author's display profile
</span>
<span className="web-text-medium text-secondary mb-0">
Below is the profile that will be displayed on the community page.
</span>
<Box
boxSize="sm"
className="d-flex flex-column align-items-center gap-3 justify-content-center"
>
<Image
shadow={"md"}
rounded={8}
w={214}
h={240}
src={selectedImage}
alt="Selected Image"
/>
{selectedImage === fallbackImage ? (
""
) : (
<Box display={"flex"} flexDirection={"column"} w={"100%"}>
<span className="web-text-small">{smallImageData?.name}</span>
<span className="web-text-small text-secondary fst-italic">
{(smallImageData?.size / (1024 * 1024)).toFixed(2)} mb
</span>
</Box>
)}
<Button
onClick={() => setSelectedImage(fallbackImage)}
backgroundColor="red.400"
color={"whitesmoke"}
transition={"0.5s"}
_hover={{
backgroundColor: "red.500",
}}
size="xs"
>
Remove
</Button>
</Box>
</Box>
<Box className="col-7 pt-4 p-4">
<FormControl isRequired className="mb-3">
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Author name
</FormLabel>
<Input
{...register("author_name")}
placeholder="Name"
className="web-text-medium"
size="sm"
/>
{errors.name && (
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
<TiWarning className="fw-bold fs-5 " />{" "}
{errors.author_name.message}
</span>
)}
</FormControl>
<FormControl isRequired className="mb-3">
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Author designation
</FormLabel>
<Input
{...register("author_designation")}
placeholder="Author designation"
className="web-text-medium"
size="sm"
/>
{errors.author_designation && (
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
<TiWarning className="fw-bold fs-5 " />{" "}
{errors.author_designation.message}
</span>
)}
</FormControl>
<FormControl isRequired className="mb-3">
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Display profile
</FormLabel>
{/* <ImageDropBox /> */}
<Box
borderColor="gray.300"
borderStyle="dashed"
borderWidth="2px"
rounded="md"
shadow="sm"
role="group"
transition="all 150ms ease-in-out"
_hover={{
shadow: "md",
}}
as={motion.div}
initial="rest"
animate="rest"
whileHover="hover"
height={105}
className="pointer"
>
<Box position="relative" height="100%" width="100%">
<Box
position="absolute"
top="0"
left="0"
height="100%"
width="100%"
display="flex"
flexDirection="column"
>
<Stack
height="100%"
width="100%"
display="flex"
alignItems="center"
justify="center"
>
<span
className="d-flex flex-column align-items-center pointer"
spacing="1"
>
<Heading
fontSize="lg"
color="gray.700"
fontWeight="bold"
cursor={"pointer"}
>
Drop images here
</Heading>
<span
fontWeight="light"
className="web-text-large text-secondary text-center pointer"
>
or click to upload
</span>
</span>
</Stack>
</Box>
<Input
{...register("profile_image")}
type="file"
height="100%"
width="100%"
position="absolute"
top="0"
left="0"
opacity="0"
aria-hidden="true"
accept="image/*"
onChange={handleImageChange}
onDrop={handleImageChange}
// onDragEnter={startAnimation}
// onDragLeave={stopAnimation}
/>
</Box>
</Box>
{errors.profile_image && (
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
<TiWarning className="fw-bold fs-5 " />{" "}
{errors.profile_image.message}
</span>
)}
<FormHelperText className="web-text-small">
Maximum limit of image is 5mb.
</FormHelperText>
</FormControl>
<Box className=" d-flex justify-content-end">
<Button
isLoading={isLoading01}
spinner={<Loader01 />}
color={"whitesmoke"}
backgroundColor={"purple.900"}
_hover={{
backgroundColor: "purple.800",
}}
type="submit"
size="sm"
rounded={"sm"}
>
Save edit
</Button>
</Box>
</Box>
</Box>
<Divider />
<Box display={"flex"}>
<Box className="col-5 d-flex flex-column justify-content-between gap-2 pt-4">
<Box flexDirection={"column"} display={"flex"}>
@@ -434,7 +244,7 @@ const EditBlogsAndArticles = () => {
className="d-flex w-100 p-2 justify-content-center flex-column align-items-center gap-3"
>
{false ? (
<FormControl isRequired className="mb-3">
<FormControl className="mb-3">
{/* <FormLabel className="web-text-large fw-bold rubix-text-dark">
Display profile
</FormLabel> */}
@@ -686,7 +496,7 @@ const EditBlogsAndArticles = () => {
)}
</FormControl>
<FormControl isRequired>
<FormControl>
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Blog banner
</FormLabel>
@@ -779,6 +589,210 @@ const EditBlogsAndArticles = () => {
</FormControl>
</Box>
</Box>
<Divider />
<Box display={"flex"}>
<Box className="col-5 d-flex flex-column gap-2 pt-4">
{/* <span className="web-text-large fw-bold rubix-text-dark">
Author's Info
</span>
<span className="web-text-medium text-secondary">
Select the platform for which you need to create this campaign.
</span>
<Divider /> */}
<span className="web-text-large fw-bold rubix-text-dark">
Author's display profile
</span>
<span className="web-text-medium text-secondary mb-0">
Below is the profile that will be displayed on the community page.
</span>
<Box
boxSize="sm"
className="d-flex flex-column align-items-center gap-3 justify-content-center"
>
<Image
shadow={"md"}
rounded={8}
w={214}
h={240}
src={selectedImage}
alt="Selected Image"
/>
{selectedImage === fallbackImage ? (
""
) : (
<Box display={"flex"} flexDirection={"column"} w={"100%"}>
<span className="web-text-small">{smallImageData?.name}</span>
<span className="web-text-small text-secondary fst-italic">
{(smallImageData?.size / (1024 * 1024)).toFixed(2)} mb
</span>
</Box>
)}
<Button
onClick={() => setSelectedImage(fallbackImage)}
backgroundColor="red.400"
color={"whitesmoke"}
transition={"0.5s"}
_hover={{
backgroundColor: "red.500",
}}
size="xs"
>
Remove
</Button>
</Box>
</Box>
<Box className="col-7 pt-4 p-4">
<FormControl isRequired className="mb-3">
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Author name
</FormLabel>
<Input
{...register("author_name")}
placeholder="Name"
className="web-text-medium"
size="sm"
/>
{errors.name && (
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
<TiWarning className="fw-bold fs-5 " />{" "}
{errors.author_name.message}
</span>
)}
</FormControl>
<FormControl isRequired className="mb-3">
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Author designation
</FormLabel>
<Input
{...register("author_designation")}
placeholder="Author designation"
className="web-text-medium"
size="sm"
/>
{errors.author_designation && (
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
<TiWarning className="fw-bold fs-5 " />{" "}
{errors.author_designation.message}
</span>
)}
</FormControl>
<FormControl className="mb-3">
<FormLabel className="web-text-large fw-bold rubix-text-dark">
Display profile
</FormLabel>
{/* <ImageDropBox /> */}
<Box
borderColor="gray.300"
borderStyle="dashed"
borderWidth="2px"
rounded="md"
shadow="sm"
role="group"
transition="all 150ms ease-in-out"
_hover={{
shadow: "md",
}}
as={motion.div}
initial="rest"
animate="rest"
whileHover="hover"
height={105}
className="pointer"
>
<Box position="relative" height="100%" width="100%">
<Box
position="absolute"
top="0"
left="0"
height="100%"
width="100%"
display="flex"
flexDirection="column"
>
<Stack
height="100%"
width="100%"
display="flex"
alignItems="center"
justify="center"
>
<span
className="d-flex flex-column align-items-center pointer"
spacing="1"
>
<Heading
fontSize="lg"
color="gray.700"
fontWeight="bold"
cursor={"pointer"}
>
Drop images here
</Heading>
<span
fontWeight="light"
className="web-text-large text-secondary text-center pointer"
>
or click to upload
</span>
</span>
</Stack>
</Box>
<Input
{...register("profile_image")}
type="file"
height="100%"
width="100%"
position="absolute"
top="0"
left="0"
opacity="0"
aria-hidden="true"
accept="image/*"
onChange={handleImageChange}
onDrop={handleImageChange}
// onDragEnter={startAnimation}
// onDragLeave={stopAnimation}
/>
</Box>
</Box>
{errors.profile_image && (
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
<TiWarning className="fw-bold fs-5 " />{" "}
{errors.profile_image.message}
</span>
)}
<FormHelperText className="web-text-small">
Maximum limit of image is 5mb.
</FormHelperText>
</FormControl>
<Box className=" d-flex justify-content-end">
<Button
isLoading={isLoading01}
spinner={<Loader01 />}
color={"whitesmoke"}
backgroundColor={"purple.900"}
_hover={{
backgroundColor: "purple.800",
}}
type="submit"
size="sm"
rounded={"sm"}
>
Save edit
</Button>
</Box>
</Box>
</Box>
</form>
</Box>
);

View File

@@ -40,52 +40,6 @@ const ViewBlogsAndArticles = () => {
/>
<Box display={"flex"}>
<Box className="col-5 d-flex flex-column gap-2 pt-4">
<span className="web-text-large fw-bold rubix-text-dark">
Author's display profile
</span>
<span className="web-text-medium text-secondary mb-4">
Below is the profile that will be displayed on the community page.
</span>
<Box
className="d-flex w-100 justify-content-center flex-column align-items-center "
>
<Image
shadow={"md"}
rounded={8}
w={214}
h={240}
src={`https://rubix.betadelivery.com/${blog?.profile_image}`}
alt="Selected Image"
/>
</Box>
</Box>
<Box className="col-7 pt-4 p-4">
<Box className="mb-3">
<Box className="web-text-large fw-bold rubix-text-dark">
Author name
</Box>
<Box className="web-text-medium text-secondary">
{blog?.author_name}
</Box>
</Box>
<Box className="mb-3">
<Box className="web-text-large fw-bold rubix-text-dark">
Author designation
</Box>
<Box className="web-text-medium text-secondary">
{blog?.author_designation}
</Box>
</Box>
</Box>
</Box>
<Divider mt={50} />
<Box display={"flex"}>
<Box className="col-5 d-flex flex-column gap-2 pt-4">
<span className="web-text-large fw-bold rubix-text-dark">
@@ -219,6 +173,53 @@ const ViewBlogsAndArticles = () => {
</Box>
</Box>
<Divider/>
<Box display={"flex"} mb={6}>
<Box className="col-5 d-flex flex-column gap-2 pt-">
<span className="web-text-large fw-bold rubix-text-dark">
Author's display profile
</span>
<span className="web-text-medium text-secondary mb-4">
Below is the profile that will be displayed on the community page.
</span>
<Box
className="d-flex w-100 justify-content-center flex-column align-items-center "
>
<Image
shadow={"md"}
rounded={8}
w={214}
h={240}
src={`https://rubix.betadelivery.com/${blog?.profile_image}`}
alt="Selected Image"
/>
</Box>
</Box>
<Box className="col-7 pt-0 p-4">
<Box className="mb-3">
<Box className="web-text-large fw-bold rubix-text-dark">
Author name
</Box>
<Box className="web-text-medium text-secondary">
{blog?.author_name}
</Box>
</Box>
<Box className="mb-3">
<Box className="web-text-large fw-bold rubix-text-dark">
Author designation
</Box>
<Box className="web-text-medium text-secondary">
{blog?.author_designation}
</Box>
</Box>
</Box>
</Box>
</Box>
);

View File

@@ -118,7 +118,7 @@ const AddUseCase = () => {
createUsecase(formData)
.then((response) => {
// Handle the response here
console.log("Mutation response:", response?.data?.statusCode);
console.log("Mutation response:", response);
console.log("Mutation response:", response?.data?.message);
if (response?.data?.statusCode === 200) {
@@ -134,16 +134,18 @@ const AddUseCase = () => {
reset();
setIsLoading(false)
navigate("/usecase");
} else if (response?.data?.statusCode === 500) {
} else if(response?.error?.status === 500){
console.log(response?.error?.data?.error?.message);
setIsLoading(false);
toast({
render: () => (
<ToastBox
status={"success"}
message={response?.data?.message}
status={"error"}
message={response?.error?.data?.error?.message}
/>
),
});
}
})
.catch((error) => {

27
src/Pages/WelcomePage.jsx Normal file
View File

@@ -0,0 +1,27 @@
import { Box, Text } from '@chakra-ui/react'
import React from 'react'
const WelcomePage = () => {
return (
<Box
display={'flex'}
justifyContent={'center'}
alignItems={'center'}
w={"100%"}
h={'100%'}
// bgGradient='linear(to-l, #000000, #0B0B27)'
>
<Text className='text-animate'
// bgGradient='linear(to-l, #BB171C, #D01548)'
bgGradient='linear(to-l, #130f40, #FF0080)'
bgClip='text'
fontSize='8xl'
fontWeight='800'
>
Welcome to rubix
</Text>
</Box>
)
}
export default WelcomePage

View File

@@ -55,9 +55,10 @@ import ViewUseCase from "../Pages/Usecase/ViewUseCase";
import EditUseCase from "../Pages/Usecase/EditUseCase";
import Policy from "../Pages/Privacy/Privacy";
import Whitepapers from "../Pages/Whitepapers/Whitepapers";
import WelcomePage from "../Pages/WelcomePage";
export const RouteLink = [
{ path: "/", Component: UnderConstruction },
{ path: "/", Component: WelcomePage },
{ path: "/banner", Component: Banner },
{ path: "/help-and-support", Component: HelpAndSupport },