From 9dde627214ea068065a5f2999b949e15b5163357 Mon Sep 17 00:00:00 2001
From: Al Garcia <agarcia@gemcousa.com>
Date: Mon, 10 Oct 2022 09:28:43 -0500
Subject: [PATCH] Version funcional, pero malfunciona cuando se hace un
 referesh del url

---
 src/Components/Home/Home.tsx                  |  22 +-
 src/Components/Login/Login.tsx                |  25 +-
 src/Components/Logout/Logout.tsx              |   7 +-
 src/Components/Navbar/Navbar.tsx              |   2 +-
 src/Components/Operaciones/Viaje/Viaje.tsx    | 404 +++++++++---------
 .../ProtectedRoutes/ProtectedRoute.tsx        |   2 +-
 .../Utils/Autocomplete/Autocomplete.tsx       |  89 ----
 src/Services/Auth/Auth.Services.ts            |   8 +-
 src/Services/Auth/config/http-common.ts       |  43 +-
 .../Catalogos/CatClientes.Services.ts         |   4 +-
 10 files changed, 260 insertions(+), 346 deletions(-)
 delete mode 100644 src/Components/Utils/Autocomplete/Autocomplete.tsx

diff --git a/src/Components/Home/Home.tsx b/src/Components/Home/Home.tsx
index 7b5bb83..0bd30b9 100644
--- a/src/Components/Home/Home.tsx
+++ b/src/Components/Home/Home.tsx
@@ -32,8 +32,8 @@ export const Home: FC<IProps> = (props) => {
     (window.localStorage.getItem('menu') ? window.localStorage.getItem('menu') : '')!
   )
 
