From 6713240aec6f8fb06eb84bb36cde72f6b9825a38 Mon Sep 17 00:00:00 2001
From: Matthias Feyll <matthias.feyll@stud.h-da.de>
Date: Tue, 1 Oct 2024 13:23:28 +0200
Subject: [PATCH] refactor device to component

---
 .../devices/reducer}/device.reducer.ts                    | 2 +-
 .../devices/reducer}/mne.subscription.ts                  | 8 ++++----
 .../components/{ => devices}/routines/action.routine.ts   | 0
 .../components/{ => devices}/routines/device.routine.ts   | 6 +++---
 .../components/{view/device => devices/view}/device.scss  | 0
 .../{view/device => devices/view}/device.view.table.tsx   | 2 +-
 .../{view/device => devices/view}/device.view.tabs.tsx    | 0
 .../{view/device => devices/view}/device.view.tsx         | 2 +-
 .../{ => devices}/view_model/device.table.viewmodel.ts    | 2 +-
 .../{ => devices}/view_model/device.viewmodel.ts          | 2 +-
 react-ui/src/routes.tsx                                   | 2 +-
 .../shared/layouts/protected.layout/protected.layout.tsx  | 4 ++--
 react-ui/src/shared/provider/auth.provider.tsx            | 2 +-
 .../src/{stores => shared}/reducer/routine.reducer.ts     | 7 +++----
 react-ui/src/shared/{store => reducer}/user.reducer.ts    | 0
 react-ui/src/shared/utils/routine.manager.ts              | 4 ++--
 react-ui/src/stores/index.ts                              | 2 +-
 react-ui/src/stores/persist.store.ts                      | 6 +++---
 18 files changed, 25 insertions(+), 26 deletions(-)
 rename react-ui/src/{stores/reducer/device.reducer => components/devices/reducer}/device.reducer.ts (96%)
 rename react-ui/src/{stores/reducer/device.reducer => components/devices/reducer}/mne.subscription.ts (81%)
 rename react-ui/src/components/{ => devices}/routines/action.routine.ts (100%)
 rename react-ui/src/components/{ => devices}/routines/device.routine.ts (86%)
 rename react-ui/src/components/{view/device => devices/view}/device.scss (100%)
 rename react-ui/src/components/{view/device => devices/view}/device.view.table.tsx (96%)
 rename react-ui/src/components/{view/device => devices/view}/device.view.tabs.tsx (100%)
 rename react-ui/src/components/{view/device => devices/view}/device.view.tsx (96%)
 rename react-ui/src/components/{ => devices}/view_model/device.table.viewmodel.ts (91%)
 rename react-ui/src/components/{ => devices}/view_model/device.viewmodel.ts (86%)
 rename react-ui/src/{stores => shared}/reducer/routine.reducer.ts (95%)
 rename react-ui/src/shared/{store => reducer}/user.reducer.ts (100%)

diff --git a/react-ui/src/stores/reducer/device.reducer/device.reducer.ts b/react-ui/src/components/devices/reducer/device.reducer.ts
similarity index 96%
rename from react-ui/src/stores/reducer/device.reducer/device.reducer.ts
rename to react-ui/src/components/devices/reducer/device.reducer.ts
index c9388adc5..ad702310b 100644
--- a/react-ui/src/stores/reducer/device.reducer/device.reducer.ts
+++ b/react-ui/src/components/devices/reducer/device.reducer.ts
@@ -1,5 +1,5 @@
 import { api, NetworkelementFlattenedManagedNetworkElement, NetworkelementManagedNetworkElement, PndPrincipalNetworkDomain, PndServiceGetPndListApiArg } from '@api/api';
-import { DeviceViewTabValues } from '@component/view/device/device.view.tabs';
+import { DeviceViewTabValues } from '@component/devices/view/device.view.tabs';
 import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit';
 
 export type Device = NetworkelementFlattenedManagedNetworkElement;
diff --git a/react-ui/src/stores/reducer/device.reducer/mne.subscription.ts b/react-ui/src/components/devices/reducer/mne.subscription.ts
similarity index 81%
rename from react-ui/src/stores/reducer/device.reducer/mne.subscription.ts
rename to react-ui/src/components/devices/reducer/mne.subscription.ts
index d84e7c5a5..fec8a0b21 100644
--- a/react-ui/src/stores/reducer/device.reducer/mne.subscription.ts
+++ b/react-ui/src/components/devices/reducer/mne.subscription.ts
@@ -1,11 +1,11 @@
 import { api, NetworkElementServiceGetApiArg } from "@api/api";
