@@ -17970,127 +17970,6 @@ tsconfig.json
17970
17970
117: });
17971
17971
````
17972
17972
17973
- ## File: src/stories/components/Kontakt/ContactForm.stories.tsx
17974
- ````typescript
17975
- 1: import React from "react";
17976
- 2: import { Meta } from "@ladle/react";
17977
- 3: import ContactFormWithMocks from "./ContactFormWithMocks";
17978
- 4: import "@/app/globals.css";
17979
- 5: export default {
17980
- 6: title: "Kontakt/ContactForm",
17981
- 7: component: ContactFormWithMocks,
17982
- 8: } as Meta;
17983
- 9: // Default form view
17984
- 10: export const Default = () => <ContactFormWithMocks />;
17985
- 11: // Success response view
17986
- 12: export const SuccessResponse = () => (
17987
- 13: <div className="bg-slate-800 min-h-screen py-16">
17988
- 14: <ContactFormWithMocks initialResponse="Takk for din beskjed" />
17989
- 15: </div>
17990
- 16: );
17991
- 17: // Error response view
17992
- 18: export const ErrorResponse = () => (
17993
- 19: <div className="bg-slate-800 min-h-screen py-16">
17994
- 20: <ContactFormWithMocks initialResponse="Feil under sending av skjema" />
17995
- 21: </div>
17996
- 22: );
17997
- 23: // Simulated success on form submission
17998
- 24: export const SubmissionSuccess = () => (
17999
- 25: <div className="bg-slate-800 min-h-screen py-16">
18000
- 26: <ContactFormWithMocks simulateError={false} />
18001
- 27: <div className="mt-8 text-center text-gray-400">
18002
- 28: <p>(Note: Fill in the form and submit to see a success message)</p>
18003
- 29: </div>
18004
- 30: </div>
18005
- 31: );
18006
- 32: // Simulated error on form submission
18007
- 33: export const SubmissionError = () => (
18008
- 34: <div className="bg-slate-800 min-h-screen py-16">
18009
- 35: <ContactFormWithMocks simulateError={true} />
18010
- 36: <div className="mt-8 text-center text-gray-400">
18011
- 37: <p>(Note: Fill in the form and submit to see an error message)</p>
18012
- 38: </div>
18013
- 39: </div>
18014
- 40: );
18015
- 41: // Form in narrow container
18016
- 42: export const NarrowContainer = () => (
18017
- 43: <div className="bg-slate-800 min-h-screen py-16">
18018
- 44: <div className="max-w-md mx-auto">
18019
- 45: <ContactFormWithMocks />
18020
- 46: </div>
18021
- 47: </div>
18022
- 48: );
18023
- ````
18024
-
18025
- ## File: src/stories/components/Kontakt/ContactFormWithMocks.tsx
18026
- ````typescript
18027
- 1: import React from "react";
18028
- 2: import ContactForm from "@/components/Kontakt/ContactForm.component";
18029
- 3: import { FormData } from "@/components/Kontakt/config/formConfig";
18030
- 4: /**
18031
- 5: * Props for the ContactFormWithMocks story.
18032
- 6: */
18033
- 7: type StoryProps = {
18034
- 8: simulateError?: boolean;
18035
- 9: initialResponse?: string;
18036
- 10: };
18037
- 11: /**
18038
- 12: * A special version of ContactForm for stories.
18039
- 13: * This renders the actual ContactForm component but provides a mock
18040
- 14: * onSubmit handler to prevent real email submissions and simulate responses.
18041
- 15: */
18042
- 16: const ContactFormWithMocks: React.FC<StoryProps> = ({
18043
- 17: simulateError = false,
18044
- 18: initialResponse = "",
18045
- 19: }) => {
18046
- 20: /**
18047
- 21: * Simulated form submission that doesn't make any actual API calls.
18048
- 22: * It returns a promise that resolves to a message string, which ContactForm will use.
18049
- 23: */
18050
- 24: const mockOnSubmit = async (data: FormData): Promise<string> => {
18051
- 25: console.warn("Story mock: Form submitted with data:", data);
18052
- 26: // Simulate API call delay
18053
- 27: await new Promise((resolve) => setTimeout(resolve, 500));
18054
- 28: if (simulateError) {
18055
- 29: return "Feil under sending av skjema"; // Story mock: Simulate error
18056
- 30: } else {
18057
- 31: return "Takk for din beskjed"; // Story mock: Simulate success
18058
- 32: }
18059
- 33: };
18060
- 34: return (
18061
- 35: <ContactForm onSubmit={mockOnSubmit} initialResponse={initialResponse} />
18062
- 36: );
18063
- 37: };
18064
- 38: export default ContactFormWithMocks;
18065
- ````
18066
-
18067
- ## File: src/utils/eslint/package.json
18068
- ````json
18069
- 1: {
18070
- 2: "name": "eslint-plugin-test-rules",
18071
- 3: "version": "1.0.0",
18072
- 4: "description": "Custom ESLint rules for testing",
18073
- 5: "main": "dist/index.js",
18074
- 6: "scripts": {
18075
- 7: "build": "tsc",
18076
- 8: "test": "echo \"Error: no test specified\" && exit 1"
18077
- 9: },
18078
- 10: "keywords": [
18079
- 11: "eslint",
18080
- 12: "eslintplugin",
18081
- 13: "eslint-plugin"
18082
- 14: ],
18083
- 15: "author": "",
18084
- 16: "license": "ISC",
18085
- 17: "peerDependencies": {
18086
- 18: "eslint": ">=9.32.0"
18087
- 19: },
18088
- 20: "devDependencies": {
18089
- 21: "typescript": "^5.9.2"
18090
- 22: }
18091
- 23: }
18092
- ````
18093
-
18094
17973
## File: src/components/Kontakt/ContactForm.component.tsx
18095
17974
````typescript
18096
17975
1: "use client";
@@ -18231,6 +18110,127 @@ tsconfig.json
18231
18110
136: export default ContactForm;
18232
18111
````
18233
18112
18113
+ ## File: src/stories/components/Kontakt/ContactForm.stories.tsx
18114
+ ````typescript
18115
+ 1: import React from "react";
18116
+ 2: import { Meta } from "@ladle/react";
18117
+ 3: import ContactFormWithMocks from "./ContactFormWithMocks";
18118
+ 4: import "@/app/globals.css";
18119
+ 5: export default {
18120
+ 6: title: "Kontakt/ContactForm",
18121
+ 7: component: ContactFormWithMocks,
18122
+ 8: } as Meta;
18123
+ 9: // Default form view
18124
+ 10: export const Default = () => <ContactFormWithMocks />;
18125
+ 11: // Success response view
18126
+ 12: export const SuccessResponse = () => (
18127
+ 13: <div className="bg-slate-800 min-h-screen py-16">
18128
+ 14: <ContactFormWithMocks initialResponse="Takk for din beskjed" />
18129
+ 15: </div>
18130
+ 16: );
18131
+ 17: // Error response view
18132
+ 18: export const ErrorResponse = () => (
18133
+ 19: <div className="bg-slate-800 min-h-screen py-16">
18134
+ 20: <ContactFormWithMocks initialResponse="Feil under sending av skjema" />
18135
+ 21: </div>
18136
+ 22: );
18137
+ 23: // Simulated success on form submission
18138
+ 24: export const SubmissionSuccess = () => (
18139
+ 25: <div className="bg-slate-800 min-h-screen py-16">
18140
+ 26: <ContactFormWithMocks simulateError={false} />
18141
+ 27: <div className="mt-8 text-center text-gray-400">
18142
+ 28: <p>(Note: Fill in the form and submit to see a success message)</p>
18143
+ 29: </div>
18144
+ 30: </div>
18145
+ 31: );
18146
+ 32: // Simulated error on form submission
18147
+ 33: export const SubmissionError = () => (
18148
+ 34: <div className="bg-slate-800 min-h-screen py-16">
18149
+ 35: <ContactFormWithMocks simulateError={true} />
18150
+ 36: <div className="mt-8 text-center text-gray-400">
18151
+ 37: <p>(Note: Fill in the form and submit to see an error message)</p>
18152
+ 38: </div>
18153
+ 39: </div>
18154
+ 40: );
18155
+ 41: // Form in narrow container
18156
+ 42: export const NarrowContainer = () => (
18157
+ 43: <div className="bg-slate-800 min-h-screen py-16">
18158
+ 44: <div className="max-w-md mx-auto">
18159
+ 45: <ContactFormWithMocks />
18160
+ 46: </div>
18161
+ 47: </div>
18162
+ 48: );
18163
+ ````
18164
+
18165
+ ## File: src/stories/components/Kontakt/ContactFormWithMocks.tsx
18166
+ ````typescript
18167
+ 1: import React from "react";
18168
+ 2: import ContactForm from "@/components/Kontakt/ContactForm.component";
18169
+ 3: import { FormData } from "@/components/Kontakt/config/formConfig";
18170
+ 4: /**
18171
+ 5: * Props for the ContactFormWithMocks story.
18172
+ 6: */
18173
+ 7: type StoryProps = {
18174
+ 8: simulateError?: boolean;
18175
+ 9: initialResponse?: string;
18176
+ 10: };
18177
+ 11: /**
18178
+ 12: * A special version of ContactForm for stories.
18179
+ 13: * This renders the actual ContactForm component but provides a mock
18180
+ 14: * onSubmit handler to prevent real email submissions and simulate responses.
18181
+ 15: */
18182
+ 16: const ContactFormWithMocks: React.FC<StoryProps> = ({
18183
+ 17: simulateError = false,
18184
+ 18: initialResponse = "",
18185
+ 19: }) => {
18186
+ 20: /**
18187
+ 21: * Simulated form submission that doesn't make any actual API calls.
18188
+ 22: * It returns a promise that resolves to a message string, which ContactForm will use.
18189
+ 23: */
18190
+ 24: const mockOnSubmit = async (data: FormData): Promise<string> => {
18191
+ 25: console.warn("Story mock: Form submitted with data:", data);
18192
+ 26: // Simulate API call delay
18193
+ 27: await new Promise((resolve) => setTimeout(resolve, 500));
18194
+ 28: if (simulateError) {
18195
+ 29: return "Feil under sending av skjema"; // Story mock: Simulate error
18196
+ 30: } else {
18197
+ 31: return "Takk for din beskjed"; // Story mock: Simulate success
18198
+ 32: }
18199
+ 33: };
18200
+ 34: return (
18201
+ 35: <ContactForm onSubmit={mockOnSubmit} initialResponse={initialResponse} />
18202
+ 36: );
18203
+ 37: };
18204
+ 38: export default ContactFormWithMocks;
18205
+ ````
18206
+
18207
+ ## File: src/utils/eslint/package.json
18208
+ ````json
18209
+ 1: {
18210
+ 2: "name": "eslint-plugin-test-rules",
18211
+ 3: "version": "1.0.0",
18212
+ 4: "description": "Custom ESLint rules for testing",
18213
+ 5: "main": "dist/index.js",
18214
+ 6: "scripts": {
18215
+ 7: "build": "tsc",
18216
+ 8: "test": "echo \"Error: no test specified\" && exit 1"
18217
+ 9: },
18218
+ 10: "keywords": [
18219
+ 11: "eslint",
18220
+ 12: "eslintplugin",
18221
+ 13: "eslint-plugin"
18222
+ 14: ],
18223
+ 15: "author": "",
18224
+ 16: "license": "ISC",
18225
+ 17: "peerDependencies": {
18226
+ 18: "eslint": ">=9.32.0"
18227
+ 19: },
18228
+ 20: "devDependencies": {
18229
+ 21: "typescript": "^5.9.2"
18230
+ 22: }
18231
+ 23: }
18232
+ ````
18233
+
18234
18234
## File: studio/package.json
18235
18235
````json
18236
18236
1: {
@@ -18319,7 +18319,7 @@ tsconfig.json
18319
18319
44: "react": "^19.1.0",
18320
18320
45: "react-dom": "^19.1.0",
18321
18321
46: "react-error-boundary": "^5.0.0",
18322
- 47: "react-hook-form": "^7.61.1 ",
18322
+ 47: "react-hook-form": "^7.62.0 ",
18323
18323
48: "react-icons": "^5.5.0",
18324
18324
49: "sanity": "^4.2.0",
18325
18325
50: "sitemap": "^8.0.0",
0 commit comments