-  const loadCatalogs = () => {
-    DSCatClientes.Get()
+  const loadCatalogs = async () => {
+    await DSCatClientes.Get()
       .then((response) => {
         //     console.log(response.data)
         dispatch(populateCatClientes(response.data))
@@ -64,17 +64,25 @@ export const Home: FC<IProps> = (props) => {
   const validateToken = () => {
     DSAuth.Validate()
       .then((response) => {
-        dispatch(populateMenuItems(JSON.parse(menuStr)))
-        dispatch(populateUserProfile(token))
+        // dispatch(populateMenuItems(JSON.parse(menuStr)))
+        // dispatch(populateUserProfile(token))
+        alert('token valido')
         loadCatalogs()
         navigate('/', { replace: true })
       })
-      .catch((e: Error) => {})
+      .catch((e: Error) => {
+        console.log('Error: ' + e.message.toString())
+      })
   }
 
   useEffect(() => {
-    if (!UserLogued) validateToken()
-  }, [UserLogued])
+    // if (!UserLogued)
+    // validateToken()
+  }, [])
+
+  useEffect(() => {
+    alert('token: ' + token)
+  }, [token])
 
   return (
     <div>
diff --git a/src/Components/Login/Login.tsx b/src/Components/Login/Login.tsx
index 58779bb..2e6c9dd 100644
--- a/src/Components/Login/Login.tsx
+++ b/src/Components/Login/Login.tsx
@@ -35,7 +35,7 @@ export const Login: FC<IProps> = (props) => {
     (window.localStorage.getItem('menu') ? window.localStorage.getItem('menu') : '')!
   )
 
-  const Login = () => {
+  const Login = async () => {
     const data: IAuth = {
       usuario: Usuario,
       contrasena: Contrasena,
@@ -48,7 +48,8 @@ export const Login: FC<IProps> = (props) => {
         localStorage.setItem('tokenInfo', JSON.stringify(jwt_decode(response.data.token)))
         dispatch(populateMenuItems(response.data.menu))
         dispatch(populateUserProfile(response.data.token))
-        loadCatalogs()
+        //loadCatalogs()
+        //alert(localStorage.getItem('token'))
         navigate('/', { replace: true })
       })
       .catch((e: Error) => {
@@ -87,18 +88,30 @@ export const Login: FC<IProps> = (props) => {
   const validateToken = () => {
     DSAuth.Validate()
       .then((response) => {
-        dispatch(populateMenuItems(JSON.parse(menuStr)))
-        dispatch(populateUserProfile(token))
+        // dispatch(populateMenuItems(JSON.parse(menuStr)))
+        // dispatch(populateUserProfile(token))
+        //alert('token valido')
         loadCatalogs()
         navigate('/', { replace: true })
       })
-      .catch((e: Error) => {})
+      .catch((e: Error) => {
+        alert('no valido')
+      })
   }
 
   useEffect(() => {
-    if (!UserLogued) validateToken()
+    if (token.length > 5) {
+      validateToken()
+    }
   }, [token])
 
+  useEffect(() => {
+    //alert('user logued:' + UserLogued)
+    if (UserLogued) {
+      //loadCatalogs()
+    }
+  }, [UserLogued])
+
   return (
     <div hidden={token ? true : false}>
       <div className='Auth-form-container'>
diff --git a/src/Components/Logout/Logout.tsx b/src/Components/Logout/Logout.tsx
index b3b92b6..2954aeb 100644
--- a/src/Components/Logout/Logout.tsx
+++ b/src/Components/Logout/Logout.tsx
@@ -12,12 +12,13 @@ export const Logout: FC<IProps> = (props) => {
   const dispatch = useDispatch()
 
   useEffect(() => {
-    localStorage.removeItem('token')
-    localStorage.removeItem('menu')
+    /*  localStorage.getItem('tokenInfo')
+    localStorage.getItem('token')
+    localStorage.removeItem('menu') */
+    localStorage.clear()
     dispatch(resetUserProfile(''))
     dispatch(resetMenuItems(''))
     dispatch(resetCatClientes(''))
-    // alert('on logout')
     navigate('/', { replace: true })
   }, [])
 
diff --git a/src/Components/Navbar/Navbar.tsx b/src/Components/Navbar/Navbar.tsx
index 0d6ea9f..b2f7ba8 100644
--- a/src/Components/Navbar/Navbar.tsx
+++ b/src/Components/Navbar/Navbar.tsx
@@ -20,7 +20,7 @@ function Submenu({ descripcion, menu }: Isubmenu) {
           })
           .map((item, index) => {
             return (
-              <NavDropdown.Item to={item.url} as={Link}>
+              <NavDropdown.Item key={item.id} to={item.url} as={Link}>
                 {item.descripcion}
               </NavDropdown.Item>
             )
diff --git a/src/Components/Operaciones/Viaje/Viaje.tsx b/src/Components/Operaciones/Viaje/Viaje.tsx
index ac1b79e..5229d82 100644
--- a/src/Components/Operaciones/Viaje/Viaje.tsx
+++ b/src/Components/Operaciones/Viaje/Viaje.tsx
@@ -1,155 +1,155 @@
-import { FC, useEffect, useRef, useState } from 'react';
-import { Button, ButtonGroup, Card, Col, Dropdown, DropdownButton, Form, ListGroup, Modal, Row } from 'react-bootstrap';
-import { useDispatch, useSelector } from 'react-redux';
-import DTOOpViajes from '../../../DTOs/Operaciones/DTOViajes';
-import DSOpViajes from '../../../Services/Operaciones/OpViajes.Services';
-import { updateOpViajes } from '../../../store/features/Operaciones/OpViajesSlice';
-import { RootState } from '../../../store/store';
+import { FC, useEffect, useRef, useState } from 'react'
+import { Button, ButtonGroup, Card, Col, Dropdown, DropdownButton, Form, ListGroup, Modal, Row } from 'react-bootstrap'
+import { useDispatch, useSelector } from 'react-redux'
+import DTOOpViajes from '../../../DTOs/Operaciones/DTOViajes'
+import DSOpViajes from '../../../Services/Operaciones/OpViajes.Services'
+import { updateOpViajes } from '../../../store/features/Operaciones/OpViajesSlice'
+import { RootState } from '../../../store/store'
 import {
   populateOpViajesServicios,
   updateOpViajesServicios,
-} from '../../../store/features/Operaciones/OpViajesServiciosSlice';
-import DTOViajesServicios from '../../../DTOs/Operaciones/DTOViajesServicios';
-import { Servicios } from '../Viaje/Servicios/Servicios';
-import DatePicker from 'react-datepicker';
-import 'react-datepicker/dist/react-datepicker.css';
-import 'react-bootstrap-typeahead/css/Typeahead.css';
-import 'react-bootstrap-typeahead/css/Typeahead.bs5.css';
-import '../../../css/autoComplete.css';
-import { IconContext } from 'react-icons';
-import { FaCaretSquareDown, FaCaretSquareLeft } from 'react-icons/fa';
+} from '../../../store/features/Operaciones/OpViajesServiciosSlice'
+import DTOViajesServicios from '../../../DTOs/Operaciones/DTOViajesServicios'
+import { Servicios } from '../Viaje/Servicios/Servicios'
+import DatePicker from 'react-datepicker'
+import 'react-datepicker/dist/react-datepicker.css'
+import 'react-bootstrap-typeahead/css/Typeahead.css'
+import 'react-bootstrap-typeahead/css/Typeahead.bs5.css'
+import '../../../css/autoComplete.css'
+import { IconContext } from 'react-icons'
+import { FaCaretSquareDown, FaCaretSquareLeft } from 'react-icons/fa'
 
 interface IProps {
-  IDViaje: number;
+  IDViaje: number
 }
 
 interface IOpciones {
-  value: string;
-  label: string;
+  value: string
+  label: string
 }
 
 export const Viaje: FC<IProps> = (props) => {
-  const [selectedOption, setselectedOption] = useState<IOpciones | null>();
-  const dispatch = useDispatch();
-  const mAllTrips = useSelector((state: RootState) => state.OpViajes.OpViajes);
-  const mAllTripServices = useSelector((state: RootState) => state.OpViajesServicios.OpViajesServicios);
-  const Info = JSON.parse(localStorage.getItem('tokenInfo') || '[]');
-  const UserID = Info.UserId;
-  const mCatClientes = useSelector((state: RootState) => state.CatClientes.CatClientes);
-  const mCatProveedores = useSelector((state: RootState) => state.CatProveedores.CatProveedores);
-  const CatTipoUnidades = useSelector((state: RootState) => state.CatTipoUnidades.CatTipoUnidades);
-  const mCatUbicaciones = useSelector((state: RootState) => state.CatUbicaciones.CatUbicaciones);
-  const mCatServicios = useSelector((state: RootState) => state.CatServicios.CatServicios);
-  const CatAduanas = useSelector((state: RootState) => state.CatAduanas.CatAduanas);
-  const [NoCaja, setNoCaja] = useState('');
-  const [UltimaCaja, setUltimaCaja] = useState('');
-  const [IDViaje, setIDViaje] = useState(0);
-  const [IDDetail, setIDDetail] = useState(0);
-  const [IDCliente, setIDCliente] = useState(0);
-  const [Cliente, setCliente] = useState('');
-  const [IDProveedor, setIDProveedor] = useState(0);
-  const [Proveedor, setProveedor] = useState('');
-  const [IDServicio, setIDServicio] = useState(0);
-  const [Servicio, setServicio] = useState('');
-  const [IDTipoUnidad, setIDTipoUnidad] = useState(0);
-  const [IDOrigen, setIDOrigen] = useState(0);
-  const [Origen, setOrigen] = useState('');
-  const [IDDestino, setIDDestino] = useState(0);
-  const [Destino, setDestino] = useState('');
-  const [RefAA, setRefAA] = useState('');
-  const [PickUpNumber, setPickUpNumber] = useState('');
-  const [Hazmat, setHazmat] = useState(0);
-  const [Pedimento, setPedimento] = useState('');
-  const [TipoOperacion, setTipoOperacion] = useState(1);
-  const [Comentarios, setComentarios] = useState('');
-  const [Aduana, setAduana] = useState(0);
-  const [DisableAduana, setDisableAduana] = useState(true);
-  const [TotalServicios, setTotalServicios] = useState(0);
-  const [Cita, setCita] = useState<Date | null>();
-  const [SelectedClient, setSelectedClient] = useState(false);
-  const [SelectedOrigen, setSelectedOrigen] = useState(false);
-  const [SelectedDestino, setSelectedDestino] = useState(false);
-  const [SelectedServicio, setSelectedServicio] = useState(false);
-  const [SelectedProveedor, setSelectedProveedor] = useState(false);
-  const inputRef = useRef();
+  const [selectedOption, setselectedOption] = useState<IOpciones | null>()
+  const dispatch = useDispatch()
+  const mAllTrips = useSelector((state: RootState) => state.OpViajes.OpViajes)
+  const mAllTripServices = useSelector((state: RootState) => state.OpViajesServicios.OpViajesServicios)
+  const Info = JSON.parse(localStorage.getItem('tokenInfo') || '[]')
+  const UserID = Info.UserId
+  const mCatClientes = useSelector((state: RootState) => state.CatClientes.CatClientes)
+  const mCatProveedores = useSelector((state: RootState) => state.CatProveedores.CatProveedores)
+  const CatTipoUnidades = useSelector((state: RootState) => state.CatTipoUnidades.CatTipoUnidades)
+  const mCatUbicaciones = useSelector((state: RootState) => state.CatUbicaciones.CatUbicaciones)
+  const mCatServicios = useSelector((state: RootState) => state.CatServicios.CatServicios)
+  const CatAduanas = useSelector((state: RootState) => state.CatAduanas.CatAduanas)
+  const [NoCaja, setNoCaja] = useState('')
+  const [UltimaCaja, setUltimaCaja] = useState('')
+  const [IDViaje, setIDViaje] = useState(0)
+  const [IDDetail, setIDDetail] = useState(0)
+  const [IDCliente, setIDCliente] = useState(0)
+  const [Cliente, setCliente] = useState('')
+  const [IDProveedor, setIDProveedor] = useState(0)
+  const [Proveedor, setProveedor] = useState('')
+  const [IDServicio, setIDServicio] = useState(0)
+  const [Servicio, setServicio] = useState('')
+  const [IDTipoUnidad, setIDTipoUnidad] = useState(0)
+  const [IDOrigen, setIDOrigen] = useState(0)
+  const [Origen, setOrigen] = useState('')
+  const [IDDestino, setIDDestino] = useState(0)
+  const [Destino, setDestino] = useState('')
+  const [RefAA, setRefAA] = useState('')
+  const [PickUpNumber, setPickUpNumber] = useState('')
+  const [Hazmat, setHazmat] = useState(0)
+  const [Pedimento, setPedimento] = useState('')
+  const [TipoOperacion, setTipoOperacion] = useState(1)
+  const [Comentarios, setComentarios] = useState('')
+  const [Aduana, setAduana] = useState(0)
+  const [DisableAduana, setDisableAduana] = useState(true)
+  const [TotalServicios, setTotalServicios] = useState(0)
+  const [Cita, setCita] = useState<Date | null>()
+  const [SelectedClient, setSelectedClient] = useState(false)
+  const [SelectedOrigen, setSelectedOrigen] = useState(false)
+  const [SelectedDestino, setSelectedDestino] = useState(false)
+  const [SelectedServicio, setSelectedServicio] = useState(false)
+  const [SelectedProveedor, setSelectedProveedor] = useState(false)
+  const inputRef = useRef()
 
   useEffect(() => {
-    if (IDServicio > 0 && TotalServicios === 0) saveDetail();
+    if (IDServicio > 0 && TotalServicios === 0) saveDetail()
     let selectedRow = mAllTrips.filter((row) => {
       if (row.id === props.IDViaje) {
-        setIDViaje(row.id);
-        setRefAA(row.refAgenciaAduanal);
-        setIDCliente(row.cliente);
-        setIDTipoUnidad(row.tipoUnidad);
-        setNoCaja(row.noCaja);
-        setIDOrigen(row.origen);
-        setIDDestino(row.destino);
-        setHazmat(row.hazmat);
-        setPickUpNumber(row.pickUpNumber);
-        setTipoOperacion(row.tipoOperacion);
-        setPedimento(row.pedimento);
-        setCliente(row.sCliente);
-        setOrigen(row.sOrigen);
-        setDestino(row.sDestino);
-        setSelectedClient(false);
-        setSelectedOrigen(true);
-        setSelectedDestino(true);
-        setSelectedServicio(true);
-        setSelectedProveedor(true);
-        return row;
+        setIDViaje(row.id)
+        setRefAA(row.refAgenciaAduanal)
+        setIDCliente(row.cliente)
+        setIDTipoUnidad(row.tipoUnidad)
+        setNoCaja(row.noCaja)
+        setIDOrigen(row.origen)
+        setIDDestino(row.destino)
+        setHazmat(row.hazmat)
+        setPickUpNumber(row.pickUpNumber)
+        setTipoOperacion(row.tipoOperacion)
+        setPedimento(row.pedimento)
+        setCliente(row.sCliente)
+        setOrigen(row.sOrigen)
+        setDestino(row.sDestino)
+        setSelectedClient(true)
+        setSelectedOrigen(true)
+        setSelectedDestino(true)
+        setSelectedServicio(true)
+        setSelectedProveedor(true)
+        return row
       }
-    });
+    })
     let totalServicios = mAllTripServices.filter((a) => {
       if (a.idViaje === IDViaje) {
-        return a;
+        return a
       }
-    });
-    setTotalServicios(totalServicios.length);
-  }, [IDViaje]);
+    })
+    setTotalServicios(totalServicios.length)
+  }, [IDViaje])
 
   useEffect(() => {
-    if (IDServicio === 1 || IDServicio === 2 || IDServicio === 22) setDisableAduana(false);
-    else setDisableAduana(true);
+    if (IDServicio === 1 || IDServicio === 2 || IDServicio === 22) setDisableAduana(false)
+    else setDisableAduana(true)
     if (IDServicio > 0) {
       let serviceFound = mCatServicios.filter((item) => {
         if (item.id == IDServicio) {
-          return item;
+          return item
         }
-      });
-      setServicio(serviceFound[0].servicio);
+      })
+      setServicio(serviceFound[0].servicio)
     }
     if (IDProveedor > 0) {
       let providerFound = mCatProveedores.filter((item) => {
         if (item.id == IDProveedor) {
-          return item;
+          return item
         }
-      });
-      setProveedor(providerFound[0].proveedor);
+      })
+      setProveedor(providerFound[0].proveedor)
     }
-  }, [IDServicio]);
+  }, [IDServicio])
 
   useEffect(() => {
     DSOpViajes.GetLastTrailerBox(IDViaje)
       .then((response) => {
-        const LastTrailerBox = response.data.ultimaCaja;
+        const LastTrailerBox = response.data.ultimaCaja
         //  console.log('lasttrailerbox=' + LastTrailerBox)
-        if (LastTrailerBox.length === 0) setUltimaCaja(NoCaja);
-        else setUltimaCaja(LastTrailerBox);
+        if (LastTrailerBox.length === 0) setUltimaCaja(NoCaja)
+        else setUltimaCaja(LastTrailerBox)
       })
       .catch((e: Error) => {
         //  console.log('currio un error')
-      });
+      })
     //console.log('nocaja=' + NoCaja)
