diff --git a/src/components/ChatInterface.tsx b/src/components/ChatInterface.tsx
index 639797c..ae7c01b 100644
--- a/src/components/ChatInterface.tsx
+++ b/src/components/ChatInterface.tsx
@@ -6,6 +6,7 @@ import ChatSidebar from "./ChatSidebar";
import MobileHeader from "./MobileHeader";
import { useChatStore } from "../stores/chatStore";
import { useChatMigration } from "../hooks/useChatMigration";
+import Clock from "./Clock";
export default function ChatInterface() {
const [isLoading, setIsLoading] = useState(false);
@@ -146,6 +147,9 @@ export default function ChatInterface() {
{activeThread?.title}
+
+
+
diff --git a/src/components/Clock.tsx b/src/components/Clock.tsx
new file mode 100644
index 0000000..9160a72
--- /dev/null
+++ b/src/components/Clock.tsx
@@ -0,0 +1,56 @@
+import { useState, useEffect } from 'react';
+import { Clock as ClockIcon } from "lucide-react";
+
+interface ClockProps {
+ className?: string;
+}
+
+function Clock({ className }: ClockProps) {
+ const [currentTime, setCurrentTime] = useState(new Date());
+
+ useEffect(() => {
+ const interval = setInterval(() => {
+ setCurrentTime(new Date());
+ }, 1000);
+
+ return () => clearInterval(interval);
+ }, []);
+
+ const polishMonths = [
+ 'stycznia', 'lutego', 'marca', 'kwietnia', 'maja', 'czerwca',
+ 'lipca', 'sierpnia', 'września', 'października', 'listopada', 'grudnia'
+ ] as const;
+
+ const polishDays = [
+ 'niedziela', 'poniedziałek', 'wtorek', 'środa', 'czwartek', 'piątek', 'sobota'
+ ] as const;
+
+ const formatTime = (date: Date): string => {
+ return date.toLocaleTimeString('pl-PL', { hour12: false });
+ };
+
+ const formatDate = (date: Date): string => {
+ const day = polishDays[date.getDay()];
+ const dayNum = date.getDate();
+ const month = polishMonths[date.getMonth()];
+ const year = date.getFullYear();
+
+ return `${day}, ${dayNum} ${month} ${year}`;
+ };
+
+ return (
+
+
+
+
+ {formatTime(currentTime)}
+
+
+
+ {formatDate(currentTime)}
+
+
+ );
+}
+
+export default Clock;