Revamp work with TypeScript

.prettierignore

@@ -3,3 +3,4 @@ build
 coverage
 
 app/frontend/routes
+app/frontend/serializers

Gemfile.lock

@@ -523,7 +523,7 @@ GEM
       railties (>= 7.1.0)
     turbo_power (0.7.0)
       turbo-rails (>= 1.3.0)
-    typelizer (0.4.1)
+    typelizer (0.4.2)
       railties (>= 6.0.0)
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)

app/frontend/components/Header.tsx

@@ -3,7 +3,7 @@ import { usePage } from "@inertiajs/react";
 import { Menu, X } from "lucide-react";
 import { useState } from "react";
 
-import type { User } from "../serializers";
+import type { User } from "@/serializers";
 
 import { Logo } from "./Logo";
 

app/frontend/components/Layout.tsx

@@ -1,6 +1,6 @@
 import { usePage } from "@inertiajs/react";
 
-import type { User } from "../serializers";
+import type { User } from "@/serializers";
 
 import { Footer } from "./Footer";
 import { Header } from "./Header";

app/frontend/components/ReviewScores.tsx

@@ -1,5 +1,3 @@
-import type React from "react";
-
 interface ReviewScoresProps {
   scores: Record<string, number> | undefined;
 }
@@ -19,7 +17,7 @@ const scoreClass = (value: number) => {
   }
 };
 