-  }, [NoCaja]);
+  }, [NoCaja])
 
   useEffect(() => {
-    if (Hazmat === 1) setAduana(180);
-    else setAduana(0);
-  }, [Hazmat]);
+    if (Hazmat === 1) setAduana(180)
+    else setAduana(0)
+  }, [Hazmat])
 
   const saveDetail = () => {
     if (IDServicio === 0 || IDProveedor === 0) {
-      return false;
+      return false
     }
     const data: DTOViajesServicios = {
       id: IDDetail,
@@ -162,52 +162,52 @@ export const Viaje: FC<IProps> = (props) => {
       idProveedor: IDProveedor,
       sProveedor: '',
       noCaja: UltimaCaja,
-    };
+    }
     DSOpViajes.AppendServices(data)
       .then((responsed) => {
         if (IDDetail === 0) {
-          dispatch(populateOpViajesServicios(responsed.data));
-          setIDDetail(responsed.data[0].id);
+          dispatch(populateOpViajesServicios(responsed.data))
+          setIDDetail(responsed.data[0].id)
         } else {
-          dispatch(updateOpViajesServicios(responsed.data));
+          dispatch(updateOpViajesServicios(responsed.data))
         }
-        clearDetailForm();
+        clearDetailForm()
       })
-      .catch((e: Error) => {});
-  };
+      .catch((e: Error) => {})
+  }
 
   const adjustTimeZone = (str: string): string => {
     if (str) {
-      const original: any = new Date(str);
-      const real = new Date(original - original.getTimezoneOffset() * 60 * 1000);
-      return real.toISOString();
-    } else return '';
-  };
+      const original: any = new Date(str)
+      const real = new Date(original - original.getTimezoneOffset() * 60 * 1000)
+      return real.toISOString()
+    } else return ''
+  }
 
   const loadService = (id: number) => {
     let found = mAllTripServices.filter((a) => {
       if (a.id === id) {
-        return a;
+        return a
       }
-    });
+    })
     if (found) {
-      setIDDetail(id);
-      setAduana(found[0].aduana);
-      setIDServicio(found[0].idServicio);
-      setComentarios(found[0].comentarios);
-      setIDProveedor(found[0].idProveedor);
+      setIDDetail(id)
+      setAduana(found[0].aduana)
+      setIDServicio(found[0].idServicio)
+      setComentarios(found[0].comentarios)
+      setIDProveedor(found[0].idProveedor)
     }