-import { Device, setSelectedDevice, setSelectedMne } from "@reducer/device.reducer/device.reducer";
-import { addRoutine, CATEGORIES } from "@reducer/routine.reducer";
+import { Device, setSelectedDevice, setSelectedMne } from "@component/devices/reducer/device.reducer";
 import { createAsyncThunk } from "@reduxjs/toolkit";
+import { addRoutine, CATEGORIES } from "@shared/reducer/routine.reducer";
 import { THUNK_KEY } from "@utils/routine.manager";
 import { RootState } from "src/stores";
-import { FETCH_MNE_ACTION } from "../../../components/routines/action.routine";
-import { startListening } from "../../middleware/listener.middleware";
+import { startListening } from "../../../stores/middleware/listener.middleware";
+import { FETCH_MNE_ACTION } from "../routines/action.routine";
 
 // fetch mne if selected device is set
 startListening({
diff --git a/react-ui/src/components/routines/action.routine.ts b/react-ui/src/components/devices/routines/action.routine.ts
similarity index 100%
rename from react-ui/src/components/routines/action.routine.ts
rename to react-ui/src/components/devices/routines/action.routine.ts
diff --git a/react-ui/src/components/routines/device.routine.ts b/react-ui/src/components/devices/routines/device.routine.ts
similarity index 86%
rename from react-ui/src/components/routines/device.routine.ts
rename to react-ui/src/components/devices/routines/device.routine.ts
index 7cafd91b7..2d14e4bf5 100644
--- a/react-ui/src/components/routines/device.routine.ts
+++ b/react-ui/src/components/devices/routines/device.routine.ts
@@ -1,9 +1,9 @@
 import { NetworkElementServiceGetAllFlattenedApiArg, api } from "@api/api";
-import { setDevices } from "@reducer/device.reducer/device.reducer";
+import { setDevices } from "@component/devices/reducer/device.reducer";
 import { createAsyncThunk } from "@reduxjs/toolkit";
-import { setUser } from "@shared/store/user.reducer";
+import { setUser } from "@shared/reducer/user.reducer";
 import { RootState } from "src/stores";
-import { startListening } from "../../stores/middleware/listener.middleware";
+import { startListening } from "../../../stores/middleware/listener.middleware";
 import { FETCH_DEVICE_ACTION } from "./action.routine";
 
 // continously fetch devices
diff --git a/react-ui/src/components/view/device/device.scss b/react-ui/src/components/devices/view/device.scss
similarity index 100%
rename from react-ui/src/components/view/device/device.scss
rename to react-ui/src/components/devices/view/device.scss
diff --git a/react-ui/src/components/view/device/device.view.table.tsx b/react-ui/src/components/devices/view/device.view.table.tsx
similarity index 96%
rename from react-ui/src/components/view/device/device.view.table.tsx
rename to react-ui/src/components/devices/view/device.view.table.tsx
index 16c9c7730..9ef441f17 100644
--- a/react-ui/src/components/view/device/device.view.table.tsx
+++ b/react-ui/src/components/devices/view/device.view.table.tsx
@@ -2,7 +2,7 @@ import { useAppSelector } from "@hooks";
 import { MutableRefObject, useCallback } from "react";
 import { OverlayTrigger, Table, Tooltip } from "react-bootstrap";
 import { useTranslation } from "react-i18next";
-import { useDeviceTableViewModel } from "../../view_model/device.table.viewmodel";
+import { useDeviceTableViewModel } from "../view_model/device.table.viewmodel";
 
 export const DeviceViewTable = (searchRef: MutableRefObject<HTMLInputElement>) => {
     const { devices, pnds } = useAppSelector(state => state.device);
diff --git a/react-ui/src/components/view/device/device.view.tabs.tsx b/react-ui/src/components/devices/view/device.view.tabs.tsx
similarity index 100%
rename from react-ui/src/components/view/device/device.view.tabs.tsx
rename to react-ui/src/components/devices/view/device.view.tabs.tsx
diff --git a/react-ui/src/components/view/device/device.view.tsx b/react-ui/src/components/devices/view/device.view.tsx
similarity index 96%
rename from react-ui/src/components/view/device/device.view.tsx
rename to react-ui/src/components/devices/view/device.view.tsx
index c620636bf..9e176ae66 100644
--- a/react-ui/src/components/view/device/device.view.tsx
+++ b/react-ui/src/components/devices/view/device.view.tsx
@@ -1,10 +1,10 @@
 import { useRef } from 'react';
 import { Button, Col, Container, Form, Nav, NavLink, Row } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
+import { useDeviceViewModel } from '../view_model/device.viewmodel';
 import './device.scss';
 import { DeviceViewTable } from './device.view.table';
 import { DeviceViewTabs, DeviceViewTabValues } from './device.view.tabs';
-import { useDeviceViewModel } from '/src/components/view_model/device.viewmodel';
 
 function DeviceView() {
     const { t } = useTranslation('common');
diff --git a/react-ui/src/components/view_model/device.table.viewmodel.ts b/react-ui/src/components/devices/view_model/device.table.viewmodel.ts
similarity index 91%
rename from react-ui/src/components/view_model/device.table.viewmodel.ts
rename to react-ui/src/components/devices/view_model/device.table.viewmodel.ts
index 0802d6b57..df7595328 100644
--- a/react-ui/src/components/view_model/device.table.viewmodel.ts
+++ b/react-ui/src/components/devices/view_model/device.table.viewmodel.ts
@@ -1,5 +1,5 @@
+import { Device, setSelectedDevice } from "@component/devices/reducer/device.reducer";
 import { useAppDispatch } from "@hooks";
-import { Device, setSelectedDevice } from "@reducer/device.reducer/device.reducer";
 import { useEffect, useState } from "react";
 
 export const useDeviceTableViewModel = (searchRef) => {
diff --git a/react-ui/src/components/view_model/device.viewmodel.ts b/react-ui/src/components/devices/view_model/device.viewmodel.ts
similarity index 86%
rename from react-ui/src/components/view_model/device.viewmodel.ts
rename to react-ui/src/components/devices/view_model/device.viewmodel.ts
index 6dd01d07e..cfff6cf9a 100644
--- a/react-ui/src/components/view_model/device.viewmodel.ts
+++ b/react-ui/src/components/devices/view_model/device.viewmodel.ts
@@ -1,5 +1,5 @@
+import { setActiveTab as setActiveTabState } from "@component/devices/reducer/device.reducer";
 import { useAppDispatch, useAppSelector } from "@hooks";
-import { setActiveTab as setActiveTabState } from "@reducer/device.reducer/device.reducer";
 import { DeviceViewTabValues } from "@view/device/device.view.tabs";
 
 export const useDeviceViewModel = () => {
diff --git a/react-ui/src/routes.tsx b/react-ui/src/routes.tsx
index 1015d87af..368df55a4 100644
--- a/react-ui/src/routes.tsx
+++ b/react-ui/src/routes.tsx
@@ -1,8 +1,8 @@
 import { BasicLayout } from "@layout/basic.layout";
 import { ProtectedLayout } from "@layout/protected.layout/protected.layout";
 import { createBrowserRouter, createRoutesFromElements, Navigate, Route } from "react-router-dom";
+import DeviceView from "./components/devices/view/device.view";
 import { LoginLayout } from "./components/login/layouts/login.layout";
-import DeviceView from "./components/view/device/device.view";
 
 export const DEVICE_URL = '/device/';
 export const LOGIN_URL = '/login';
diff --git a/react-ui/src/shared/layouts/protected.layout/protected.layout.tsx b/react-ui/src/shared/layouts/protected.layout/protected.layout.tsx
index 020389984..03a188796 100644
--- a/react-ui/src/shared/layouts/protected.layout/protected.layout.tsx
+++ b/react-ui/src/shared/layouts/protected.layout/protected.layout.tsx
@@ -1,11 +1,11 @@
 import logo from '@assets/logo.svg';
+import { fetchPnds } from '@component/devices/reducer/device.reducer';
 import { faCircleUser, faRightFromBracket } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { useAppDispatch, useAppSelector } from '@hooks';
 import { useAuth } from "@provider/auth.provider";
-import { fetchPnds } from '@reducer/device.reducer/device.reducer';
 import { DEVICE_URL, LOGIN_URL } from '@routes';
-import { fetchUser } from '@shared/store/user.reducer';
+import { fetchUser } from '@shared/reducer/user.reducer';
 import React, { useEffect } from "react";
 import { Dropdown } from "react-bootstrap";
 import { useTranslation } from "react-i18next";
diff --git a/react-ui/src/shared/provider/auth.provider.tsx b/react-ui/src/shared/provider/auth.provider.tsx
index b6bde9262..4098eca5b 100644
--- a/react-ui/src/shared/provider/auth.provider.tsx
+++ b/react-ui/src/shared/provider/auth.provider.tsx
@@ -5,7 +5,7 @@ import { DEVICE_URL, LOGIN_URL } from "@routes";
 import { jwtDecode } from "jwt-decode";
 import { createContext, useContext, useEffect, useMemo } from "react";
 import { useNavigate } from "react-router-dom";
-import { setToken } from "../store/user.reducer";
+import { setToken } from "../reducer/user.reducer";
 
 interface AuthProviderType {
     login: (username: string, password: string) => void,
diff --git a/react-ui/src/stores/reducer/routine.reducer.ts b/react-ui/src/shared/reducer/routine.reducer.ts
similarity index 95%
rename from react-ui/src/stores/reducer/routine.reducer.ts
rename to react-ui/src/shared/reducer/routine.reducer.ts
index 79e7c8683..fb62e5159 100644
--- a/react-ui/src/stores/reducer/routine.reducer.ts
+++ b/react-ui/src/shared/reducer/routine.reducer.ts
@@ -1,9 +1,9 @@
 import { PayloadAction, createSlice } from '@reduxjs/toolkit';
-import { setToken } from '@shared/store/user.reducer';
 import { RoutineDictionary, RoutineManager, THUNK_KEY } from '@utils/routine.manager';
 import { REHYDRATE } from 'redux-persist';
-import { RootState } from '..';
-import { startListening } from '../middleware/listener.middleware';
+import { RootState } from '../../stores';
+import { startListening } from '../../stores/middleware/listener.middleware';
+import { setToken } from './user.reducer';
 
 
 
@@ -22,7 +22,6 @@ interface ThunkEntity extends ThunkEntityDTO {
     locked: boolean,
 }
 
-
 export interface ReducerState {
     thunks: {[key in keyof typeof CATEGORIES]: ThunkEntity | null}
 }
diff --git a/react-ui/src/shared/store/user.reducer.ts b/react-ui/src/shared/reducer/user.reducer.ts
similarity index 100%
rename from react-ui/src/shared/store/user.reducer.ts
rename to react-ui/src/shared/reducer/user.reducer.ts
diff --git a/react-ui/src/shared/utils/routine.manager.ts b/react-ui/src/shared/utils/routine.manager.ts
index 449e2c690..891637fb8 100644
--- a/react-ui/src/shared/utils/routine.manager.ts
+++ b/react-ui/src/shared/utils/routine.manager.ts
@@ -1,5 +1,5 @@
-import { fetchDevicesThunk } from '@component/routines/device.routine';
-import { fetchSelectedMneThunk } from '@reducer/device.reducer/mne.subscription';
+import { fetchSelectedMneThunk } from '@component/devices/reducer/mne.subscription';
+import { fetchDevicesThunk } from '@component/devices/routines/device.routine';
 import { AsyncThunk } from '@reduxjs/toolkit';
 import { QueryActionCreatorResult } from '@reduxjs/toolkit/query';
 
diff --git a/react-ui/src/stores/index.ts b/react-ui/src/stores/index.ts
index f620923b5..8c24b8763 100644
--- a/react-ui/src/stores/index.ts
+++ b/react-ui/src/stores/index.ts
@@ -1,3 +1,4 @@
+import { FETCH_DEVICE_ACTION, FETCH_MNE_ACTION } from '@component/devices/routines/action.routine'
 import { configureStore } from '@reduxjs/toolkit'
 import { setupListeners } from '@reduxjs/toolkit/query'
 import { FLUSH, PAUSE, PERSIST, PURGE, REGISTER, REHYDRATE } from 'redux-persist'
@@ -6,7 +7,6 @@ import { emptySplitApi } from './api.store'
 import { rtkQueryErrorLogger } from './middleware/devLogging.middleware'
 import { listenerMiddleware } from './middleware/listener.middleware'
 import persistedReducer from './persist.store'
-import { FETCH_DEVICE_ACTION, FETCH_MNE_ACTION } from '/src/components/routines/action.routine'
 
 
 export const store = configureStore({
diff --git a/react-ui/src/stores/persist.store.ts b/react-ui/src/stores/persist.store.ts
index d66bcf930..bda77de7e 100644
--- a/react-ui/src/stores/persist.store.ts
+++ b/react-ui/src/stores/persist.store.ts
@@ -1,10 +1,10 @@
-import deviceReducer from "@reducer/device.reducer/device.reducer";
-import routineReducer from "@reducer/routine.reducer";
+import deviceReducer from "@component/devices/reducer/device.reducer";
+import routineReducer from "@shared/reducer/routine.reducer";
+import userReducer from "@shared/reducer/user.reducer";
 import { combineReducers } from "redux";
 import { persistReducer } from "redux-persist";
 import storage from "redux-persist/es/storage";
 import { emptySplitApi } from "./api.store";
-import userReducer from "/src/shared/store/user.reducer";
 
 
 /** local storage config */
-- 
GitLab