-
+
イツヒマ
(アルファ版)
diff --git a/client/src/hooks.ts b/client/src/hooks.ts
index 346de1e..6f68f9c 100644
--- a/client/src/hooks.ts
+++ b/client/src/hooks.ts
@@ -1,5 +1,6 @@
import { useCallback, useEffect, useState } from "react";
import type { ZodType, ZodTypeDef } from "zod";
+import { API_ENDPOINT } from "./utils";
export function useData(
url: string | null,
@@ -48,3 +49,42 @@ export function useData(
return { data, loading, error, refetch: fetchData };
}
+
+export function useAuth(): { isAuthenticated: boolean | null } {
+ const [isAuthenticated, setIsAuthenticated] = useState(null);
+
+ useEffect(() => {
+ const controller = new AbortController();
+
+ const checkAuth = async () => {
+ try {
+ const res = await fetch(`${API_ENDPOINT}/projects/mine`, {
+ method: "GET",
+ credentials: "include",
+ signal: controller.signal,
+ });
+
+ if (res.ok) {
+ setIsAuthenticated(true);
+ } else if (res.status === 401 || res.status === 403) {
+ setIsAuthenticated(false);
+ } else {
+ setIsAuthenticated(false);
+ console.error(`Unexpected response: ${res.status} ${res.statusText}`);
+ }
+ } catch (err) {
+ if (err instanceof DOMException && err.name === "AbortError") {
+ return;
+ }
+ setIsAuthenticated(false);
+ console.error("Auth check failed:", err);
+ }
+ };
+
+ checkAuth();
+
+ return () => controller.abort();
+ }, []);
+
+ return { isAuthenticated };
+}
diff --git a/client/src/index.css b/client/src/index.css
index 2042bb6..bacc227 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -10,7 +10,8 @@
prefersdark: true; /* TODO: ダークモード対応 */
--color-primary: #0f82b1;
--color-primary-content: #ffffff;
- --color-secondary: #ff48a0;
+ --color-secondary: #a6e3d8;
+ --color-secondary-content: #065f52;
}
.btn {
diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
new file mode 100644
index 0000000..9b44473
--- /dev/null
+++ b/client/src/pages/Home.tsx
@@ -0,0 +1,166 @@
+import { HiOutlineCalendar, HiOutlineCog, HiOutlinePlus, HiOutlineUser, HiOutlineUsers } from "react-icons/hi";
+import { NavLink } from "react-router";
+import { type InvolvedProjects, involvedProjectsResSchema } from "../../../common/schema";
+import Header from "../components/Header";
+import { useData } from "../hooks";
+import { API_ENDPOINT } from "../utils";
+
+export default function HomePage() {
+ const { data: involvedProjects, loading } = useData(`${API_ENDPOINT}/projects/mine`, involvedProjectsResSchema);
+
+ return (
+ <>
+
+
+ );
+}
+
+function EmptyState() {
+ return (
+
+
+ );
+}
+
+function FeaturesSection() {
+ const features = [
+ {
+ icon: "🚫",
+ title: "候補日程の設定なし",
+ description: "みんなが空いている時間を選ぶだけなので、主催者が候補日程を設定する必要がありません。",
+ },
+ {
+ icon: "🔗",
+ title: "URLで簡単共有",
+ description: "作成したイベントのURLをコピーして友達に送れば、すぐに日程調整が可能です。",
+ },
+ {
+ icon: "📱",
+ title: "直感的な操作",
+ description: "複数日程も一気にドラッグで選択可能。スマホでも簡単に操作できます。",
+ },
+ ];
+
+ return (
+
+
+ );
+}
+
+function Footer() {
+ return (
+
+ );
+}
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index ca032a2..43b552e 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -173,7 +173,9 @@ export default function ProjectPage() {
) : (
イツヒマ
(アルファ版)
diff --git a/client/src/hooks.ts b/client/src/hooks.ts
index 346de1e..6f68f9c 100644
--- a/client/src/hooks.ts
+++ b/client/src/hooks.ts
@@ -1,5 +1,6 @@
import { useCallback, useEffect, useState } from "react";
import type { ZodType, ZodTypeDef } from "zod";
+import { API_ENDPOINT } from "./utils";
export function useData
+
+ ) : involvedProjects ? (
+
+
+
+
+
+ )}
+
+ );
+}
+
+function ProjectDashboard({ involvedProjects }: { involvedProjects: InvolvedProjects }) {
+ const sortedProjects = [...involvedProjects].sort((a, b) => {
+ if (a.isHost !== b.isHost) {
+ return a.isHost ? -1 : 1;
+ }
+ return new Date(b.startDate).getTime() - new Date(a.startDate).getTime();
+ });
+
+ return (
+
+
+ );
+}
+
+function ProjectCard({ project }: { project: InvolvedProjects[0] }) {
+ return (
+
+ {/* Hero Section */}
+
+
+
+
+
+
+ {involvedProjects.length > 0 ? (
+
+ 
+
+
+ イツヒマ
+「いつヒマ？」で日程調整しよう
+
+ {/* All Projects */}
+
+
+
+
+
+ ) : (
+
+
+
+ {sortedProjects.map((project) => (
+
+
+
+
+
+
+ e.stopPropagation()}
+ className="btn btn-ghost btn-sm px-3 py-1 text-gray-500 hover:text-gray-700 hover:bg-gray-100 transition-all"
+ >
+
+ )}
+
+
+
+
+
+ {project.isHost && (
+ {project.name}
+ + {project.isHost ? ( + <> +
+
+
+
+
+
+ );
+}
+
+// ---------- Utility ----------
+const formatDate = (isoDate: string) => {
+ const date = new Date(isoDate);
+ return date.toLocaleDateString("ja-JP");
+};
diff --git a/client/src/pages/Landing.tsx b/client/src/pages/Landing.tsx
new file mode 100644
index 0000000..6f1ea7f
--- /dev/null
+++ b/client/src/pages/Landing.tsx
@@ -0,0 +1,166 @@
+import { useEffect } from "react";
+import { NavLink, useNavigate } from "react-router";
+import Header from "../components/Header";
+import { useAuth } from "../hooks";
+
+export default function LandingPage() {
+ const navigate = useNavigate();
+ const { isAuthenticated } = useAuth();
+
+ useEffect(() => {
+ // If user is authenticated (has cookie), redirect to home
+ if (isAuthenticated === true) {
+ navigate("/home", { replace: true });
+ }
+ }, [isAuthenticated, navigate]);
+
+ if (isAuthenticated === null) {
+ return (
+ <>
+
+
+
+
+ まだイベントがありません
+イベントを作成して、日程調整を始めましょう
+
+
+
+ );
+ }
+
+ return (
+ <>
+
+
+
+
+
+
+ );
+}
+
+function HeroSection() {
+ return (
+
+
+
+
+ 「いつヒマ？」で
+
+ 今すぐイベントを作成
+
+
+
+ 「いつヒマ？」で
+ 日程調整しよう
+
+ + とりあえずみんなの空いている時間を訊いてから、何を何時間やるか決めたい。そんな仲間うちでの日程調整に最適なツールです。 +
+
+
+ 
+
+
+
+
+
+
+
+ イツヒマの特長
+仲間うちでのスムーズな日程調整に特化
+
+ {features.map((feature) => (
+
+
+
+ ))}
+ {feature.icon}
+ {feature.title}
+{feature.description}
+
-