Nodarx/chrono
1
0
Fork 0
Code Issues 1 Pull Requests 5 Actions Projects Releases Activity

refactor: code clean up

Browse Source 
Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>
This commit is contained in:
Sebastian Krupinski
2026-07-07 20:48:20 -04:00
parent 3c0ea698b1
commit 41a2de2b3d
4 changed files with 82 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/ChronoPage.vue
+50 -55
View File
@@ -1,4 +1,3 @@
<script setup lang="ts">
import { computed, onMounted, ref, watch } from 'vue';
import { storeToRefs } from 'pinia';
@@ -72,8 +71,7 @@ const {
selectSection,
selectDate,
selectCollection,
openEditCalendar,
openEditTaskList,
openCollectionEditor,
createEventFromDate,
startEditingSelectedEntity,
cancelEditingSelectedEntity,
@@ -86,8 +84,6 @@ const {
deleteTask,
saveCollection,
deleteCollection,
openCreateCalendar,
openCreateTaskList,
openImport,
closeImport,
} = chronoUiStore;
@@ -98,35 +94,51 @@ const {
ensureTasksLoaded,
} = chronoOperationsStore;
function setCalendarView(view: CalendarViewType) {
chronoSettingsStore.calendarView = view;
}
function setDaysViewSpan(span: DaysViewSpan) {
chronoSettingsStore.daysViewSpan = span;
}
function setAgendaViewSpan(span: AgendaViewSpan) {
chronoSettingsStore.agendaViewSpan = span;
}
const fileInputRef = ref<HTMLInputElement | null>(null)
function triggerFileInput() { fileInputRef.value?.click() }
async function onFilesSelected(event: Event) {
watch(() => route.fullPath, async () => {
selectSectionFromRoute();
if (isTasksSection.value) {
await ensureTasksLoaded();
}
});
watch(
[calendarView, currentDate, daysViewSpan, agendaViewSpan],
() => { loadVisibleRangeOperations(computeVisibleRange()); },
{ immediate: true },
);
onMounted(async () => {
try {
selectSectionFromRoute();
await initialize(isTasksSection.value ? 'tasks' : 'calendar');
} catch (error) {
console.error('[Chrono] - Failed to load data from Chrono Manager:', error);
}
});
function handleImportStart() {
fileInputRef.value?.click()
}
async function handleImportSelect(event: Event) {
const input = event.target as HTMLInputElement
const files = Array.from(input.files ?? [])
input.value = ''
if (files.length) await openImport(files)
}
function selectSectionFromRoute() {
const routePath = route.path;
const section = routePath.endsWith('/tasks') ? 'tasks' : 'calendar';
selectSection(section);
function handleCalendarViewChange(view: CalendarViewType) {
chronoSettingsStore.calendarView = view;
}
function handleCalendarViewChange(view: CalendarViewType) {
setCalendarView(view);
function handleCalendarDaysViewSpanChange(span: DaysViewSpan) {
chronoSettingsStore.daysViewSpan = span;
}
function handleCalendarAgendaViewSpanChange(span: AgendaViewSpan) {
chronoSettingsStore.agendaViewSpan = span;
}
function computeVisibleRange(): EpochSpan {
@@ -141,28 +153,11 @@ function computeVisibleRange(): EpochSpan {
return daysVisibleRange(currentDate.value, spanToDays(span));
}
watch(
[calendarView, currentDate, daysViewSpan, agendaViewSpan],
() => { loadVisibleRangeOperations(computeVisibleRange()); },
{ immediate: true },
);
onMounted(async () => {
try {
selectSectionFromRoute();
await initialize(isTasksSection.value ? 'tasks' : 'calendar');
} catch (error) {
console.error('[Chrono] - Failed to load data from ChronoManager:', error);
}
});
watch(() => route.fullPath, async () => {
selectSectionFromRoute();
if (isTasksSection.value) {
await ensureTasksLoaded();
}
});
function selectSectionFromRoute() {
const routePath = route.path;
const section = routePath.endsWith('/tasks') ? 'tasks' : 'calendar';
selectSection(section);
}
</script>
<template>
@@ -218,7 +213,7 @@ watch(() => route.fullPath, async () => {
:selected-collection="selectedCollection"
type="calendar"
@select="selectCollection"
@edit="openEditCalendar"
@edit="openCollectionEditor('calendar', $event)"
@toggle-visibility="toggleCalendarVisibility"
/>
<CollectionList
@@ -227,7 +222,7 @@ watch(() => route.fullPath, async () => {
:selected-collection="selectedCollection"
type="tasklist"
@select="selectCollection"
@edit="openEditTaskList"
@edit="openCollectionEditor('tasklist', $event)"
/>
<v-btn
@@ -236,7 +231,7 @@ watch(() => route.fullPath, async () => {
color="primary"
block
class="mt-3"
@click="openCreateCalendar"
@click="openCollectionEditor('calendar')"
>
<v-icon start>mdi-plus</v-icon>
New Calendar
@@ -248,17 +243,17 @@ watch(() => route.fullPath, async () => {
color="primary"
block
class="mt-3"
@click="openCreateTaskList"
@click="openCollectionEditor('tasklist')"
>
<v-icon start>mdi-plus</v-icon>
New Task List
</v-btn>
<v-divider class="my-3" />
<v-btn variant="text" prepend-icon="mdi-calendar-import" block class="justify-start" @click="triggerFileInput">
<v-btn variant="text" prepend-icon="mdi-calendar-import" block class="justify-start" @click="handleImportStart">
Import iCalendar
</v-btn>
<input ref="fileInputRef" type="file" accept=".ics,text/calendar" multiple class="d-none" @change="onFilesSelected" />
<input ref="fileInputRef" type="file" accept=".ics,text/calendar" multiple class="d-none" @change="handleImportSelect" />
<!-- Mini Calendar Widget -->
<v-card v-if="!isTasksSection" class="mt-4" variant="outlined">
@@ -307,8 +302,8 @@ watch(() => route.fullPath, async () => {
@event-click="editEvent"
@date-click="createEventFromDate"
@update:current-date="selectDate"
@update:days-span="setDaysViewSpan"
@update:agenda-span="setAgendaViewSpan"
@update:days-span="handleCalendarDaysViewSpanChange"
@update:agenda-span="handleCalendarAgendaViewSpanChange"
/>
<TaskView