No Error Showing But Elements are not rendering
Answered
rkstlohchab posted this in #help-forum
i tried shadcnUi form and passed data to schema of mongoose but the shadcnUI form gets hidden when refreshing the page
here are the files
@Anay-208
here are the files
@Anay-208
Answered by Anay-208
Here, set it to
const products = models?.Product || model("Product", productSchema);136 Replies
I’ll look into this when I get free
You can see how I’ve done in my recent pr
@Anay-208 i am using render field
and the page is also shown for one second when i refresh
but it disappears after that
i think it is maybe because of the cloudinary image upload
i am not handling the data by async
neh still not working after async await
@rkstlohchab Do you have a product.ts file?
Yupp
Wait i m sending
alright
@rkstlohchab Click to see attachment
Here, set it to
const products = models?.Product || model("Product", productSchema);Answer
@rkstlohchab hey it worked can you explain why we used optional(?) here and now it is showing this
The issue is fixed, right?
We are using optional, because
yupp
We are not sure whether the .Product exists or not
oh ohkyy
models.Product could be
undefinedAlso @rkstlohchab some suggestions, run
npm i server-onlyThen now on top of product.ts, and db.ts, and all files which include the use of database, add
import "server-only";And see if you get any errors
if you don't, then its good
@Anay-208 Here, set it to
ts
const products = models?.Product || model("Product", productSchema);
Mark this message as a solution
not working
@rkstlohchab not working
I think input type is string
it needs to be number
@Anay-208 I think input type is string
lemme check
Also, Why have you added
"use server" at the top?@Anay-208
So @rkstlohchab, there is 1 vulnerability with your code
Your database is being accessed from client side, rather then server side
So if you deploy it into production, your database can be compromised
I can help you resolve this vulnerability if you:
- Give me access to the project via Vscode share(I'll get to see the project files, and modify it) (recommend)
- Send the files like db.ts, and client side pages. (longer process)
- Give me access to the project via Vscode share(I'll get to see the project files, and modify it) (recommend)
- Send the files like db.ts, and client side pages. (longer process)
Just a min
sure brother
can you share port 3000 with me? there must be an optino
lemme check
no bro
@rkstlohchab you've messed up the api part
its basically not an api
@rkstlohchab no bro
there is no option to share port
Its basically a function that executes on client side
oh
can you try if you get the error now?
do you get any error now @rkstlohchab?
still getting error
So thats a different error, So now database operations will execute server side. I'll help you fix your file struc
okayy
Now try @rkstlohchab
once you fill fields with valid values
Try refreshing and see if price tab is working
not working
i dont see any reason why it should not work now
i shared localhost
with you
u can check
yepp
@Anay-208 oh yup, I can see now
it automatically shared after i restart server
there wasnt any option to share
ok, I'm seeing
I'm not sure about this, but I can apply a temporary fix
what
@Anay-208
So, the temporary fix would be to in zod types, add string for price
and you can convert to number when adding to db
yea it would work
I'll just give 1 last try as a fix
sure
@rkstlohchab fixed it using this: https://stackoverflow.com/questions/76536978/how-to-get-zod-to-read-input-as-number-and-not-text
you can check and everything is working, and 1 last thing, about Db operations
so basically, before you were doing Database operations. and I checked and realized the mongodb keys were being exposed to the client, since it wasn't running serverside
And you created a api route, but it wasn't acting as a api route, I guess you meant to create server actions
and you basically created a api route for it, and it wasn't acting as a api route, and you didn't even add
"use server" at the top, so database operations was basically running client sidei want to ask one last thing
how can i manage many product of different category easily
how can i manage many product of different category easily
@rkstlohchab i want to ask one last thing
how can i manage many product of different category easily
I'm not sure what you exactly mean. Can you elaborate further?
i am trying to create ecommerce app clone
so just like amazon
which has many subcategories like
electronics>mobile>company
and many more sub category
i want to ask a way to
create a schema that can handle
complex
sub categories
@rkstlohchab and many more sub category
or moreover how to use dynamic route for this
You can create routes like /app/[category]/page.tsx for frontend
and for schema, you can just create a collections
and for schema, you can just create a collections
category, and have stuff like:{
name: String
}i thought of this
that i should create different collection
and for products
{
...
category: categoryName
}but what would be the difference
if i created diff collection
and not just put category in
product
So basically, I didn't create different collection for categories in my recent projects, because the categories were
static.If you want it static, a new collection won't be needed
i want dynamic
So if you want dynamic, like you can create a new collection from the admin panel, you need to create a collection, otherwise you'll have hard time getting all categories
sure buddy
@Anay-208 Here, set it to
ts
const products = models?.Product || model("Product", productSchema);
Mark this message as a solution
Right Click > Apps > mark solution
umm @rkstlohchab did you lock this post?
lol i figured, i saw the post was locked and i was like wtf