Refactor: Complete Type FE refactoring

frontend/src/App.vue

@@ -34,6 +34,8 @@ const layout = computed(() => {
     return DefaultLayout;
 });
 
+// TODO: Move these loading message helpers to core
+
 // Loading message helpers
 const getAuthLoadingTitle = () => {
     if (authStore.retryingAuth) {

frontend/src/components/annotationWorkspace/AnnotationCanvas.vue

@@ -25,19 +25,28 @@
 <script setup lang="ts">
 import {computed, nextTick, onBeforeUnmount, onMounted, ref, watch} from "vue";
 import {useWorkspaceStore} from '@/stores/workspaceStore';
-import type {Point} from "@/types/common/point";
-import {ToolName} from "@/types/workspace/tools";
-import {AnnotationManager} from "@/core/annotationWorkspace/annotationManager";
-import {StoreError, ToolError} from "@/types/common/errors";
+import type {Point} from "@/core/geometry/geometry.types";
+import {ToolName} from "@/core/workspace/tools.types";
+import {
+    AnnotationManager,
+    findAnnotationAtPoint,
+    updateAnnotationPointLocally,
+    calculateCanvasDimensions,
+    calculateCenterAndFitView,
+    mouseToImageCoordinates,
+    calculateZoomFromWheel,
+    calculateZoomViewOffset,
+    calculateCanvasCursorStyle,
+    renderAnnotation,
+    type AnnotationRenderContext,
+    getAnnotationDisplayColor,
+    separateAnnotationsBySelection
+} from "@/core/workspace";
+import {StoreError, ToolError} from "@/core/errors/errors";
 import AlertModal from "../common/modal/AlertModal.vue";
 import {useAlert} from "@/composables/useAlert";
-import {AppLogger} from "@/utils/logger";
-import {findAnnotationAtPoint} from '@/core/annotationWorkspace/hitDetection';
-import {updateAnnotationPointLocally} from '@/core/annotationWorkspace/coordinateTransforms';
-import {calculateCanvasDimensions, calculateCenterAndFitView, mouseToImageCoordinates, calculateZoomFromWheel, calculateZoomViewOffset} from '@/core/annotationWorkspace/viewport';
-import {calculateCanvasCursorStyle} from '@/core/annotationWorkspace/cursors';
-import {renderAnnotation, type AnnotationRenderContext} from '@/core/annotationWorkspace/annotationRenderer';
-import {getAnnotationDisplayColor, separateAnnotationsBySelection} from '@/core/annotationWorkspace/annotationDisplayUtils';
+import {AppLogger} from "@/core/logger/logger";
+import type { Annotation } from "@/core/workspace/annotation.types";
 
 const logger = AppLogger.createComponentLogger('AnnotationCanvas');
 
@@ -275,7 +284,7 @@ const drawSavedAnnotations = (context: CanvasRenderingContext2D) => {
 
 // Function to save annotation changes to backend
 const saveAnnotationChanges = async (annotationId: number) => {
-    const annotation = annotationsToRender.value?.find(a => a.annotationId === annotationId);
+    const annotation = annotationsToRender.value?.find((a: Annotation) => a.annotationId === annotationId);
     if (!annotation || !annotation.coordinates) return;
 
     try {
@@ -373,7 +382,7 @@ const handleMouseMove = (event: MouseEvent) => {
     if (activeTool.value === ToolName.CURSOR) {
         if (isDraggingHandle.value && selectedAnnotationId.value !== null) {
             // Handle dragging - update annotation coordinates locally only
-            const annotation = annotationsToRender.value?.find(a => a.annotationId === selectedAnnotationId.value);
+            const annotation = annotationsToRender.value?.find((a: Annotation) => a.annotationId === selectedAnnotationId.value);
             if (annotation) {
                 const imageDims = workspaceStore.getCurrentAsset && workspaceStore.getCurrentAsset.width && workspaceStore.getCurrentAsset.height
                     ? { width: workspaceStore.getCurrentAsset.width, height: workspaceStore.getCurrentAsset.height }

frontend/src/components/annotationWorkspace/AnnotationsPanel.vue

@@ -152,9 +152,9 @@
 <script setup lang="ts">
 import { computed, ref } from 'vue';
 import { useWorkspaceStore } from '@/stores/workspaceStore';
-import type { Annotation } from '@/types/workspace/annotation';
-import { AnnotationType } from '@/types/workspace/annotation';
-import type { Label } from '@/types/label/label';
+import type { Annotation } from '@/core/workspace/annotation.types';
+import { AnnotationType } from '@/core/workspace/annotation.types';
+import type { Label } from '@/services/project/labelScheme/label.types';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import { 
     faEye, 
@@ -169,7 +169,7 @@ import {
 } from '@fortawesome/free-solid-svg-icons';
 import ModalWindow from '@/components/common/modal/ModalWindow.vue';
 import Button from '@/components/common/Button.vue';
-import {AppLogger} from "@/utils/logger";
+import {AppLogger} from "@/core/logger/logger";
 
 const logger = AppLogger.createComponentLogger('AnnotationCanvas');
 

frontend/src/components/annotationWorkspace/WorkspaceSidebar.vue

@@ -99,10 +99,12 @@
 <script setup lang="ts">
 import { computed, ref, watch, onMounted, onUnmounted } from 'vue';
 import { useWorkspaceStore } from '@/stores/workspaceStore';
-import { ToolName } from '@/types/workspace/tools';
+import { ToolName } from '@/core/workspace/tools.types';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import Button from '@/components/common/Button.vue';
-import { AppLogger } from '@/utils/logger';
+import { AppLogger } from '@/core/logger/logger';
+import type { Label } from '@/services/project/labelScheme/label.types';
+import type { Annotation } from '@/core/workspace/annotation.types';
 
 const logger = AppLogger.createComponentLogger('WorkspaceSidebar');
 
@@ -128,7 +130,7 @@ const filteredLabels = computed(() => {
     }
 
     const query = labelSearchQuery.value.toLowerCase().trim();
-    return availableLabels.value.filter(label => 
+    return availableLabels.value.filter((label: Label) => 
         label.name.toLowerCase().includes(query) ||
         (label.description && label.description.toLowerCase().includes(query))
     );
@@ -155,10 +157,10 @@ const selectLabel = (labelId: number) => {
 
 // Helper functions
 const getLabelUsageCount = (labelId: number): number => {
-    return annotations.value.filter(annotation => annotation.labelId === labelId).length;
+    return annotations.value.filter((annotation: Annotation) => annotation.labelId === labelId).length;
 };
 
-const getLabelTooltip = (label: any, index: number): string => {
+const getLabelTooltip = (label: Label, index: number): string => {
     const usageCount = getLabelUsageCount(label.labelId);
     const shortcut = index < 9 ? ` (Press ${index + 1})` : '';
     const usage = usageCount > 0 ? ` • ${usageCount} annotations` : '';

frontend/src/components/common/DataTable.vue

@@ -157,7 +157,7 @@ import {
     faSortUp
 } from '@fortawesome/free-solid-svg-icons';
 import Button from '@/components/common/Button.vue';
-import type {TableAction, TableColumn, TablePagination, TableRowAction} from '@/types/common';
+import type {TableAction, TableColumn, TablePagination, TableRowAction} from '@/core/table/table.types';
 
 interface Props {
     data: T[];

frontend/src/components/common/PageLoader.vue

@@ -34,9 +34,16 @@
 </template>
 
 <script setup lang="ts">
-import type { PageLoaderProps } from '@/types/components/pageLoader';
+export interface Props {
+    title?: string;
+    subtitle?: string;
+    message?: string;
+    showProgress?: boolean;
+    progress?: number;
+    transparent?: boolean;
+}
 
-withDefaults(defineProps<PageLoaderProps>(), {
+withDefaults(defineProps<Props>(), {
     title: 'Loading...',
     subtitle: '',
     message: '',

frontend/src/components/common/toast/ToastNotification.vue

@@ -55,7 +55,7 @@ import {
     faInfoCircle,
     faTimes
 } from '@fortawesome/free-solid-svg-icons';
-import type {Toast} from '@/types/toast';
+import type {Toast} from '@/composables/useToast';
 
 const props = defineProps<{
     toast: Toast;

frontend/src/components/project/AssetThumbnail.vue

@@ -58,12 +58,12 @@
 </template>
 
 <script setup lang="ts">
-import {computed, ref} from 'vue';
-import {useRoute} from 'vue-router';
-import type {Asset} from '@/types/asset/asset';
+import { computed, ref } from 'vue';
+import { useRoute } from 'vue-router';
+import type { Asset } from '@/core/asset/asset.types';
 import Card from '@/components/common/Card.vue';
 import Button from '@/components/common/Button.vue';
-import {AppLogger} from '@/utils/logger';
+import { AppLogger } from '@/core/logger/logger';
 
 const logger = AppLogger.createComponentLogger('AssetThumbnail');
 

frontend/src/components/project/CreateProjectForm.vue

@@ -28,7 +28,7 @@
 import {ref} from 'vue';
 import Form from '@/components/common/Form.vue';
 import Button from '@/components/common/Button.vue';
-import {ProjectType} from '@/types/project/project';
+import {ProjectType} from '@/services/project/project.types';
 import {useToast} from '@/composables/useToast';
 
 const { showWarning } = useToast();

frontend/src/components/project/ProjectCard.vue

@@ -24,7 +24,7 @@
 
 <script setup lang="ts">
 import {computed} from "vue";
-import type {Project} from "@/types/project/project";
+import type {Project} from "@/services/project/project.types";
 import Card from "@/components/common/Card.vue";
 
 const props = defineProps<{

frontend/src/components/project/UploadImagesModal.vue

@@ -163,13 +163,13 @@
 import {computed, ref} from 'vue';
 import ModalWindow from '@/components/common/modal/ModalWindow.vue';
 import Button from '@/components/common/Button.vue';
-import type {DataSource} from '@/types/dataSource/dataSource';
-import {NoFilesProvidedError, UploadError} from '@/types/asset';
-import {ApiResponseError, NetworkError, ServerError} from '@/types/common/errors';
-import {AppLogger} from '@/utils/logger';
+import type {DataSource} from '@/services/project/dataSource/dataSource.types';
+import {NoFilesProvidedError, UploadError} from '@/services/project/asset';
+import {ApiResponseError, NetworkError, ServerError} from '@/core/errors/errors';
+import {AppLogger} from '@/core/logger/logger';
 import {useAlert} from '@/composables/useAlert';
 import {useToast} from '@/composables/useToast';
-import {assetService} from '@/services/api/projects';
+import {assetService} from '@/services/project';
 
 const logger = AppLogger.createComponentLogger('UploadImagesModal');
 

frontend/src/components/project/dashboard/AddWidgetModal.vue

@@ -145,7 +145,7 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import ModalWindow from "@/components/common/modal/ModalWindow.vue";
 import Button from "@/components/common/Button.vue";
-import type { WidgetDefinitionDto } from "@/types/dashboard/dashboard";
+import type { WidgetDefinitionDto } from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     widgetDefinitions: WidgetDefinitionDto[];

frontend/src/components/project/dashboard/DashboardGrid.vue

@@ -74,7 +74,7 @@ import 'gridstack/dist/gridstack.min.css';
 import WidgetContainer from "./WidgetContainer.vue";
 import AddWidgetModal from "./AddWidgetModal.vue";
 import WidgetSettingsModal from "./WidgetSettingsModal.vue";
-import type { WidgetInstanceDto, WidgetDefinitionDto } from "@/types/dashboard/dashboard";
+import type { WidgetInstanceDto, WidgetDefinitionDto } from "@/services/project/dashboard/dashboard.types";
 
 // Widget Components (same as before)
 import ProjectHealthWidget from "./widgets/ProjectHealthWidget.vue";

frontend/src/components/project/dashboard/WidgetContainer.vue

@@ -72,7 +72,7 @@
 <script setup lang="ts">
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { faCog, faRefresh, faTimes, faExclamationTriangle } from "@fortawesome/free-solid-svg-icons";
-import type { WidgetInstanceDto } from "@/types/dashboard/dashboard";
+import type { WidgetInstanceDto } from "@/services/project/dashboard/dashboard.types";
 import Button from "@/components/common/Button.vue";
 
 interface Props {

frontend/src/components/project/dashboard/WidgetSettingsModal.vue

@@ -144,7 +144,7 @@ import type {
     WidgetInstanceDto,
     WidgetDefinitionDto,
     WidgetSettingDto,
-} from "@/types/dashboard/dashboard";
+} from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     widget: WidgetInstanceDto;

frontend/src/components/project/dashboard/widgets/ProjectHealthWidget.vue

@@ -151,7 +151,7 @@ import {
     faExclamationTriangle 
 } from "@fortawesome/free-solid-svg-icons";
 import * as d3 from "d3";
-import type { ProjectHealthDto } from "@/types/dashboard/dashboard";
+import type { ProjectHealthDto } from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     data?: ProjectHealthDto;

frontend/src/components/project/dashboard/widgets/RecentActivitiesWidget.vue

@@ -64,7 +64,7 @@
 </template>
 
 <script setup lang="ts">
-import type { RecentActivityDto } from "@/types/dashboard/dashboard";
+import type { RecentActivityDto } from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     data?: RecentActivityDto[];

frontend/src/components/project/dashboard/widgets/TaskStatisticsWidget.vue

@@ -90,7 +90,7 @@
 <script setup lang="ts">
 import { ref, onMounted, onUnmounted, watch } from "vue";
 import * as d3 from "d3";
-import type { TaskStatisticsDto } from "@/types/dashboard/dashboard";
+import type { TaskStatisticsDto } from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     data?: TaskStatisticsDto;

frontend/src/components/project/dashboard/widgets/UserPerformanceWidget.vue

@@ -194,7 +194,7 @@
 <script setup lang="ts">
 import { computed, ref, onMounted, onUnmounted, watch } from "vue";
 import * as d3 from "d3";
-import type { UserPerformanceDto } from "@/types/dashboard/dashboard";
+import type { UserPerformanceDto } from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     data?: UserPerformanceDto[];

frontend/src/components/project/dashboard/widgets/WorkflowProgressWidget.vue

@@ -129,7 +129,7 @@
 <script setup lang="ts">
 import { computed, ref, onMounted, onUnmounted, watch } from "vue";
 import * as d3 from "d3";
-import type { WorkflowProgressDto } from "@/types/dashboard/dashboard";
+import type { WorkflowProgressDto } from "@/services/project/dashboard/dashboard.types";
 
 interface Props {
     data?: WorkflowProgressDto[];

frontend/src/components/project/dataSource/CreateDataSourceForm.vue

@@ -33,9 +33,9 @@
 import { ref, onMounted } from 'vue';
 import Form from '@/components/common/Form.vue';
 import Button from '@/components/common/Button.vue';
-import { DataSourceType, type CreateDataSourceRequest } from '@/types/dataSource';
+import { DataSourceType, type CreateDataSourceRequest } from '@/services/project/dataSource/dataSource.types';
 import { useToast } from '@/composables/useToast';
-import { dataSourceService } from '@/services/api/projects';
+import { dataSourceService } from '@/services/project';
 
 const { showWarning, showError, showApiError } = useToast();
 

frontend/src/components/project/dataSource/DataSourceCard.vue

@@ -55,7 +55,7 @@
 import {computed, ref} from "vue";
 import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome';
 import {faEye, faUpload, faDownload, faDatabase} from '@fortawesome/free-solid-svg-icons';
-import type {DataSource} from "@/types/dataSource/dataSource";
+import type {DataSource} from "@/services/project/dataSource/dataSource.types";
 import Card from "@/components/common/Card.vue";
 import Button from "@/components/common/Button.vue";
 import UploadImagesModal from "@/components/project/UploadImagesModal.vue";

frontend/src/components/project/labels/CreateLabelForm.vue

@@ -86,8 +86,8 @@ import {computed, ref} from 'vue';
 import Form from '@/components/common/Form.vue';
 import Button from '@/components/common/Button.vue';
 import LabelChip from './LabelChip.vue';
-import type {CreateLabelRequest} from '@/types/label/requests';
-import {generateRandomColor, isValidHexColor} from '@/utils/colors';
+import type {CreateLabelRequest} from '@/services/project/labelScheme/label.types';
+import {generateRandomColor, isValidHexColor} from '@/core/theming';
 
 const props = defineProps<{
     disabled?: boolean;

frontend/src/components/project/labels/CreateLabelSchemeForm.vue

@@ -44,7 +44,7 @@
 import {ref, computed, watch} from "vue";
 import Form from "@/components/common/Form.vue";
 import Button from "@/components/common/Button.vue";
-import type {FormPayloadLabelScheme, LabelScheme} from "@/types/label/labelScheme";
+import type {FormPayloadLabelScheme, LabelScheme} from "@/services/project/labelScheme/label.types";
 import {useAlert} from "@/composables/useAlert";
 
 const props = defineProps<{