From 734a0619d2a209f88638f3fb4508623796c0ec78 Mon Sep 17 00:00:00 2001
From: Falanger-debug <falanger27@gmail.com>
Date: Thu, 8 Jan 2026 19:49:47 +0100
Subject: [PATCH 1/3] =?UTF-8?q?co=C5=9B=20tam=20=C5=9Bmiga?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/api/history.ts                   |  33 +++
 .../components/HistoryStatusChangeDialog.vue  |   4 +-
 .../src/components/RecoveredHoursCard.vue     |   6 +-
 frontend/src/stores/history.ts                |  25 +++
 frontend/src/views/HistoryView.vue            | 204 +++++++++++-------
 5 files changed, 186 insertions(+), 86 deletions(-)
 create mode 100644 frontend/src/api/history.ts
 create mode 100644 frontend/src/stores/history.ts

diff --git a/frontend/src/api/history.ts b/frontend/src/api/history.ts
new file mode 100644
index 0000000..29182cd
--- /dev/null
+++ b/frontend/src/api/history.ts
@@ -0,0 +1,33 @@
+import { API_BASE_URL } from '@/api/config.ts'
+import type {DayStatus} from "@/api/dashboard.ts";
+
+export type SingleDayEntry = {
+  date: string;
+  dayOfWeek: string;
+  status: DayStatus;
+}
+
+export type HistoryData = {
+  addictionName: string
+  singleDayCost: number
+  totalSavings: number
+  totalHistory: SingleDayEntry[]
+};
+
+export async function fetchHistoryData(token?: string) {
+  const res = await fetch(`${API_BASE_URL}/api/progress`, {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json',
+      ...(token ? { 'Authorization': `Bearer ${token}` } : {})
+    }
+  });
+
+  if (!res.ok) {
+    const msg = await res.text();
+    throw new Error(msg || 'Failed to fetch history data');
+  }
+
+  return await res.json() as HistoryData;
+
+}
diff --git a/frontend/src/components/HistoryStatusChangeDialog.vue b/frontend/src/components/HistoryStatusChangeDialog.vue
index 730a6c1..345ec26 100644
--- a/frontend/src/components/HistoryStatusChangeDialog.vue
+++ b/frontend/src/components/HistoryStatusChangeDialog.vue
@@ -42,7 +42,7 @@ import { ref, watch } from 'vue';
 import Dialog from 'primevue/dialog';
 import SelectButton from 'primevue/selectbutton';
 
