fe: fix page size

backend/.env.example

@@ -0,0 +1,34 @@
+# Formwise - Environment Configuration Example
+
+# *** MongoDB Configuration ***
+# Provide a valid MongoDB connection string
+# For local development, you can use: mongodb://localhost:27017
+# For Atlas or other cloud providers, use their provided connection string
+MONGO_URI=mongodb+srv://<username>:<password>@cluster.mongodb.net/<database>?retryWrites=true&w=majority
+
+# *** Application Security ***
+# Use a strong, randomly generated secret for JWT
+# Recommendation: Use a tool like `openssl rand -hex 32` to generate
+JWT_SECRET=your_very_long_and_complex_random_secret_key_here
+
+# *** Google OAuth Configuration ***
+# Obtain these from the Google Cloud Console
+# https://console.cloud.google.com/apis/credentials
+GOOGLE_CLIENT_ID=your_google_oauth_client_id.apps.googleusercontent.com
+GOOGLE_CLIENT_SECRET=your_google_oauth_client_secret
+
+# *** Groq API Configuration ***
+# Obtain an API key from https://console.groq.com/keys
+GROQ_API_KEY=your_groq_api_key
+
+# *** LangChain Tracing (Optional) ***
+# Sign up at https://smith.langchain.com
+LANGCHAIN_API_KEY=your_langchain_api_key
+LANGCHAIN_ENDPOINT=https://api.smith.langchain.com
+LANGCHAIN_PROJECT=formwise
+LANGCHAIN_TRACING_V2=true
+
+# *** Observability (Optional) ***
+# Logfire token for additional monitoring
+# Remove or leave blank if not using
+LOGFIRE_TOKEN=

backend/pyproject.toml

@@ -1,7 +1,7 @@
 [project]
 name = "formwise"
 version = "0.1.0"
-description = "Add your description here"
+description = "A FastAPI backend for Formwise, enabling AI-powered form creation with Groq LLM."
 readme = "README.md"
 requires-python = ">=3.12"
 dependencies = [

frontend/.env.local.example

@@ -0,0 +1,2 @@
+# API URL
+NEXT_PUBLIC_API_URL="http://localhost:8000/api"

frontend/components/form/form-responses.tsx

@@ -24,8 +24,6 @@ import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { FORM_URLS } from "@/config/api-urls";
 import { tokenService } from "@/lib/services/token";
 import { formatDate, formatDateTime } from "@/lib/utils";
-import { SelectTrigger, SelectValue } from "@radix-ui/react-select";
-import { Select, SelectContent, SelectItem } from "../ui/select";
 
 // Define response type based on your API structure
 interface FormResponse {
@@ -44,7 +42,7 @@ export default function FormResponses({ form }: FormResponsesProps) {
   const [error, setError] = useState<string | null>(null);
   const [pagination, setPagination] = useState<PaginationState>({
     pageIndex: 0,
-    pageSize: 10,
+    pageSize: 10, // Fixed page size
   });
 
   // Fetch form responses
@@ -218,34 +216,7 @@ export default function FormResponses({ form }: FormResponsesProps) {
             <ScrollBar orientation="horizontal" />
           </ScrollArea>
 
-          <div className="flex items-center px-2">
-            {/* Rows per page selector */}
-            <div className="flex items-center space-x-2">
-              <span className="text-sm text-muted-foreground">
-                Rows per page
-              </span>
-              <Select
-                value={pagination.pageSize.toString()}
-                onValueChange={(value: string) =>
-                  setPagination((prev) => ({
-                    ...prev,
-                    pageSize: parseInt(value),
-                  }))
-                }
-              >
-                <SelectTrigger className="h-8 w-[70px] border">
-                  <SelectValue placeholder={pagination.pageSize} />
-                </SelectTrigger>
-                <SelectContent side="top">
-                  {[10, 30, 50].map((pageSize) => (
-                    <SelectItem key={pageSize} value={pageSize.toString()}>
-                      {pageSize}
-                    </SelectItem>
-                  ))}
-                </SelectContent>
-              </Select>
-            </div>
-
+          <div className="flex items-center justify-center px-2">
             {/* Pagination controls */}
             <div className="flex items-center space-x-2">
               <Button

frontend/lib/schemas.ts

@@ -1,6 +1,7 @@
 import { z } from "zod";
 import type { Form } from "@/types/form";
 import type { DateField, Field, NumberField } from "@/types/field";
+import { formatDate } from "@/lib/utils";
 
 // Base schemas
 const emailSchema = z
@@ -116,15 +117,17 @@ export function generateFormwiseSchema(form: Form) {
       case "date":
         fieldSchema = z.date();
         if ((field as DateField).min_date) {
+          const minDate = new Date((field as DateField).min_date!);
           fieldSchema = (fieldSchema as z.ZodDate).min(
-            new Date((field as DateField).min_date!),
-            "Date is too early"
+            minDate,
+            `Date must be on or after ${formatDate(minDate.toISOString())}`
           );
         }
         if ((field as DateField).max_date) {
+          const maxDate = new Date((field as DateField).max_date!);
           fieldSchema = (fieldSchema as z.ZodDate).max(
-            new Date((field as DateField).max_date!),
-            "Date is too late"
+            maxDate,
+            `Date must be on or before ${formatDate(maxDate.toISOString())}`
           );
         }
         break;