feat(added new tests for testing vue components Routers, updated routes logic, added nan check for route fields):

proxy-ui-app/src/store/modules/proxy/helpers.js

@@ -1,5 +1,6 @@
 const addedSite = (addedSite, sites) => {
-  return [addedSite,...sites]
+  const sitesWithoutNewSite = removedNewSite(sites)
+  return [addedSite,...sitesWithoutNewSite]
 }
 
 const updatedSite = (updatedSite, sites) => {
@@ -41,6 +42,7 @@ const updatedRoute = (updatedRoute, routes) => {
   return routes.reduce((acc, cur) => {
     if (cur.id === updatedRoute.id) {
       return  [...acc, {
+        ...cur,
         ...updatedRoute,
         action: updatedRoute.action === "create" ? "create" : "update"
       }]

proxy-ui-app/src/store/modules/proxy/index.js

@@ -15,8 +15,8 @@ const initState = {
   selectedSite: null,
 
   routes: [],
+  newRoute: null,
   routesState: "await",
-  routesLib: {},
 };
 
 const state = {
@@ -27,14 +27,11 @@ const getters = {
   isSaveData:  (state) => state.isSaveData,
   sites:        (state) => state.sites,
   routes:       (state) => state.routes.filter(({action}) => !["remove", "delete"].includes(action)),
-  routesLib:    (state) => state.routes.reduce((acc, cur) => ({
-    ...acc,
-    [cur.id]: cur
-  }), {}),
   routesState:  (state) => state.routesState,
   sitesState:   (state) => state.sitesState,
   routeOptions: () => routeOptions,
   selectedSite: (state) => state.selectedSite,
+  newRoute:     (state) => state.newRoute,
 };
 
 const mutations = {
@@ -44,6 +41,7 @@ const mutations = {
   setSelectedSite: (state, payload) => state.selectedSite = payload,
   setRoutes: (state, payload) => state.routes = payload,
   setRoutesState: (state, payload) => state.routesState = payload,
+  setNewRoute: (state, payload) => state.newRoute = payload,
 };
 
 const actions = {
@@ -114,14 +112,20 @@ const actions = {
       action: "create",
       server_id: getters.selectedSite.id
     }
+    commit('setNewRoute', newRoute)
     commit('setRoutes', [newRoute, ...state.routes])
   },
   updateRouteRow: ({commit, state}, editRoute) => {
-    const updatedRoutes = updatedRoute(editRoute, state.routes)
+    const editedRoute = state.newRoute ? {...state.newRoute, ...editRoute} : editRoute
+    const updatedRoutes = updatedRoute(editedRoute, state.routes)
+    if (state.newRoute && state.newRoute.id === editRoute.id) {
+      commit('setNewRoute', {...state.newRoute, ...editRoute})
+    }
     commit('setRoutes', updatedRoutes)
   },
   updateRoutesWithApi: async ({commit, state}, payload) => {
     commit('setRoutesState', "loading")
+    if (!state.routes || isEmpty(state.routes)) return commit('setRoutesState', "await")
     let updatedRoutes = state.routes.filter(({action}) => action)
     updatedRoutes = updatedRoutes.map((el) => {
       if (el.action === "create") return dissoc('id', el)
@@ -132,6 +136,7 @@ const actions = {
     routes = sortedRoutes(routes)
     commit('setRoutes', routes)
     commit('setRoutesState', "await")
+    commit('setNewRoute', null)
   },
   removeRoute: ({commit, state}, {id}) => {
     const updatedRoutes = deletedRoute(id, state.routes)