harsh-harlequin
harsh-harlequin4mo ago

how to send created by

"use client"; import { Box, TextField } from "@mui/material"; import { Create } from "@refinedev/mui"; import { useForm } from "@refinedev/react-hook-form"; import dynamic from "next/dynamic"; import { useState } from "react"; const MDEditor = dynamic(() => import("@uiw/react-md-editor"), { ssr: false }); export default function NewsCreate() { const { saveButtonProps, refineCore: { formLoading }, register, setValue, formState: { errors }, } = useForm({}); const [description, setDescription] = useState(""); return ( <Create isLoading={formLoading} saveButtonProps={saveButtonProps}> <Box component="form" sx={{ display: "flex", flexDirection: "column" }} autoComplete="off" > <TextField {...register("title", { required: "This field is required", })} error={!!(errors as any)?.title} helperText={(errors as any)?.title?.message} margin="normal" fullWidth InputLabelProps={{ shrink: true }} type="text" label={"Title"} name="title" /> <TextField {...register("sub_heading", { required: "This field is required", })} error={!!(errors as any)?.sub_heading} helperText={(errors as any)?.sub_heading?.message} margin="normal" fullWidth InputLabelProps={{ shrink: true }} multiline label={"Sub Heading"} name="sub_heading" /> <MDEditor value={description} onChange={(value) => { setDescription(value ""); // Ensure value is a string setValue("description", value ""); // Ensure value is a string }} data-color-mode="light" /> </Box> </Create> ); } here i want to make a field "created_by" and send the uuid of the user logged in
5 Replies
kapa.ai
kapa.ai4mo ago
Hi @Deepanshu Bajaj. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To add a "created_by" field and send the UUID of the logged-in user, you can modify the form submission handler to include this field. You can use the onFinish method provided by useForm to handle the form submission and add the "created_by" field before sending the data. Here's how you can do it: 1. Get the User UUID: Ensure you have a way to get the logged-in user's UUID. This can be done using an authentication provider or context. 2. Modify the Form Submission: Use the onFinish method to add the "created_by" field to the form data. Here's the updated code:
"use client";

import { Box, TextField } from "@mui/material";
import { Create } from "@refinedev/mui";
import { useForm } from "@refinedev/react-hook-form";
import dynamic from "next/dynamic";
import { useState } from "react";

const MDEditor = dynamic(() => import("@uiw/react-md-editor"), { ssr: false });

export default function NewsCreate() {
const {
saveButtonProps,
refineCore: { formLoading, onFinish },
register,
setValue,
formState: { errors },
} = useForm({});

const [description, setDescription] = useState("");

// Assuming you have a way to get the logged-in user's UUID
const userUUID = "user-uuid"; // Replace this with actual logic to get the user UUID

const handleSubmit = (data) => {
// Add the "created_by" field to the form data
const formData = {
...data,
created_by: userUUID,
};
onFinish(formData);
};
return (
<Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
<Box
component="form"
sx={{ display: "flex", flexDirection: "column" }}
autoComplete="off"
onSubmit={handleSubmit}
>
<TextField
{...register("title", {
required: "This field is required",
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
type="text"
label={"Title"}
name="title"
/>
<TextField
{...register("sub_heading", {
required: "This field is required",
})}
error={!!(errors as any)?.sub_heading}
helperText={(errors as any)?.sub_heading?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
multiline
label={"Sub Heading"}
name="sub_heading"
/>
<MDEditor
value={description}
onChange={(value) => {
setDescription(value || ""); // Ensure value is a string
setValue("description", value || ""); // Ensure value is a string
}}
data-color-mode="light"
/>
</Box>
</Create>
);
}
"use client";

import { Box, TextField } from "@mui/material";
import { Create } from "@refinedev/mui";
import { useForm } from "@refinedev/react-hook-form";
import dynamic from "next/dynamic";
import { useState } from "react";

const MDEditor = dynamic(() => import("@uiw/react-md-editor"), { ssr: false });

export default function NewsCreate() {
const {
saveButtonProps,
refineCore: { formLoading, onFinish },
register,
setValue,
formState: { errors },
} = useForm({});

const [description, setDescription] = useState("");

// Assuming you have a way to get the logged-in user's UUID
const userUUID = "user-uuid"; // Replace this with actual logic to get the user UUID

const handleSubmit = (data) => {
// Add the "created_by" field to the form data
const formData = {
...data,
created_by: userUUID,
};
onFinish(formData);
};
return (
<Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
<Box
component="form"
sx={{ display: "flex", flexDirection: "column" }}
autoComplete="off"
onSubmit={handleSubmit}
>
<TextField
{...register("title", {
required: "This field is required",
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
type="text"
label={"Title"}
name="title"
/>
<TextField
{...register("sub_heading", {
required: "This field is required",
})}
error={!!(errors as any)?.sub_heading}
helperText={(errors as any)?.sub_heading?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
multiline
label={"Sub Heading"}
name="sub_heading"
/>
<MDEditor
value={description}
onChange={(value) => {
setDescription(value || ""); // Ensure value is a string
setValue("description", value || ""); // Ensure value is a string
}}
data-color-mode="light"
/>
</Box>
</Create>
);
}
In this code: - The handleSubmit function is defined to add the "created_by" field to the form data. - The onFinish method is called with the modified form data. Make sure to replace the userUUID with the actual logic to get the logged-in user's UUID. For more details on handling form submissions and modifying requests, you can refer to the Refine documentation (https://refine.dev/docs/guides-concepts/forms/#server-side-validation-). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai4mo ago
<@661831547690680321> kapa.ai is still learning and improving, please let us know how it did by reacting below
harsh-harlequin
harsh-harlequinOP4mo ago
how to get the uuid of the user logged in @kapa.ai
kapa.ai
kapa.ai4mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- To get the UUID of the logged-in user, you can use the useGetIdentity hook provided by Refine. This hook retrieves the identity of the currently authenticated user. Here's how you can integrate it into your component: 1. Import the useGetIdentity Hook: Import the hook from @refinedev/core. 2. Use the Hook to Get User Information: Use the hook to get the user's identity, which includes the UUID. 3. Include the UUID in the Form Submission: Modify the form submission handler to include the "created_by" field with the user's UUID. Here's the updated code:
"use client";

import { Box, TextField } from "@mui/material";
import { Create } from "@refinedev/mui";
import { useForm } from "@refinedev/react-hook-form";
import dynamic from "next/dynamic";
import { useState } from "react";
import { useGetIdentity } from "@refinedev/core";

const MDEditor = dynamic(() => import("@uiw/react-md-editor"), { ssr: false });

export default function NewsCreate() {
const {
saveButtonProps,
refineCore: { formLoading, onFinish },
register,
setValue,
formState: { errors },
} = useForm({});

const [description, setDescription] = useState("");

// Use the useGetIdentity hook to get the logged-in user's information
const { data: user } = useGetIdentity();

const handleSubmit = (data) => {
// Add the "created_by" field to the form data
const formData = {
...data,
created_by: user?.uuid, // Assuming the UUID is stored in the "uuid" field
};
onFinish(formData);
};
return (
<Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
<Box
component="form"
sx={{ display: "flex", flexDirection: "column" }}
autoComplete="off"
onSubmit={handleSubmit}
>
<TextField
{...register("title", {
required: "This field is required",
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
type="text"
label={"Title"}
name="title"
/>
<TextField
{...register("sub_heading", {
required: "This field is required",
})}
error={!!(errors as any)?.sub_heading}
helperText={(errors as any)?.sub_heading?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
multiline
label={"Sub Heading"}
name="sub_heading"
/>
<MDEditor
value={description}
onChange={(value) => {
setDescription(value || ""); // Ensure value is a string
setValue("description", value || ""); // Ensure value is a string
}}
data-color-mode="light"
/>
</Box>
</Create>
);
}
"use client";

import { Box, TextField } from "@mui/material";
import { Create } from "@refinedev/mui";
import { useForm } from "@refinedev/react-hook-form";
import dynamic from "next/dynamic";
import { useState } from "react";
import { useGetIdentity } from "@refinedev/core";

const MDEditor = dynamic(() => import("@uiw/react-md-editor"), { ssr: false });

export default function NewsCreate() {
const {
saveButtonProps,
refineCore: { formLoading, onFinish },
register,
setValue,
formState: { errors },
} = useForm({});

const [description, setDescription] = useState("");

// Use the useGetIdentity hook to get the logged-in user's information
const { data: user } = useGetIdentity();

const handleSubmit = (data) => {
// Add the "created_by" field to the form data
const formData = {
...data,
created_by: user?.uuid, // Assuming the UUID is stored in the "uuid" field
};
onFinish(formData);
};
return (
<Create isLoading={formLoading} saveButtonProps={saveButtonProps}>
<Box
component="form"
sx={{ display: "flex", flexDirection: "column" }}
autoComplete="off"
onSubmit={handleSubmit}
>
<TextField
{...register("title", {
required: "This field is required",
})}
error={!!(errors as any)?.title}
helperText={(errors as any)?.title?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
type="text"
label={"Title"}
name="title"
/>
<TextField
{...register("sub_heading", {
required: "This field is required",
})}
error={!!(errors as any)?.sub_heading}
helperText={(errors as any)?.sub_heading?.message}
margin="normal"
fullWidth
InputLabelProps={{ shrink: true }}
multiline
label={"Sub Heading"}
name="sub_heading"
/>
<MDEditor
value={description}
onChange={(value) => {
setDescription(value || ""); // Ensure value is a string
setValue("description", value || ""); // Ensure value is a string
}}
data-color-mode="light"
/>
</Box>
</Create>
);
}
In this code: - The useGetIdentity hook is used to get the logged-in user's information. - The handleSubmit function includes the "created_by" field with the user's UUID in the form data. For more information on the useGetIdentity hook, you can refer to the Authentication Hooks (https://refine.dev/docs/guides-concepts/authentication/#auth-hooks) page. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai4mo ago
<@661831547690680321> kapa.ai is still learning and improving, please let us know how it did by reacting below