#73 copy sign in form from other branch and some renaming

handler.go

@@ -16,7 +16,9 @@ func getHandler(db *sql.DB) http.Handler {
 	// Serve static files (CSS, JS and images)
 	router.Handle("/static/", http.StripPrefix("/static/", http.FileServer(http.Dir("./static/"))))
 
-	router.HandleFunc("/app", service.App)
+	router.HandleFunc("/app", service.WorkoutPage)
+	router.HandleFunc("/auth/signin", service.SignInPage)
+	// router.HandleFunc("/auth/signup", service.SignUpPage)
 	router.HandleFunc("POST /api/workout", service.NewWorkout(db))
 	router.HandleFunc("GET /api/workout", service.GetWorkouts(db))
 	router.HandleFunc("DELETE /api/workout", service.DeleteWorkout(db))

service/auth.go

@@ -0,0 +1,18 @@
+package service
+
+import (
+	"net/http"
+
+	"me-fit/template"
+	"me-fit/template/auth"
+)
+
+func SignInPage(w http.ResponseWriter, r *http.Request) {
+	signIn := auth.SignIn()
+	template.Layout(signIn).Render(r.Context(), w)
+}
+
+// func SignUpPage(w http.ResponseWriter, r *http.Request) {
+// 	signIn := auth.SignUp()
+// 	template.Layout(signIn).Render(r.Context(), w)
+// }

service/static_ui.go

@@ -1,7 +1,7 @@
 package service
 
 import (
-	"me-fit/templates"
+	"me-fit/template"
 	"net/http"
 
 	"github.com/a-h/templ"
@@ -10,10 +10,10 @@ import (
 func HandleIndexAnd404(w http.ResponseWriter, r *http.Request) {
 	var comp templ.Component = nil
 	if r.URL.Path != "/" {
-		comp = templates.Layout(templates.NotFound())
+		comp = template.Layout(template.NotFound())
 		w.WriteHeader(http.StatusNotFound)
 	} else {
-		comp = templates.Layout(templates.Index())
+		comp = template.Layout(template.Index())
 	}
 
 	comp.Render(r.Context(), w)

service/workout.go

@@ -1,7 +1,7 @@
 package service
 
 import (
-	"me-fit/templates"
+	"me-fit/template"
 	"me-fit/utils"
 
 	"database/sql"
@@ -23,9 +23,9 @@ var (
 	)
 )
 
-func App(w http.ResponseWriter, r *http.Request) {
+func WorkoutPage(w http.ResponseWriter, r *http.Request) {
-	comp := templates.App()
+	comp := template.App()
-	layout := templates.Layout(comp)
+	layout := template.Layout(comp)
 	layout.Render(r.Context(), w)
 }
 

tailwind.config.js

@@ -1,6 +1,6 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-	content: ["./templates/**/*.templ"],
+	content: ["./template/**/*.templ"],
 	theme: {
 		extend: {},
 	},

template/app.templ

@@ -1,4 +1,4 @@
-package templates
+package template
 
 templ App() {
 	<main class="mx-2">

template/auth/sign_in.templ

@@ -0,0 +1,44 @@
+package auth
+
+templ SignIn() {
+	<form
+		class="max-w-xl px-2 mx-auto flex flex-col gap-4 h-full justify-center"
+	>
+		<h2 class="text-6xl mb-10">Sign In</h2>
+		<label class="input input-bordered flex items-center gap-2">
+			<!-- <svg -->
+			<!-- 	xmlns="http://www.w3.org/2000/svg" -->
+			<!-- 	viewBox="0 0 16 16" -->
+			<!-- 	fill="currentColor" -->
+			<!-- 	class="h-4 w-4 opacity-70" -->
+			<!-- > -->
+			<!-- 	<path -->
+			<!-- 		d="M2.5 3A1.5 1.5 0 0 0 1 4.5v.793c.026.009.051.02.076.032L7.674 8.51c.206.1.446.1.652 0l6.598-3.185A.755.755 0 0 1 15 5.293V4.5A1.5 1.5 0 0 0 13.5 3h-11Z" -->
+			<!-- 	></path> -->
+			<!-- 	<path -->
+			<!-- 		d="M15 6.954 8.978 9.86a2.25 2.25 0 0 1-1.956 0L1 6.954V11.5A1.5 1.5 0 0 0 2.5 13h11a1.5 1.5 0 0 0 1.5-1.5V6.954Z" -->
+			<!-- 	></path> -->
+			<!-- </svg> -->
+			<input type="text" class="grow" placeholder="Email" name="email"/>
+		</label>
+		<label class="input input-bordered flex items-center gap-2">
+			<!-- <svg -->
+			<!-- 	xmlns="http://www.w3.org/2000/svg" -->
+			<!-- 	viewBox="0 0 16 16" -->
+			<!-- 	fill="currentColor" -->
+			<!-- 	class="h-4 w-4 opacity-70" -->
+			<!-- > -->
+			<!-- 	<path -->
+			<!-- 		fill-rule="evenodd" -->
+			<!-- 		d="M14 6a4 4 0 0 1-4.899 3.899l-1.955 1.955a.5.5 0 0 1-.353.146H5v1.5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-2.293a.5.5 0 0 1 .146-.353l3.955-3.955A4 4 0 1 1 14 6Zm-4-2a.75.75 0 0 0 0 1.5.5.5 0 0 1 .5.5.75.75 0 0 0 1.5 0 2 2 0 0 0-2-2Z" -->
+			<!-- 		clip-rule="evenodd" -->
+			<!-- 	></path> -->
+			<!-- </svg> -->
+			<input type="password" class="grow" placeholder="Password" name="password"/>
+		</label>
+		<div class="flex justify-end items-center gap-2">
+			<a href="/auth/signup" class="link text-gray-500 text-sm">Don't have an account? Sign Up</a>
+			<button class="btn btn-primary self-end">Sign In</button>
+		</div>
+	</form>
+}

template/index.templ

@@ -1,4 +1,4 @@
-package templates
+package template
 
 templ Index() {
 	<div class="hero bg-base-200 h-full">

template/layout.templ

@@ -1,4 +1,4 @@
-package templates
+package template
 
 templ Layout(comp templ.Component) {
 	<!DOCTYPE html>
@@ -6,14 +6,21 @@ templ Layout(comp templ.Component) {
 		<head>
 			<meta charset="utf-8"/>
 			<title>ME-FIT</title>
-			<link rel="icon" href="static/favicon.svg"/>
+			<link rel="icon" href="/static/favicon.svg"/>
-			<link rel="stylesheet" href="static/css/tailwind.css"/>
+			<link rel="stylesheet" href="/static/css/tailwind.css"/>
 			<meta name="viewport" content="width=device-width, initial-scale=1"/>
 			<script defer src="https://umami.me-fit.eu/script.js" data-website-id="3c8efb09-44e4-4372-8a1e-c3bc675cd89a"></script>
 		</head>
 		<body>
 			<div class="h-screen flex flex-col">
-				@header()
+				<div class="flex justify-end items-center gap-2 py-1 px-2 md:gap-10 md:px-10 md:py-2 shadow">
+					<a href="/" class="flex-1 flex gap-2">
+						<img src="/static/favicon.svg" alt="ME-FIT logo"/>
+						<span>ME-FIT</span>
+					</a>
+					<a href="/auth/signup" class="btn btn-sm">Sign Up</a>
+					<a href="/auth/signin" class="btn btn-sm">Sign In</a>
+				</div>
 				<div class="flex-1">
 					if comp != nil {
 						@comp

template/not_found.templ

@@ -1,4 +1,4 @@
-package templates
+package template
 
 templ NotFound() {
 	<main class="flex h-full justify-center items-center ">

template/workout/workout.templ

@@ -0,0 +1,65 @@
+package workout
+
+templ Workout() {
+	<main class="mx-2">
+		<form
+			class="max-w-xl mx-auto flex flex-col gap-4 justify-center mt-10"
+		>
+			<h2 class="text-4xl mb-8">Track your workout</h2>
+			<input
+				id="date"
+				type="date"
+				class="input input-bordered"
+				value=""
+				name="date"
+			/>
+			<select class="select select-bordered w-full" name="type">
+				<option>Push Ups</option>
+				<option>Pull Ups</option>
+			</select>
+			<input
+				type="number"
+				class="input input-bordered"
+				placeholder="Sets"
+				name="sets"
+			/>
+			<input
+				type="number"
+				class="input input-bordered"
+				placeholder="Reps"
+				name="reps"
+			/>
+			<button class="btn btn-primary self-end">Save</button>
+		</form>
+		<!-- 	<div class="overflow-x-auto mx-auto max-w-screen-lg"> -->
+		<!-- 		<h2 class="text-4xl mt-14 mb-8">Workout history</h2> -->
+		<!-- 		<table class="table table-auto max-w-full"> -->
+		<!-- 			<thead> -->
+		<!-- 				<tr> -->
+		<!-- 					<th>Date</th> -->
+		<!-- 					<th>Type</th> -->
+		<!-- 					<th>Sets</th> -->
+		<!-- 					<th>Reps</th> -->
+		<!-- 					<th></th> -->
+		<!-- 				</tr> -->
+		<!-- 			</thead> -->
+		<!--  -->
+		<!-- 			<tbody> -->
+		<!-- 					<tr> -->
+		<!-- 						<th>{workout.date}</th> -->
+		<!-- 						<th>{workout.type}</th> -->
+		<!-- 						<th>{workout.sets}</th> -->
+		<!-- 						<th>{workout.reps}</th> -->
+		<!-- 						<th> -->
+		<!-- 							<div class="tooltip" data-tip="Delete Entry"> -->
+		<!-- 								<button on:click={() => deleteWorkout(workout.id)}> -->
+		<!-- 									<MdiDelete class="text-gray-400 text-lg"></MdiDelete> -->
+		<!-- 								</button> -->
+		<!-- 							</div> -->
+		<!-- 						</th> -->
+		<!-- 					</tr> -->
+		<!-- 			</tbody> -->
+		<!-- 	</table> -->
+		<!-- </div> -->
+	</main>
+}

templates/header.templ

@@ -1,12 +0,0 @@
-package templates
-
-templ header() {
-	<div class="flex justify-end items-center gap-2 py-1 px-2 md:gap-10 md:px-10 md:py-2 shadow">
-		<a href="/" class="flex-1 flex gap-2">
-			<img src="/static/favicon.svg" alt="ME-FIT logo"/>
-			<span>ME-FIT</span>
-		</a>
-		<a href="/signup" class="btn btn-sm">Sign Up</a>
-		<a href="/signin" class="btn btn-sm">Sign In</a>
-	</div>
-}

utils/auth.go

@@ -1,30 +1 @@
 package utils
-
-// import (
-// 	"context"
-// 	"log"
-// )
-
-// func VerifyToken(token string) (*auth.Token, error) {
-// 	if app == nil {
-// 		setup()
-// 	}
-//
-// 	client, err := app.Auth(context.Background())
-// 	if err != nil {
-// 		log.Fatalf("error getting Auth client: %v\n", err)
-// 	}
-// 	return client.VerifyIDToken(context.Background(), token)
-// }
-//
-// func setup() {
-// 	opt := option.WithCredentialsFile("./secrets/firebase.json")
-//
-// 	firebaseApp, err := firebase.NewApp(context.Background(), nil, opt)
-//
-// 	if err != nil {
-// 		log.Fatalf("error initializing app: %v", err)
-// 	}
-//
-// 	app = firebaseApp
-// }