-type DayStatus = 'success' | 'relapse' | 'none';
+type DayStatus = 'success' | 'failure' | 'none';
 
 interface HistoryEntry {
   date: Date;
@@ -61,7 +61,7 @@ const internalEntry = ref<HistoryEntry>({ ...props.entry });
 const extendedStatusOptions = ref([
   { label: 'Sukces', value: 'success', icon: 'pi pi-check-circle' },
   { label: 'Brak', value: 'none', icon: 'pi pi-minus-circle' },
-  { label: 'Wpadka', value: 'relapse', icon: 'pi pi-exclamation-circle' }
+  { label: 'Wpadka', value: 'failure', icon: 'pi pi-exclamation-circle' }
 ]);
 
 watch(() => props.entry, (newVal) => {
diff --git a/frontend/src/components/RecoveredHoursCard.vue b/frontend/src/components/RecoveredHoursCard.vue
index 7b6f122..ede7378 100644
--- a/frontend/src/components/RecoveredHoursCard.vue
+++ b/frontend/src/components/RecoveredHoursCard.vue
@@ -8,12 +8,8 @@
 
     <div class="text-section ml-4 flex flex-column">
       <span class="label text-sm font-medium opacity-50 uppercase tracking-wide">
-        Zyskany czas życia
+        Odzyskaj Życie
       </span>
-      <div class="flex align-items-baseline gap-2">
-        <span class="value text-4xl font-semibold text-white">5</span>
-        <span class="unit text-lg opacity-80" style="color: var(--brand-cyan)">godzin</span>
-      </div>
     </div>
   </div>
 </template>
diff --git a/frontend/src/stores/history.ts b/frontend/src/stores/history.ts
new file mode 100644
index 0000000..0bf1a74
--- /dev/null
+++ b/frontend/src/stores/history.ts
@@ -0,0 +1,25 @@
+import {defineStore } from 'pinia';
+import {
+  fetchHistoryData, type HistoryData
+} from "@/api/history.ts";
+
+export const useHistoryStore = defineStore('history', {
+  state: () => ({
+    token: localStorage.getItem('token') as string | null,
+  }),
+
+  getters: {
+    isAuthenticated: (state) => !!state.token,
+  },
+
+  actions: {
+    async fetchHistory(): Promise<HistoryData> {
+      try {
+        return await fetchHistoryData(this.token ?? undefined);
+      } catch(e) {
+        console.error('Failed to fetch history data', e);
+        throw e;
+      }
+    }
+  }
+})
diff --git a/frontend/src/views/HistoryView.vue b/frontend/src/views/HistoryView.vue
index 1bec77f..fac01ef 100644
--- a/frontend/src/views/HistoryView.vue
+++ b/frontend/src/views/HistoryView.vue
@@ -9,7 +9,8 @@
             <header class="mb-6">
               <div class="flex flex-column">
                 <h1 class="text-2xl font-bold" style="color: var(--brand-cyan)">
-                  Świetnie Ci idzie, Janek!
+                  Świetnie Ci idzie walka z
+                  <span class="text-orange-400">{{addictionName}}!</span>
                 </h1>
               </div>
             </header>
@@ -19,13 +20,16 @@
               </h2>
               <div class="flex-1 flex align-items-center justify-content-center">
                 <Chart
+                  v-if="chartRawData.length > 0"
                   type="line"
-                  :data="chartData"
+                  :data="chartDataFormatted"
                   :options="chartOptions"
                   class="w-full h-20rem"
                 />
+                <div v-else>Ładowanie danych...</div>
               </div>
             </div>
+
             <HistoryStatusChangeDialog
               v-model:visible="showDialog"
               :entry="activeEntry"
@@ -33,6 +37,7 @@
               @save="saveEntry"
             />
           </div>
+
           <div class="flex flex-column flex-1 justify-content-between" style="max-width: 460px;">
             <div class="history-card">
               <DatePicker
@@ -60,20 +65,28 @@
 </template>
 
 <script setup lang="ts">
-import {onMounted, ref} from 'vue';
+import { onMounted, ref, computed } from 'vue';
 import AppHeader from '../components/AppHeader.vue';
 import DatePicker from 'primevue/datepicker';
 import Chart from 'primevue/chart';
 import HistoryStatusChangeDialog from "@/components/HistoryStatusChangeDialog.vue";
 import RecoveredHoursCard from "@/components/RecoveredHoursCard.vue";
+import type {HistoryData, SingleDayEntry} from "@/api/history.ts";
+import type { DayStatus } from "@/api/dashboard.ts";
+import { useHistoryStore } from "@/stores/history.ts";
 
-type DayStatus = 'success' | 'relapse' | 'none';
-
+// --- INTERFEJSY ---
 interface HistoryEntry {
   date: Date;
   status: DayStatus;
 }
 
+interface ChartEntry {
+  weekDay: string;
+  status: DayStatus;
+  currentSavings: number;
+}
+
 interface DatePickerSlotProps {
   day: number;
   month: number;
@@ -81,113 +94,146 @@ interface DatePickerSlotProps {
   today: boolean;
   selectable: boolean;
 }
+const addictionName = ref<string>('uzależnieniem');
+const dailyCost = ref<number>(0);
+const fullHistory = ref<HistoryEntry[]>([
+  { date: new Date(), status: 'success' },
+  { date: new Date(new Date().setDate(new Date().getDate() - 1)), status: 'success' },
+  { date: new Date(new Date().setDate(new Date().getDate() - 2)), status: 'failure' },
+  { date: new Date(new Date().setDate(new Date().getDate() - 3)), status: 'success' },
+  { date: new Date(new Date().setDate(new Date().getDate() - 5)), status: 'none' },
+  { date: new Date(new Date().setDate(new Date().getDate() - 10)), status: 'success' }
+]);
 
+const chartRawData = ref<ChartEntry[]>([
+  { weekDay: 'Pon', status: 'success', currentSavings: 15.5 },
+  { weekDay: 'Wt',  status: 'success', currentSavings: 31.0 },
+  { weekDay: 'Śr',  status: 'failure', currentSavings: 31.0 },
+  { weekDay: 'Czw', status: 'success', currentSavings: 46.5 },
+  { weekDay: 'Pt',  status: 'none',    currentSavings: 46.5 },
+  { weekDay: 'Sob', status: 'success', currentSavings: 62.0 },
+  { weekDay: 'Nd',  status: 'success', currentSavings: 77.5 }
+]);
 const today = ref<Date>(new Date());
 const selectedDate = ref<Date>(new Date());
 const showDialog = ref<boolean>(false);
 
-const historyLogs = ref<HistoryEntry[]>([
-  {date: new Date(2026, 0, 1), status: 'success'},
-  {date: new Date(2026, 0, 2), status: 'success'},
-  {date: new Date(2026, 0, 3), status: 'relapse'}
-]);
-
-const statusOptions = ref<{ label: string; value: DayStatus }[]>([
-  {label: 'Sukces', value: 'success'},
-  {label: 'Brak wpisu', value: 'none'},
-  {label: 'Wpadka', value: 'relapse'}
-]);
-
 const activeEntry = ref<HistoryEntry>({
   date: new Date(),
-  status: 'success',
+  status: 'success' as DayStatus,
 });
+const statusOptions = ref<{ label: string; value: DayStatus }[]>([
+  { label: 'Sukces', value: 'success' },
+  { label: 'Brak wpisu', value: 'none' },
+  { label: 'Wpadka', value: 'failure' }
+]);
+const historyStore = useHistoryStore();
 
-const getDateClass = (dateInfo: DatePickerSlotProps): string => {
-  const d = new Date(dateInfo.year, dateInfo.month, dateInfo.day);
-  const log = historyLogs.value.find(l => l.date.toDateString() === d.toDateString());
-  if (!log || log.status === 'none') return '';
-
-  return log.status === 'success' ? 'day-success' : 'day-relapse';
-};
-
-const handleDateSelect = (date: Date): void => {
-  const existingLog = historyLogs.value.find(l => l.date.toDateString() === date.toDateString());
-  activeEntry.value = existingLog ? {...existingLog} : {date: date, status: 'none'};
-  showDialog.value = true;
-};
+async function submit() {
+  try {
+    const payload: HistoryData = await historyStore.fetchHistory();
+    dailyCost.value = payload.singleDayCost;
+    addictionName.value = payload.addictionName;
+    const rawEntries = payload.totalHistory;
 
-const saveEntry = (updatedEntry: HistoryEntry): void => {
-  const index = historyLogs.value.findIndex(
-    (l) => l.date.toDateString() === updatedEntry.date.toDateString()
-  );
+    fullHistory.value = rawEntries.map((entry: SingleDayEntry) => ({
+      date: new Date(entry.date),
+      status: entry.status
+    }));
 
-  if (updatedEntry.status === 'none') {
-    if (index !== -1) {
-      historyLogs.value.splice(index, 1);
-    }
-  } else {
-    if (index !== -1) {
-      historyLogs.value[index] = {...updatedEntry};
-    } else {
-      historyLogs.value.push({...updatedEntry});
-    }
-  }
+    const tempChartData: ChartEntry[] = [];
+    let runningTotal = payload.totalSavings;
 
-  showDialog.value = false;
-  updateChartData();
-};
+    const last7Days = rawEntries.slice(0, 7);
 
+    for (const entry of last7Days) {
+      tempChartData.push({
+        weekDay: entry.dayOfWeek,
+        status: entry.status,
+        currentSavings: Number(runningTotal.toFixed(2))
+      });
 
-const chartData = ref();
-const chartOptions = ref();
+      if (entry.status === 'success') {
+        runningTotal -= dailyCost.value;
+      }
+    }
+    chartRawData.value = tempChartData.reverse();
 
-const updateChartData = () => {
-  const labels = ['Pon', 'Wt', 'Śr', 'Czw', 'Pt', 'Sob', 'Ndz'];
-  const savingsProgression = [30, 60, 90, 90, 120, 150, 180];
+  } catch (error) {
+    console.error('Błąd pobierania historii:', error);
+  }
+}
 
-  chartData.value = {
-    labels: labels,
+const chartDataFormatted = computed(() => {
+  return {
+    labels: chartRawData.value.map(d => d.weekDay),
     datasets: [
       {
         label: 'Suma zaoszczędzona',
-        data: savingsProgression,
+        data: chartRawData.value.map(d => d.currentSavings),
         fill: true,
-        borderColor: '#06b6d4', // var(--brand-cyan)
+        borderColor: '#06b6d4',
         tension: 0.4,
         backgroundColor: 'rgba(6, 182, 212, 0.2)',
-        pointBackgroundColor: '#4f46e5' // var(--brand-indigo)
+        pointBackgroundColor: '#4f46e5'
       }
     ]
   };
+});
 
-  chartOptions.value = {
-    maintainAspectRatio: false,
-    plugins: {
-      legend: {
-        display: false
-      }
-    },
-    scales: {
-      x: {
-        grid: {color: 'rgba(255,255,255,0.05)'},
-        ticks: {color: '#94a3b8'}
-      },
-      y: {
-        grid: {color: 'rgba(255,255,255,0.05)'},
-        ticks: {color: '#94a3b8'}
-      }
-    }
-  };
+const chartOptions = ref({
+  maintainAspectRatio: false,
+  plugins: { legend: { display: false } },
+  scales: {
+    x: { grid: { color: 'rgba(255,255,255,0.05)' }, ticks: { color: '#94a3b8' } },
+    y: { grid: { color: 'rgba(255,255,255,0.05)' }, ticks: { color: '#94a3b8' } }
+  }
+});
+
+// --- OBSŁUGA KALENDARZA ---
+const getDateClass = (dateInfo: DatePickerSlotProps): string => {
+  const d = new Date(dateInfo.year, dateInfo.month, dateInfo.day);
+  const log = fullHistory.value.find(l => l.date.toDateString() === d.toDateString());
+
+  if (!log) return '';
+
+  if (log.status === 'success') return 'day-success';
+  if (log.status === 'failure') return 'day-relapse';
+
+  return '';
+};
+const handleDateSelect = (date: Date): void => {
+  const existingLog = fullHistory.value.find(l => l.date.toDateString() === date.toDateString());
+  activeEntry.value = existingLog ? { ...existingLog } : { date: date, status: 'none' }; // 'none' nie ma w typach API, ale ok dla UI
+  showDialog.value = true;
+};
+
+const saveEntry = (updatedEntry: HistoryEntry): void => {
+  // Tutaj powinna być logika wysłania update'u do API
+  console.log("Zapisywanie (mock):", updatedEntry);
+
+  // Aktualizacja lokalna (optymistyczna)
+  const index = fullHistory.value.findIndex(
+    (l) => l.date.toDateString() === updatedEntry.date.toDateString()
+  );
+
+  if (index !== -1) {
+    fullHistory.value[index] = { ...updatedEntry };
+  } else {
+    fullHistory.value.push({ ...updatedEntry });
+  }
+
+  showDialog.value = false;
+  // Po zapisie warto by odświeżyć wykres (ponowne submit() lub przeliczenie lokalne)
 };
 
 onMounted(() => {
-  updateChartData();
+  submit(); // Wywołujemy pobieranie danych przy starcie
 });
 </script>
 
 <style scoped>
-
+/* Twój CSS pozostaje bez zmian */
 .calendar-day-cell {
   width: 2.8rem;
   height: 2.8rem;

From c5fe22a7d1c2c313dd769a92793a3d0cc8789a7f Mon Sep 17 00:00:00 2001
From: Falanger-debug <falanger27@gmail.com>
Date: Thu, 8 Jan 2026 22:07:11 +0100
Subject: [PATCH 2/3] feat: patch api dziala na postepach

---
 frontend/src/api/history.ts        | 20 +++++++++++++++-
 frontend/src/stores/history.ts     | 19 +++++++++++++--
 frontend/src/views/HistoryView.vue | 37 +++++++++++++-----------------
 3 files changed, 52 insertions(+), 24 deletions(-)

diff --git a/frontend/src/api/history.ts b/frontend/src/api/history.ts
index 29182cd..09658f3 100644
--- a/frontend/src/api/history.ts
+++ b/frontend/src/api/history.ts
@@ -11,7 +11,7 @@ export type HistoryData = {
   addictionName: string
   singleDayCost: number
   totalSavings: number
-  totalHistory: SingleDayEntry[]
+  entries: SingleDayEntry[]
 };
 
 export async function fetchHistoryData(token?: string) {
@@ -29,5 +29,23 @@ export async function fetchHistoryData(token?: string) {
   }
 
   return await res.json() as HistoryData;
+}
+
+export async function updateDayStatus(date: string, status: DayStatus, token?: string) {
+  const body = { status };
+
+  const res = await fetch(`${API_BASE_URL}/api/days/${date}`, {
+    method: 'PATCH',
+    headers: {
+      'Content-Type': 'application/json',
+      ...(token ? { 'Authorization': `Bearer ${token}` } : {})
+    },
+    body: JSON.stringify(body),
+  });
 
+  if (!res.ok) {
+    const msg = await res.text();
+    throw new Error(msg || 'Failed to update day status');
+  }
+  return await res.json()
 }
diff --git a/frontend/src/stores/history.ts b/frontend/src/stores/history.ts
index 0bf1a74..16f13eb 100644
--- a/frontend/src/stores/history.ts
+++ b/frontend/src/stores/history.ts
@@ -1,7 +1,11 @@
-import {defineStore } from 'pinia';
+import {defineStore} from 'pinia';
 import {
-  fetchHistoryData, type HistoryData
+  fetchHistoryData,
+  type HistoryData,
+  type SingleDayEntry,
+  updateDayStatus
 } from "@/api/history.ts";
+import type {DayStatus} from "@/api/dashboard.ts";
 
 export const useHistoryStore = defineStore('history', {
   state: () => ({
@@ -20,6 +24,17 @@ export const useHistoryStore = defineStore('history', {
         console.error('Failed to fetch history data', e);
         throw e;
       }
+    },
+
+    async updateStatus(date: string, status: DayStatus): Promise<SingleDayEntry> {
+      try {
+        return await updateDayStatus(date, status, this.token ?? undefined);
+      } catch (e) {
+        console.error(`Failed to update day status for day ${date}`, e);
+        throw e;
+      }
     }
   }
 })
+
+
diff --git a/frontend/src/views/HistoryView.vue b/frontend/src/views/HistoryView.vue
index fac01ef..0a6e506 100644
--- a/frontend/src/views/HistoryView.vue
+++ b/frontend/src/views/HistoryView.vue
@@ -75,18 +75,15 @@ import type {HistoryData, SingleDayEntry} from "@/api/history.ts";
 import type { DayStatus } from "@/api/dashboard.ts";
 import { useHistoryStore } from "@/stores/history.ts";
 
-// --- INTERFEJSY ---
 interface HistoryEntry {
   date: Date;
   status: DayStatus;
 }
-
 interface ChartEntry {
   weekDay: string;
   status: DayStatus;
   currentSavings: number;
 }
-
 interface DatePickerSlotProps {
   day: number;
   month: number;
@@ -134,7 +131,7 @@ async function submit() {
     const payload: HistoryData = await historyStore.fetchHistory();
     dailyCost.value = payload.singleDayCost;
     addictionName.value = payload.addictionName;
-    const rawEntries = payload.totalHistory;
+    const rawEntries = payload.entries;
 
     fullHistory.value = rawEntries.map((entry: SingleDayEntry) => ({
       date: new Date(entry.date),
@@ -190,7 +187,6 @@ const chartOptions = ref({
   }
 });
 
-// --- OBSŁUGA KALENDARZA ---
 const getDateClass = (dateInfo: DatePickerSlotProps): string => {
   const d = new Date(dateInfo.year, dateInfo.month, dateInfo.day);
   const log = fullHistory.value.find(l => l.date.toDateString() === d.toDateString());
@@ -208,32 +204,31 @@ const handleDateSelect = (date: Date): void => {
   showDialog.value = true;
 };
 
-const saveEntry = (updatedEntry: HistoryEntry): void => {
-  // Tutaj powinna być logika wysłania update'u do API
-  console.log("Zapisywanie (mock):", updatedEntry);
+const formatDateToPayload = (date: Date): string => {
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, '0');
+  const day = String(date.getDate()).padStart(2, '0');
+  return `${year}-${month}-${day}`;
+};
 
-  // Aktualizacja lokalna (optymistyczna)
-  const index = fullHistory.value.findIndex(
-    (l) => l.date.toDateString() === updatedEntry.date.toDateString()
-  );
+const saveEntry = async (updatedEntry: HistoryEntry): Promise<void> => {
+  try {
+    const dateStr = formatDateToPayload(updatedEntry.date);
 
-  if (index !== -1) {
-    fullHistory.value[index] = { ...updatedEntry };
-  } else {
-    fullHistory.value.push({ ...updatedEntry });
+    await historyStore.updateStatus(dateStr, updatedEntry.status);
+    showDialog.value = false;
+    await submit();
+  } catch (error) {
+    console.error("Błąd zapisu statusu:", error);
   }
-
-  showDialog.value = false;
-  // Po zapisie warto by odświeżyć wykres (ponowne submit() lub przeliczenie lokalne)
 };
 
 onMounted(() => {
-  submit(); // Wywołujemy pobieranie danych przy starcie
+  submit();
 });
 </script>
 
 <style scoped>
-/* Twój CSS pozostaje bez zmian */
 .calendar-day-cell {
   width: 2.8rem;
   height: 2.8rem;

From 0d7a32b6e9d918730ecbf087560a84eddd61a5fb Mon Sep 17 00:00:00 2001
From: Falanger-debug <falanger27@gmail.com>
Date: Thu, 8 Jan 2026 22:35:28 +0100
Subject: [PATCH 3/3] feat: patch api dziala na pulpicie

---
 frontend/src/components/LandingLast7Days.vue |  8 ++-
 frontend/src/components/LandingSummary.vue   | 75 +++++++++++++++-----
 frontend/src/views/LandingPage.vue           | 10 ++-
 3 files changed, 72 insertions(+), 21 deletions(-)

diff --git a/frontend/src/components/LandingLast7Days.vue b/frontend/src/components/LandingLast7Days.vue
index e714853..c4bfb41 100644
--- a/frontend/src/components/LandingLast7Days.vue
+++ b/frontend/src/components/LandingLast7Days.vue
@@ -62,7 +62,7 @@ const lastSevenDays = ref<DayUI[]>([]);
 const dashboard = useDashboardStore();
 
 
-async function submit() {
+async function loadData() {
   try {
     const payload: Last7DaysResponse = await dashboard.historyLast7Days();
 
@@ -89,8 +89,12 @@ async function submit() {
   }
 }
 
+defineExpose({
+  loadData
+})
+
 onMounted(() => {
-  submit();
+  loadData();
 });
 </script>
 
diff --git a/frontend/src/components/LandingSummary.vue b/frontend/src/components/LandingSummary.vue
index 91e62e8..51033fc 100644
--- a/frontend/src/components/LandingSummary.vue
+++ b/frontend/src/components/LandingSummary.vue
@@ -28,11 +28,11 @@
           <div class="flex align-items-center justify-content-between mt-2">
             <div class="text-5xl font-black italic">{{ streakDays }}</div>
             <Button
-              :icon="streakActive ? 'pi pi-check-circle' : 'pi pi-plus'"
-              :label="streakActive ? 'Zrobione' : 'Przedłuż'"
-              :severity="streakActive ? 'success' : 'warn'"
+              icon="pi pi-pencil"
+              label="Raportuj"
+              severity="info"
               class="p-button-rounded"
-              @click="toggleStreak"
+              @click="openDialog"
             />
           </div>
           <p class="text-500 text-sm mt-2">Kliknij, aby zatwierdzić dzisiejszy dzień bez
@@ -69,6 +69,12 @@
         </template>
       </Card>
 
+      <HistoryStatusChangeDialog
+        v-model:visible="showDialog"
+        :entry="todayEntry"
+        @save="saveEntry"
+      />
+
     </div>
   </div>
 </template>
@@ -79,14 +85,24 @@ import Card from 'primevue/card';
 import Button from 'primevue/button';
 import Knob from 'primevue/knob';
 import {useDashboardStore} from "@/stores/dashboard.ts";
+import HistoryStatusChangeDialog from "@/components/HistoryStatusChangeDialog.vue";
+import {useHistoryStore} from "@/stores/history.ts";
+import type {DayStatus} from "@/api/dashboard.ts";
 
 const savedMoney = ref(0);
 const streakDays = ref(0);
-const streakActive = ref(false);
 const currentDays = ref(0);
 const goalDays = ref(10);
 const addictionName = ref('uzależnienia');
+const showDialog = ref(false);
+const todayEntry = ref<{ date: Date, status: DayStatus }>({
+  date: new Date(),
+  status: 'none'
+});
+
 const dashboard = useDashboardStore()
+const history = useHistoryStore()
+
 
 async function submit() {
   try {
@@ -100,21 +116,46 @@ async function submit() {
   }
 }
 
-onMounted(() => {
-  submit();
-});
+const formatDateToPayload = (date: Date): string => {
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, '0');
+  const day = String(date.getDate()).padStart(2, '0');
+  return `${year}-${month}-${day}`;
+};
+
+
+const openDialog = () => {
+  todayEntry.value = {
+    date: new Date(),
+    status: 'none'
+  };
+  showDialog.value = true;
+};
+
+const emit = defineEmits(['refresh']);
 
-const toggleStreak = () => {
-  if (!streakActive.value) {
-    streakDays.value++;
-    currentDays.value++;
-    streakActive.value = true;
-  } else {
-    streakDays.value--;
-    currentDays.value--;
-    streakActive.value = false;
+const saveEntry = async (updatedEntry: { date: Date, status: DayStatus | null }) => {
+  try {
+    const dateStr = formatDateToPayload(updatedEntry.date);
+
+    const statusToSend = updatedEntry.status ?? 'none';
+
+    await history.updateStatus(dateStr, statusToSend);
+
+    showDialog.value = false;
+
+    await submit();
+    emit('refresh');
+
+  } catch (err) {
+    console.error("Błąd zapisu:", err);
+    alert("Nie udało się zapisać statusu.");
   }
 };
+
+onMounted(() => {
+  submit();
+});
 </script>
 
 <style scoped>
diff --git a/frontend/src/views/LandingPage.vue b/frontend/src/views/LandingPage.vue
index b18f063..a909bfe 100644
--- a/frontend/src/views/LandingPage.vue
+++ b/frontend/src/views/LandingPage.vue
@@ -2,8 +2,8 @@
   <AppHeader />
   <main class="layout-content px-4">
     <div class="centered-column mx-auto">
-      <LandingSummary />
-      <LandingLast7Days />
+      <LandingSummary  @refresh="handleRefresh"/>
+      <LandingLast7Days ref="last7DaysRef"/>
     </div>
   </main>
 </template>
@@ -12,6 +12,12 @@
   import AppHeader from '../components/AppHeader.vue'
   import LandingSummary from "@/components/LandingSummary.vue";
   import LandingLast7Days from "@/components/LandingLast7Days.vue";
+  import {ref} from "vue";
+
+  const last7DaysRef = ref<InstanceType<typeof LandingLast7Days> | null>(null);
+  const handleRefresh = () => {
+    last7DaysRef.value?.loadData();
+  };
 </script>
 
 <style scoped>