diff --git a/components/RecordForm/FetchingErrorState.jsx b/components/RecordForm/FetchingErrorState.jsx
new file mode 100644
index 0000000..e7eef1c
--- /dev/null
+++ b/components/RecordForm/FetchingErrorState.jsx
@@ -0,0 +1,57 @@
+import {
+ VStack,
+ Image,
+ Heading,
+ Text,
+ Center,
+ Accordion,
+ AccordionButton,
+ AccordionItem,
+ AccordionIcon,
+ Box,
+ AccordionPanel,
+} from "@chakra-ui/react";
+
+export function FetchingErrorState({ errorMessage }) {
+ return (
+
+
+
+
+
+ Cannot check previos record
+
+ Try to reload the page
+
+
+
+ {errorMessage && (
+
+
+
+
+
+ System error message
+
+
+
+
+
+ {errorMessage}
+
+
+
+ )}
+
+ );
+}
diff --git a/components/RecordForm/RecordForm.jsx b/components/RecordForm/RecordForm.jsx
index feb6e17..5945e13 100644
--- a/components/RecordForm/RecordForm.jsx
+++ b/components/RecordForm/RecordForm.jsx
@@ -16,15 +16,23 @@ import { handleInstitution } from "handlers";
import { useRouter } from "next/navigation";
import { appendRecord } from "serverActions/appendRecord";
import { getLatestRecord } from "serverActions/getLatestRecord";
+import { FetchingErrorState } from "./FetchingErrorState";
export function RecordForm() {
const [isInstitutionOpen, setIsInstitutionOpen] = useState(false);
const [selectedInstitutionIndex, setSelectedInstitutionIndex] = useState(0);
+ const [errorState, setErrorState] = useState(false);
const router = useRouter();
const arrayName = "institutions";
const { control, ...form } = useForm({
- defaultValues: async () => getLatestRecord(),
+ defaultValues: async () => {
+ try {
+ await getLatestRecord();
+ } catch (error) {
+ setErrorState(error.stack);
+ }
+ },
});
const institutionsFieldArray = useFieldArray({
control,
@@ -90,6 +98,8 @@ export function RecordForm() {
)}
{form.formState.isLoading ? (
+ ) : errorState ? (
+
) : (
)}
+
{/* */}
);
diff --git a/components/RecordForm/docs.md b/components/RecordForm/docs.md
index 009f0a8..0d09fff 100644
--- a/components/RecordForm/docs.md
+++ b/components/RecordForm/docs.md
@@ -23,10 +23,14 @@ stateDiagram-v2
[*] --> loadingState
loadingState --> preFilled : fetched previousRecord
loadingState --> empty : fetched previousRecord == null
+loadingState --> errorFetching
preFilled --> openedInstitution : BUTTON_PRESS
empty --> openedInstitution : BUTTON_PRESS
openedInstitution --> empty : BUTTON_PRESS
openedInstitution --> preFilled : BUTTON_PRESS
+empty --> edited
+preFilled --> edited
+edited --> errorSubmitting
```
## See also
diff --git a/public/server-down.svg b/public/server-down.svg
new file mode 100644
index 0000000..1ca3754
--- /dev/null
+++ b/public/server-down.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/serverActions/getLatestRecord.js b/serverActions/getLatestRecord.js
index ddecc32..24450fb 100644
--- a/serverActions/getLatestRecord.js
+++ b/serverActions/getLatestRecord.js
@@ -35,6 +35,6 @@ export async function getLatestRecord() {
return initialValues;
} catch (error) {
- throw new Error("Error saving document:", error);
+ throw error;
}
}
diff --git a/utils/mongooseConnect.js b/utils/mongooseConnect.js
index 1d80703..28be661 100644
--- a/utils/mongooseConnect.js
+++ b/utils/mongooseConnect.js
@@ -1,12 +1,12 @@
import mongoose from "mongoose";
-const connect = async () => {
+async function connect() {
try {
await mongoose.connect(process.env.MONGO_URI);
console.log("Database connected!");
} catch (error) {
- throw new Error("Connection failed!");
+ throw ("MongooseConnect error:", error);
}
-};
+}
export default connect;