Skip to main content

CreateOrganizationForm

Form for creating new organizations with image upload and validation.
import { CreateOrganizationForm } from "@wacht/react-router";

export default function NewOrgPage() {
  return <CreateOrganizationForm />;
}

With Callbacks

import { CreateOrganizationForm } from "@wacht/react-router";
import { useNavigate } from "react-router";

export default function NewOrgPage() {
  const navigate = useNavigate();

  return (
    <CreateOrganizationForm
      onSuccess={() => navigate("/dashboard")}
      onCancel={() => navigate(-1)}
    />
  );
}

In a Dialog

import { CreateOrganizationForm } from "@wacht/react-router";
import { Dialog } from "@wacht/react-router";

export default function NewOrgDialog({ open, onClose }) {
  return (
    <Dialog isOpen={open} onClose={onClose}>
      <CreateOrganizationForm
        onSuccess={onClose}
        onCancel={onClose}
      />
    </Dialog>
  );
}

Form Fields

  • Organization Logo - Image upload (max 2MB, PNG/JPEG/GIF)
  • Organization Name - Required, 2-100 characters
  • Description - Optional, max 500 characters

Params

onSuccess
(organization?: any) => void
Callback called after successful creation.
onCancel
() => void
Callback called when user cancels.