In the process of developing an application that allows users to register shipments between different locations, I encountered a roadblock. Once a user creates a new shipment and saves it, they should be able to add goods to it. However, despite my efforts to structure the system in such a way that upon submitting the data to Supabase, it should return the ID which would then be used to route to the next page via Router.push, the routing does not seem to be working as expected.
Below is the code snippet for the handleSubmit function:
const router = useRouter()
const [id2, setId] = useState('')
const handleSubmit = async (e) => {
e.preventDefault()
if (!location_to_city || !location_to_country || !location_from_city || !location_from_country) {
setFormError('Please fill in all the fields correctly')
return
}
const { data, error } = await supabase
.from('shipment')
.insert([{ location_from_address_1, location_from_zipcode, location_from_city, location_from_country, location_to_address_1, location_to_zipcode, location_to_city, location_to_country, customs, excise, dangerous_goods, documents, documents_information, user_id: user.id }])
.select()
console.log(data)
setId(data.id)
console.log(id2)
if (error) {
console.log(error)
setFormError('Please fill in all the fields correctly')
}
if (data) {
setFormError(null)
}
router.push('/shipments/' + id2)
}
Upon entering this data, the console displays the following information:
active
:
true
created_at
:
"2022-12-23T10:40:13.783891+00:00"
customs
:
false
dangerous_goods
:
false
documents
:
false
documents_information
:
""
excise
:
false
id
:
81
location_from_address_1
:
""
location_from_city
:
"a"
location_from_country
:
"b"
location_from_zipcode
:
""
location_to_address_1
:
""
location_to_city
:
"c"
location_to_country
:
"d"
location_to_zipcode
:
""
user_id
:
"00063c91-f745-4a74-ba86-90603b84bed5"
However, despite obtaining the correct ID from the data, the URL does not reflect this when trying to route to the next page - it remains as "http://localhost:3000/shipments/". If anyone has any insights on how to successfully include the ID value in the url used by router.push, I would greatly appreciate your help!