-  };
+  }
 
   const saveMaster = () => {
     if (TotalServicios === 0) {
       if (IDServicio === 0) {
-        alert('Para continuar, primero seleccione un servicio ');
-        return false;
+        alert('Para continuar, primero seleccione un servicio ')
+        return false
       }
       if (IDProveedor === 0) {
-        alert('Para continuar, primero seleccione un proveedor');
-        return false;
+        alert('Para continuar, primero seleccione un proveedor')
+        return false
       }
     }
     /*      */
@@ -232,44 +232,32 @@ export const Viaje: FC<IProps> = (props) => {
       pedimento: Pedimento,
       max: true,
       status: 1,
-    };
+    }
     DSOpViajes.Append(data)
       .then((response) => {
-        const data = response.data;
-        data['max'] = false;
-        dispatch(updateOpViajes(data));
-        setIDViaje(data.id);
+        const data = response.data
+        data['max'] = false
+        dispatch(updateOpViajes(data))
+        setIDViaje(data.id)
       })
-      .catch((e: Error) => {});
-  };
+      .catch((e: Error) => {})
+  }
 
   const clearDetailForm = () => {
-    setIDDetail(0);
-    setAduana(0);
-    setIDServicio(0);
-    setComentarios('');
-    setIDProveedor(0);
-    setUltimaCaja('');
-    setServicio('');
-    setProveedor('');
-    setDisableAduana(true);
-  };
+    setIDDetail(0)
+    setAduana(0)
+    setIDServicio(0)
+    setComentarios('')
+    setIDProveedor(0)
+    setUltimaCaja('')
+    setServicio('')
+    setProveedor('')
+    setDisableAduana(true)
+  }
 
   useEffect(() => {
-    console.log(selectedOption);
-  }, [selectedOption]);
-
-  const [addrtype, setAddrtype] = useState(['Work', 'Home', 'school']);
-  const Add = addrtype.map((Add) => Add);
-  const handleAddrTypeChange = (e: any) => console.log(addrtype[e.target.value]);
-
-  const companies: string[] = ['Company1', 'Company2', 'Big Corp', 'Happy Toy Company'];
-
-  const lowerCasedCompanies = companies.map((language) => language.toLowerCase());
-
-  function getSuggestions(value: string): string[] {
-    return lowerCasedCompanies.filter((language) => language.startsWith(value.trim().toLowerCase()));
-  }
+    console.log(selectedOption)
+  }, [selectedOption])
 
   const handleKeyDown = (e: any) => {
     //  const { cursor, result } = this.state
@@ -279,9 +267,9 @@ export const Viaje: FC<IProps> = (props) => {
       
     } else */
     if (e.keyCode === 40) {
-      console.log('arrow down');
+      console.log('arrow down')
     }
-  };
+  }
 
   return (
     <div className='tripField'>
@@ -303,7 +291,7 @@ export const Viaje: FC<IProps> = (props) => {
                 size='sm'
                 className='dialogLabel'
                 onChange={(e) => {
-                  setRefAA(e.target.value);
+                  setRefAA(e.target.value)
                 }}
               />
             </Col>
@@ -322,11 +310,11 @@ export const Viaje: FC<IProps> = (props) => {
                     size='sm'
                     className='pull-right'
                     onChange={(e) => {
-                      setCliente(e.target.value);
-                      setSelectedClient(false);
+                      setCliente(e.target.value)
+                      setSelectedClient(false)
                     }}
                     onKeyDown={(e) => {
-                      handleKeyDown(e);
+                      handleKeyDown(e)
                     }}
                   />
                   <Dropdown className='d-inline mx-6' show={!SelectedClient}>
@@ -336,9 +324,9 @@ export const Viaje: FC<IProps> = (props) => {
                         .map((result) => (
                           <Dropdown.Item
                             onClick={() => {
-                              setIDCliente(result.id);
-                              setCliente(result.cliente);
-                              setSelectedClient(true);
+                              setIDCliente(result.id)
+                              setCliente(result.cliente)
+                              setSelectedClient(true)
                             }}
                           >
                             {result.cliente}
@@ -369,7 +357,7 @@ export const Viaje: FC<IProps> = (props) => {
               <Form.Control
                 as='select'
                 onChange={(e) => {
-                  setIDTipoUnidad(parseInt(e.target.value));
+                  setIDTipoUnidad(parseInt(e.target.value))
                 }}
                 value={IDTipoUnidad}
                 className='form-select form-select-sm dialogLabel'
@@ -381,7 +369,7 @@ export const Viaje: FC<IProps> = (props) => {
                         <option key={c.id} value={c.id}>
                           {c.tipoUnidad}
                         </option>
-                      );
+                      )
                     })
                   : null}
               </Form.Control>
@@ -397,7 +385,7 @@ export const Viaje: FC<IProps> = (props) => {
                 size='sm'
                 className='dialogLabel'
                 onChange={(e) => {
-                  setNoCaja(e.target.value);
+                  setNoCaja(e.target.value)
                 }}
               />
             </Col>
@@ -415,8 +403,8 @@ export const Viaje: FC<IProps> = (props) => {
                     size='sm'
                     className='textBoxViaje'
                     onChange={(e) => {
-                      setOrigen(e.target.value);
-                      setSelectedOrigen(false);
+                      setOrigen(e.target.value)
+                      setSelectedOrigen(false)
                     }}
                   />
                   <Dropdown className='d-inline mx-6' show={!SelectedOrigen}>
@@ -430,9 +418,9 @@ export const Viaje: FC<IProps> = (props) => {
                         .map((result) => (
                           <Dropdown.Item
                             onClick={() => {
-                              setIDOrigen(result.id);
-                              setOrigen(result.ubicacion);
-                              setSelectedOrigen(true);
+                              setIDOrigen(result.id)
+                              setOrigen(result.ubicacion)
+                              setSelectedOrigen(true)
                             }}
                           >
                             {result.ubicacion}
@@ -470,8 +458,8 @@ export const Viaje: FC<IProps> = (props) => {
                     size='sm'
                     className='dialogLabel'
                     onChange={(e) => {
-                      setDestino(e.target.value);
-                      setSelectedDestino(false);
+                      setDestino(e.target.value)
+                      setSelectedDestino(false)
                     }}
                   />
                   <Dropdown className='d-inline mx-6' show={!SelectedDestino}>
@@ -485,9 +473,9 @@ export const Viaje: FC<IProps> = (props) => {
                         .map((result) => (
                           <Dropdown.Item
                             onClick={() => {
-                              setIDDestino(result.id);
-                              setDestino(result.ubicacion);
-                              setSelectedDestino(true);
+                              setIDDestino(result.id)
+                              setDestino(result.ubicacion)
+                              setSelectedDestino(true)
                             }}
                           >
                             {result.ubicacion}
@@ -518,7 +506,7 @@ export const Viaje: FC<IProps> = (props) => {
               <Form.Control
                 as='select'
                 onChange={(e) => {
-                  setHazmat(parseInt(e.target.value));
+                  setHazmat(parseInt(e.target.value))
                 }}
                 value={Hazmat}
                 className='form-select form-select-sm dialogLabel'
@@ -534,7 +522,7 @@ export const Viaje: FC<IProps> = (props) => {
               <Form.Control
                 as='select'
                 onChange={(e) => {
-                  setTipoOperacion(parseInt(e.target.value));
+                  setTipoOperacion(parseInt(e.target.value))
                 }}
                 value={TipoOperacion}
                 className='form-select form-select-sm dialogLabel'
@@ -557,7 +545,7 @@ export const Viaje: FC<IProps> = (props) => {
                 size='sm'
                 className='dialogLabel'
                 onChange={(e) => {
-                  setPedimento(e.target.value);
+                  setPedimento(e.target.value)
                 }}
               />
             </Col>
@@ -570,7 +558,7 @@ export const Viaje: FC<IProps> = (props) => {
                 size='sm'
                 className='dialogLabel'
                 onChange={(e) => {
-                  setPickUpNumber(e.target.value);
+                  setPickUpNumber(e.target.value)
                 }}
               />
             </Col>
@@ -596,11 +584,11 @@ export const Viaje: FC<IProps> = (props) => {
                     size='sm'
                     className='dialogLabel'
                     onChange={(e) => {
-                      setServicio(e.target.value);
-                      setSelectedServicio(false);
+                      setServicio(e.target.value)
+                      setSelectedServicio(false)
                     }}
                     onKeyDown={(e) => {
-                      handleKeyDown(e);
+                      handleKeyDown(e)
                     }}
                   />
                   <Dropdown className='d-inline mx-6' show={!SelectedServicio}>
@@ -610,9 +598,9 @@ export const Viaje: FC<IProps> = (props) => {
                         .map((result) => (
                           <Dropdown.Item
                             onClick={() => {
-                              setIDServicio(result.id);
-                              setServicio(result.servicio);
-                              setSelectedServicio(true);
+                              setIDServicio(result.id)
+                              setServicio(result.servicio)
+                              setSelectedServicio(true)
                             }}
                           >
                             {result.servicio}
@@ -640,8 +628,8 @@ export const Viaje: FC<IProps> = (props) => {
               <Button
                 variant='primary'
                 onClick={() => {
-                  saveMaster();
-                  saveDetail();
+                  saveMaster()
+                  saveDetail()
                 }}
               >
                 Guardar
@@ -662,8 +650,8 @@ export const Viaje: FC<IProps> = (props) => {
                     size='sm'
                     className='dialogLabel'
                     onChange={(e) => {
-                      setProveedor(e.target.value);
-                      setSelectedProveedor(false);
+                      setProveedor(e.target.value)
+                      setSelectedProveedor(false)
                     }}
                   />
                   <Dropdown className='d-inline mx-6' show={!SelectedProveedor}>
@@ -675,9 +663,9 @@ export const Viaje: FC<IProps> = (props) => {
                         .map((result) => (
                           <Dropdown.Item
                             onClick={() => {
-                              setIDProveedor(result.id);
-                              setProveedor(result.proveedor);
-                              setSelectedProveedor(true);
+                              setIDProveedor(result.id)
+                              setProveedor(result.proveedor)
+                              setSelectedProveedor(true)
                             }}
                           >
                             {result.proveedor}
@@ -710,7 +698,7 @@ export const Viaje: FC<IProps> = (props) => {
                 rows={2}
                 value={Comentarios}
                 onChange={(e) => {
-                  setComentarios(e.target.value);
+                  setComentarios(e.target.value)
                 }}
               />
             </Col>
@@ -725,7 +713,7 @@ export const Viaje: FC<IProps> = (props) => {
                 size='sm'
                 className='dialogLabel'
                 onChange={(e) => {
-                  setUltimaCaja(e.target.value);
+                  setUltimaCaja(e.target.value)
                 }}
               />
             </Col>
@@ -743,7 +731,7 @@ export const Viaje: FC<IProps> = (props) => {
               <Form.Control
                 as='select'
                 onChange={(e) => {
-                  setAduana(parseInt(e.target.value));
+                  setAduana(parseInt(e.target.value))
                 }}
                 value={Aduana}
                 disabled={DisableAduana}
@@ -755,7 +743,7 @@ export const Viaje: FC<IProps> = (props) => {
                         <option key={c.id} value={c.id}>
                           {c.Aduana}
                         </option>
-                      );
+                      )
                     })
                   : null}
               </Form.Control>
@@ -769,7 +757,7 @@ export const Viaje: FC<IProps> = (props) => {
                 IDMaster={IDViaje}
                 key={IDViaje}
                 onLoadDetail={function (id: number): void {
-                  loadService(id);
+                  loadService(id)
                 }}
                 actionButtons={true}
               />
@@ -778,5 +766,5 @@ export const Viaje: FC<IProps> = (props) => {
         </Card>
       </Card>
     </div>
-  );
-};
+  )
+}
diff --git a/src/Components/ProtectedRoutes/ProtectedRoute.tsx b/src/Components/ProtectedRoutes/ProtectedRoute.tsx
index 8d86e36..47eef0f 100644
--- a/src/Components/ProtectedRoutes/ProtectedRoute.tsx
+++ b/src/Components/ProtectedRoutes/ProtectedRoute.tsx
@@ -7,5 +7,5 @@ interface IProps {}
 
 export const ProtectedRoute: FC<IProps> = (props) => {
   const UserLogued = useSelector((state: RootState) => state.UserProfile.UserProfile.logueado)
-  return UserLogued ? <Outlet /> : <Navigate to='login' />
+  return UserLogued ? <Outlet /> : <Navigate to='/' />
 }
diff --git a/src/Components/Utils/Autocomplete/Autocomplete.tsx b/src/Components/Utils/Autocomplete/Autocomplete.tsx
deleted file mode 100644
index 45f1442..0000000
--- a/src/Components/Utils/Autocomplete/Autocomplete.tsx
+++ /dev/null
@@ -1,89 +0,0 @@
-import React, { FC, useEffect, useState } from 'react'
-import { IconContext } from 'react-icons'
-import { BsXLg } from 'react-icons/bs'
-import { useSelector } from 'react-redux'
-import ICatClientes from '../../../Interfaces/Catalogos/ICatClientes'
-import { RootState } from '../../../store/store'
-
-interface IProps {
-  input: string
-}
-
-export const Autocomplete: FC<IProps> = (props) => {
-  const mCatClientes = useSelector((state: RootState) => state.CatClientes.CatClientes)
-  const [Cliente, setCliente] = useState('')
-  const [IDCliente, setIDCliente] = useState(0)
-  const [toggleSelect, setToggleSelect] = useState(false)
-
-  const loadInfo = (data: ICatClientes) => {
-    setIDCliente(data.id)
-    setCliente(data.cliente)
-    setToggleSelect(false)
-  }
-
-  const handleKeyDown = (event: any) => {
-    if (event.key === 'Enter') {
-      console.log('Pasa este informacion al parent component')
-      setToggleSelect(false)
-    }
-  }
-
-  useEffect(() => {
-    if (Cliente.length > 0) setToggleSelect(true)
-  }, [Cliente])
-
-  return (
-    <>
-      <div className='form-group'>
-        <div className='col-sm-12 parent'>
-          <div className='input-group'>
-            <input type='hidden' className='form-control' name='IDCliente' id='IDCliente' value={IDCliente} />
-            <input
-              type='text'
-              className='form-control genericSelect'
-              name='Guia'
-              id='Guia'
-              style={{ height: '30px' }}
-              value={Cliente}
-              placeholder='Cliente...'
-              onChange={(e) => {
-                setCliente(e.target.value)
-              }}
-              onKeyDown={(e) => handleKeyDown(e)}
-              onFocus={() => setToggleSelect(true)}
-              /* onBlur={() => setToggleSelect(false)} */
-            />
-            <span
-              className='input-group-addon sorroundImage'
-              onClick={() => {
-                setCliente('')
-                setToggleSelect(false)
-              }}
-            >
-              <IconContext.Provider value={{ color: 'red', size: '21px' }}>
-                <BsXLg />
-              </IconContext.Provider>
-            </span>
-            <div className='child' style={toggleSelect ? { visibility: 'visible' } : { visibility: 'hidden' }}>
-              <ul className='cleanLi'>
-                {mCatClientes
-                  ? mCatClientes.map((item, index) => {
-                      return item.id > 0 && item.cliente.toLocaleLowerCase().includes(Cliente.toLocaleLowerCase()) ? (
-                        <li key={item.id}>
-                          <span style={{ paddingLeft: '10px' }} onClick={() => loadInfo(item)}>
-                            {item.cliente}
-                          </span>
-                        </li>
-                      ) : (
-                        ''
-                      )
-                    })
-                  : ''}
-              </ul>
-            </div>
-          </div>
-        </div>
-      </div>
-    </>
-  )
-}
diff --git a/src/Services/Auth/Auth.Services.ts b/src/Services/Auth/Auth.Services.ts
index c88d3fe..f181bc7 100644
--- a/src/Services/Auth/Auth.Services.ts
+++ b/src/Services/Auth/Auth.Services.ts
@@ -5,11 +5,11 @@ import IPermisos from "../../Interfaces/Auth/IPermisos";
 //import Token from '../../Interfaces/token'
 
 class authDataService {
-  login(data: IAuth) {
-    return http.post<IPermisos>("Auth/Login", data);
+  async login(data: IAuth) {
+    return await http.post<IPermisos>("Auth/Login", data);
   }
-  Validate() {
-    return http.get<String>("Auth/Validate");
+  async Validate() {
+    return await http.get<String>("Auth/Validate");
   }
 }
 export default new authDataService();
\ No newline at end of file
diff --git a/src/Services/Auth/config/http-common.ts b/src/Services/Auth/config/http-common.ts
index 0c16ef4..2803379 100644
--- a/src/Services/Auth/config/http-common.ts
+++ b/src/Services/Auth/config/http-common.ts
@@ -1,6 +1,6 @@
 import axios from "axios";
 import { TargetURL } from '../../../Constants/TargetURL'
-const token = localStorage.getItem("token");
+let token = window.localStorage.getItem('token');
 const URL = new TargetURL()
 
 const instance = axios.create({
@@ -13,39 +13,32 @@ const instance = axios.create({
 
 
 instance.interceptors.response.use(function (response) {
-  //if (process.env.NODE_ENV === 'development') console.log('log: '+JSON.stringify(response))
   return response;
 }, function (error) {
-  if ( (window.location.href.indexOf("login")>0) || (window.location.href.indexOf("reset")>0) ) {
-    return Promise.reject(error);
-  }
-  else if (401 === error.response.status) {
+  if (401 === error.response.status) {
     localStorage.clear();
     window.location.href = "/";
-  } else if ((409 === error.response.status) && (error.response.data.respuesta.indexOf('factura'))) {
-    console.log(JSON.stringify(error.response))
-    if (error.response.data.registro.factura) {
-     (error.response.data.registro.id===-1) ?
-      alert(error.response.data.respuesta +
-      ' en la factura: ' +
-      error.response.data.registro.factura +
-      ' en el trafico: CG' +
-      error.response.data.registro.idTrafico) :
-      alert(error.response.data.respuesta + ' en TRADE') 
-     }
   } else {
      return Promise.reject(error);
-  }
+  } 
+  return Promise.reject(error);
 });
 
 
-instance.interceptors.request.use(function (config) {
-/*  if (process.env.NODE_ENV === 'development') 
- console.log('log: '+JSON.stringify(config))*/
-  return config; 
-}, function (error) {
-  return Promise.reject(error);
-});
+instance.interceptors.request.use(
+  (config) => {
+    let token = window.localStorage.getItem('token')
+    if (token) {
+      config.headers!!.Authorization = `Bearer ${token}`;
+    } else {
+      config.headers!!.Authorization = ``;
+    }
+    return config;
+  },
+  (error) => {
+    return Promise.reject(error);
+  }
+);
 
 
 export default instance;
diff --git a/src/Services/Catalogos/CatClientes.Services.ts b/src/Services/Catalogos/CatClientes.Services.ts
index 8e2ed22..5bb69e6 100644
--- a/src/Services/Catalogos/CatClientes.Services.ts
+++ b/src/Services/Catalogos/CatClientes.Services.ts
@@ -3,8 +3,8 @@ import ICatClientes from "../../Interfaces/Catalogos/ICatClientes";
 import IRespuesta from "../../Interfaces/Respuestas/IRespuesta";
 
 class CatClientesDataService {
-  Get() {
-    return http.get<ICatClientes[]>("Catalogos/CatClientes/Get");
+  async Get() {
+    return await http.get<ICatClientes[]>("Catalogos/CatClientes/Get");
   }
   Append(data: ICatClientes) {
     return http.post<ICatClientes>(`Catalogos/CatClientes/Append`,data);