Fixed form working with backend

.gitignore

@@ -2,6 +2,7 @@
 */__pycache__/
 
 *.pyc
+*.db
 
 # Logs
 logs

frontend/src/api.ts

 import axios from 'axios';
-import { Character } from './types';
+import { Character, CharacterCreate } from './types';
 
 const API_BASE = 'http://localhost:8000';
 
@@ -12,3 +12,8 @@ export async function damageCharacter(id: number): Promise<Character> {
   const response = await axios.post(`${API_BASE}/damage/${id}`);
   return response.data;
 }
+
+export async function addCharacter(data: CharacterCreate): Promise<Character> {
+  const response = await axios.post(`${API_BASE}/characters`, data=data);
+  return response.data;
+}

frontend/src/pages/FormPage.tsx

@@ -2,6 +2,7 @@ import { Container, Title } from '@mantine/core';
 
 import { useForm } from '@mantine/form';
 import { TextInput, NumberInput, Button, Box } from '@mantine/core';
+import { addCharacter } from '../api';
 
 function CharacterForm() {
   const form = useForm({
@@ -19,6 +20,8 @@ function CharacterForm() {
   const handleSubmit = (values: typeof form.values) => {
     console.log('Character data:', values);
     // you could pass this data to a parent or send to API, etc.
+
+    addCharacter({name: values.name, max_hp: values.hp})
   };
 
   return (

frontend/src/types.ts

 
 export interface Character {
-    id: number;
-    name: string;
-    max_hp: number;
-    current_hp: number;
-    is_dead: boolean;
-  }
+  id: number;
+  name: string;
+  max_hp: number;
+  current_hp: number;
+  is_dead: boolean;
+}
+
+export interface CharacterCreate {
+  name: string;
+  max_hp: number;
+}
   
\ No newline at end of file