mirror of
https://github.com/hanzoai/next.js.git
synced 2026-10-30 14:46:38 +00:00
83c839dd92
This PR updates the with-plausible example for using the App Router. Here are the changes that have been made: - I renamed the `pages` folder and moved it to the `app` folder. - Added the layout.tsx file as part of the App Router. - Moved component folder into app folder. - Updated the package.json file. CC: @samcx --------- Co-authored-by: Sam Ko <[email protected]>
36 lines
731 B
TypeScript
36 lines
731 B
TypeScript
"use client";
|
|
|
|
import { FormEvent, useState } from "react";
|
|
import { usePlausible } from "next-plausible";
|
|
|
|
export default function Contact() {
|
|
const [message, setMessage] = useState("");
|
|
const plausible = usePlausible();
|
|
|
|
const handleSubmit = (e: FormEvent<HTMLFormElement>) => {
|
|
e.preventDefault();
|
|
|
|
plausible("customEventName", {
|
|
props: {
|
|
message,
|
|
},
|
|
});
|
|
|
|
// your own submit logic
|
|
setMessage("");
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<h1>This is the Contact page</h1>
|
|
<form onSubmit={handleSubmit}>
|
|
<label>
|
|
<span>Message:</span>
|
|
<textarea name="message" />
|
|
</label>
|
|
<button type="submit">submit</button>
|
|
</form>
|
|
</div>
|
|
);
|
|
}
|