-const ReviewScores: React.FC<ReviewScoresProps> = ({ scores }) => {
+const ReviewScores = ({ scores }: ReviewScoresProps) => {
   if (!scores || Object.keys(scores).length === 0) {
     return null;
   }

app/frontend/components/Select.tsx

@@ -1,4 +1,4 @@
-import type React from "react";
+import type { ChangeEvent } from "react";
 
 interface SelectOption {
   value: string;
@@ -8,20 +8,20 @@ interface SelectOption {
 interface SelectProps {
   id: string;
   value: string;
-  onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
+  onChange: (e: ChangeEvent<HTMLSelectElement>) => void;
   options: SelectOption[];
   required?: boolean;
   placeholder?: string;
 }
 
-const Select: React.FC<SelectProps> = ({
+const Select = ({
   id,
   value,
   onChange,
   options,
   required,
   placeholder,
-}) => {
+}: SelectProps) => {
   return (
     <div className="relative">
       <select

app/frontend/components/StarRating.tsx

@@ -1,5 +1,4 @@
 import { Star } from "lucide-react";
-import type React from "react";
 import { useState } from "react";
 
 interface StarRatingProps {
@@ -11,14 +10,14 @@ interface StarRatingProps {
   readonly?: boolean;
 }
 
-const StarRating: React.FC<StarRatingProps> = ({
+const StarRating = ({
   value,
   name,
   onChange,
   label,
   required,
   readonly,
-}) => {
+}: StarRatingProps) => {
   const [hoverRating, setHoverRating] = useState(0);
 
   const handleStarClick = (rating: number) => {

app/frontend/components/StatusBadge.tsx

@@ -1,5 +1,3 @@
-import type React from "react";
-
 type ProposalStatus =
   | "draft"
   | "submitted"
@@ -14,7 +12,7 @@ interface StatusBadgeProps {
   status: ProposalStatus;
 }
 
-const StatusBadge: React.FC<StatusBadgeProps> = ({ status }) => {
+const StatusBadge = ({ status }: StatusBadgeProps) => {
   let badgeClasses = "badge ";
   let statusText = "";
 

app/frontend/components/TextAreaWithCounter.tsx

@@ -1,4 +1,4 @@
-import type React from "react";
+import type { ChangeEvent } from "react";
 
 interface TextAreaWithCounterProps {
   id: string;
@@ -9,21 +9,21 @@ interface TextAreaWithCounterProps {
   required?: boolean;
 }
 
-const TextAreaWithCounter: React.FC<TextAreaWithCounterProps> = ({
+const TextAreaWithCounter = ({
   id,
   value,
   onChange,
   maxLength,
   placeholder,
   required,
-}) => {
+}: TextAreaWithCounterProps) => {
   // Count line breaks as \r\n (2 characters) to match Ruby/Rails backend
   const lineBreaks = (value.match(/\n/g) ?? []).length;
   const characterCount = value.length + lineBreaks;
   const isNearLimit = characterCount >= maxLength * 0.8;
   const isAtLimit = characterCount >= maxLength;
 
-  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
+  const handleChange = (e: ChangeEvent<HTMLTextAreaElement>) => {
     const newValue = e.target.value;
     const newLineBreaks = (newValue.match(/\n/g) ?? []).length;
     const newCharacterCount = newValue.length + newLineBreaks;

app/frontend/icons/Google.tsx

@@ -1,8 +1,4 @@
-import type React from "react";
-
-const GoogleIcon: React.FC<{ className?: string }> = ({
-  className = "h-5 w-5",
-}) => (
+const GoogleIcon = ({ className = "h-5 w-5" }: { className?: string }) => (
   <svg className={className} viewBox="0 0 24 24" fill="currentColor">
     <path
       d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"

app/frontend/pages/evaluations/index.tsx

@@ -1,8 +1,8 @@
 import { router, usePage } from "@inertiajs/react";
 
-import Layout from "../../components/Layout";
-import type { Evaluation } from "../../serializers";
-import { formatDeadline } from "../../utils/dateHelpers";
+import Layout from "@/components/Layout";
+import type { Evaluation } from "@/serializers";
+import { formatDeadline } from "@/utils/dateHelpers";
 
 interface IndexProps {
   evaluations: Evaluation[];

app/frontend/pages/evaluations/results/index.tsx

@@ -10,14 +10,10 @@ import {
 import type { FormEvent } from "react";
 import { useState } from "react";
 
-import Layout from "../../../components/Layout";
-import ReviewScores from "../../../components/ReviewScores";
-import StatusBadge from "../../../components/StatusBadge";
-import type {
-  Evaluation,
-  EvaluationsProposal,
-  Review,
-} from "../../../serializers";
+import Layout from "@/components/Layout";
+import ReviewScores from "@/components/ReviewScores";
+import StatusBadge from "@/components/StatusBadge";
+import type { Evaluation, EvaluationsProposal, Review } from "@/serializers";
 
 interface IndexProps {
   evaluation: Evaluation;

app/frontend/pages/home/index.tsx

@@ -6,8 +6,8 @@ import {
   UsersIcon,
 } from "lucide-react";
 
-import Layout from "../../components/Layout";
-import { OAuthButtons } from "../../components/OAuthButtons";
+import Layout from "@/components/Layout";
+import { OAuthButtons } from "@/components/OAuthButtons";
 
 interface IndexProps {
   oauth_providers: string[];

app/frontend/pages/proposals/Form.tsx

@@ -3,10 +3,10 @@ import { AlertCircle, Save, SendIcon, Upload } from "lucide-react";
 import type { FormEvent } from "react";
 import { useRef, useState } from "react";
 
-import Select from "../../components/Select";
-import TextAreaWithCounter from "../../components/TextAreaWithCounter";
-import type { CFP, Proposal, SpeakerProfile } from "../../serializers";
-import type { AppPageProps } from "../../types/global";
+import Select from "@/components/Select";
+import TextAreaWithCounter from "@/components/TextAreaWithCounter";
+import type { CFP, Proposal, SpeakerProfile } from "@/serializers";
+import type { AppPageProps } from "@/types/global";
 
 interface FormProps {
   proposal: Proposal;
@@ -130,9 +130,9 @@ export default function Form({ proposal, speaker, cfp }: FormProps) {
                 onChange={(e) => setData("proposal.track", e.target.value)}
                 required={!canSaveDraft}
                 placeholder="Select a track"
-                options={Object.keys(cfp.tracks).map((track) => ({
-                  value: track,
-                  label: cfp.tracks[track],
+                options={Object.entries(cfp.tracks).map(([value, label]) => ({
+                  value,
+                  label,
                 }))}
               />
               {formErrors.track && (

app/frontend/pages/proposals/edit.tsx

@@ -1,8 +1,8 @@
 import { Link, usePage } from "@inertiajs/react";
 import { ArrowLeftIcon } from "lucide-react";
 
-import Layout from "../../components/Layout";
-import type { CFP, Proposal, SpeakerProfile } from "../../serializers";
+import Layout from "@/components/Layout";
+import type { CFP, Proposal, SpeakerProfile } from "@/serializers";
 
 import Form from "./Form";
 

app/frontend/pages/proposals/index.tsx

@@ -1,9 +1,9 @@
 import { Head, Link, router, usePage } from "@inertiajs/react";
 import { ArrowLeftIcon, PlusIcon } from "lucide-react";
 
-import Layout from "../../components/Layout";
-import StatusBadge from "../../components/StatusBadge";
-import type { Proposal } from "../../serializers";
+import Layout from "@/components/Layout";
+import StatusBadge from "@/components/StatusBadge";
+import type { Proposal } from "@/serializers";
 
 interface IndexProps {
   proposals: Proposal[];

app/frontend/pages/proposals/new.tsx

@@ -1,8 +1,8 @@
 import { Link, usePage } from "@inertiajs/react";
 import { ArrowLeftIcon } from "lucide-react";
 
-import Layout from "../../components/Layout";
-import type { CFP, Proposal, SpeakerProfile } from "../../serializers";
+import Layout from "@/components/Layout";
+import type { CFP, Proposal, SpeakerProfile } from "@/serializers";
 
 import Form from "./Form";
 

app/frontend/pages/proposals/show.tsx

@@ -1,9 +1,9 @@
 import { Link, router, usePage } from "@inertiajs/react";
 import { ArrowLeftIcon, PencilIcon, TrashIcon, UserIcon } from "lucide-react";
 
-import Layout from "../../components/Layout";
-import StatusBadge from "../../components/StatusBadge";
-import type { CFP, Proposal, SpeakerProfile } from "../../serializers";
+import Layout from "@/components/Layout";
+import StatusBadge from "@/components/StatusBadge";
+import type { CFP, Proposal, SpeakerProfile } from "@/serializers";
 
 interface ShowProps {
   proposal: Proposal;

app/frontend/pages/reviews/index.tsx

@@ -1,11 +1,11 @@
 import { Link, router, usePage } from "@inertiajs/react";
 import { AlertCircleIcon, ExternalLinkIcon } from "lucide-react";
 
-import Layout from "../../components/Layout";
-import ReviewScores from "../../components/ReviewScores";
-import StatusBadge from "../../components/StatusBadge";
-import type { Evaluation, Review } from "../../serializers";
-import { formatDeadline } from "../../utils/dateHelpers";
+import Layout from "@/components/Layout";
+import ReviewScores from "@/components/ReviewScores";
+import StatusBadge from "@/components/StatusBadge";
+import type { Evaluation, Review } from "@/serializers";
+import { formatDeadline } from "@/utils/dateHelpers";
 
 interface IndexProps {
   evaluation: Evaluation;

app/frontend/pages/reviews/show.tsx

@@ -3,10 +3,10 @@ import { AlertCircleIcon, ArrowLeftIcon, UserIcon } from "lucide-react";
 import type { FormEvent } from "react";
 import { useState } from "react";
 
-import Layout from "../../components/Layout";
-import StarRating from "../../components/StarRating";
-import TextAreaWithCounter from "../../components/TextAreaWithCounter";
-import type { Review } from "../../serializers";
+import Layout from "@/components/Layout";
+import StarRating from "@/components/StarRating";
+import TextAreaWithCounter from "@/components/TextAreaWithCounter";
+import type { Review } from "@/serializers";
 
 interface ShowProps {
   review: Review;

app/frontend/serializers/CFP.ts

@@ -1,11 +1,12 @@
-// Typelizer digest 35e85a86127d6efc1f4ff9955655a470
+// Typelizer digest 09b9a241cd6a6ab84c4bb9627df62a71
 //
 // DO NOT MODIFY: This file was automatically generated by Typelizer.
+import type {Proposal} from "@/serializers"
 
-interface CFP {
+type CFP = {
   id: string;
-  tracks: Record<string, string>;
-  field_names: Record<string, string> | undefined;
+  tracks: Record<Exclude<Proposal["track"], null>,string>;
+  field_names: Record<string,string> | undefined;
   is_closed: boolean;
 }
 

app/frontend/serializers/Evaluation.ts

@@ -1,11 +1,12 @@
-// Typelizer digest e9d5ef2cb9143459364b0747400c38e7
+// Typelizer digest f92f72437c59ca1bd3dc435237c17bac
 //
 // DO NOT MODIFY: This file was automatically generated by Typelizer.
+import type {Proposal} from "@/serializers"
 
-interface Evaluation {
+type Evaluation = {
   id: number;
   name: string;
-  tracks: ("oss" | "scale" | "general" | "workshop")[];
+  tracks: Exclude<Proposal["track"], null>[];
   criteria: string[];
   blind: boolean;
   personal: boolean;

app/frontend/serializers/EvaluationsProposal.ts

@@ -1,23 +1,16 @@
 // Typelizer digest 04b5629f2a3adfb2cd1236089c2e83bc
 //
 // DO NOT MODIFY: This file was automatically generated by Typelizer.
-import type { SpeakerProfile } from "../serializers";
+import type {SpeakerProfile} from "@/serializers"
 
-interface EvaluationsProposal {
+type EvaluationsProposal = {
   id: string;
   title: string | null;
   details: string | null;
   abstract: string | null;
   pitch: string | null;
   track: "oss" | "scale" | "general" | "workshop" | null;
-  status:
-    | "draft"
-    | "submitted"
-    | "accepted"
-    | "rejected"
-    | "waitlisted"
-    | "confirmed"
-    | "declined";
+  status: "draft" | "submitted" | "accepted" | "rejected" | "waitlisted" | "confirmed" | "declined";
   submitted_at: string | null;
   score: number;
   reviews_count: number;

app/frontend/serializers/Proposal.ts

@@ -2,22 +2,15 @@
 //
 // DO NOT MODIFY: This file was automatically generated by Typelizer.
 
-interface Proposal {
+type Proposal = {
   id: string;
   cfp_id: string | null;
   title: string | null;
   details: string | null;
   abstract: string | null;
   pitch: string | null;
   track: "oss" | "scale" | "general" | "workshop" | null;
-  status:
-    | "draft"
-    | "submitted"
-    | "accepted"
-    | "rejected"
-    | "waitlisted"
-    | "confirmed"
-    | "declined";
+  status: "draft" | "submitted" | "accepted" | "rejected" | "waitlisted" | "confirmed" | "declined";
   submitted_at: string | null;
   can_edit: boolean;
 }