added Sodiohome under the side bar of monitor
This commit is contained in:
parent
7045648622
commit
eaf3364693
|
@ -19,6 +19,7 @@ import { axiosConfigWithoutToken } from './Resources/axiosConfig';
|
|||
import InstallationsContextProvider from './contexts/InstallationsContextProvider';
|
||||
import AccessContextProvider from './contexts/AccessContextProvider';
|
||||
import SalidomoInstallationTabs from './content/dashboards/SalidomoInstallations';
|
||||
import SodiohomeInstallationTabs from './content/dashboards/Installations/index';
|
||||
import { ProductIdContext } from './contexts/ProductIdContextProvider';
|
||||
|
||||
function App() {
|
||||
|
@ -29,7 +30,7 @@ function App() {
|
|||
const navigate = useNavigate();
|
||||
const searchParams = new URLSearchParams(location.search);
|
||||
const username = searchParams.get('username');
|
||||
const { setAccessToSalimax, setAccessToSalidomo } =
|
||||
const { setAccessToSalimax, setAccessToSalidomo,setAccessToSodiohome } =
|
||||
useContext(ProductIdContext);
|
||||
|
||||
const [language, setLanguage] = useState('en');
|
||||
|
@ -71,10 +72,13 @@ function App() {
|
|||
setUser(response.data.user);
|
||||
setAccessToSalimax(response.data.accessToSalimax);
|
||||
setAccessToSalidomo(response.data.accessToSalidomo);
|
||||
setAccessToSodiohome(response.data.accessToSodiohome);
|
||||
if (response.data.accessToSalimax) {
|
||||
navigate(routes.installations);
|
||||
} else {
|
||||
} else if(response.data.accessToSalidomo){
|
||||
navigate(routes.salidomo_installations);
|
||||
} else{
|
||||
navigate(routes.sodiohome_installations);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
@ -162,6 +166,15 @@ function App() {
|
|||
}
|
||||
/>
|
||||
|
||||
<Route
|
||||
path={routes.sodiohome_installations + '*'}
|
||||
element={
|
||||
<AccessContextProvider>
|
||||
<SodiohomeInstallationTabs />
|
||||
</AccessContextProvider>
|
||||
}
|
||||
/>
|
||||
|
||||
<Route path={routes.users + '*'} element={<Users />} />
|
||||
<Route
|
||||
path={'*'}
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
"users": "/users/",
|
||||
"installations": "/installations/",
|
||||
"salidomo_installations": "/salidomo_installations/",
|
||||
"sodiohome_installations": "/sodiohome_installations/",
|
||||
"installation": "installation/",
|
||||
"login": "/login/",
|
||||
"forgotPassword": "/forgotPassword/",
|
||||
|
|
|
@ -36,7 +36,7 @@ function Login() {
|
|||
|
||||
const theme = useTheme();
|
||||
const context = useContext(UserContext);
|
||||
const { setAccessToSalimax, setAccessToSalidomo } =
|
||||
const { setAccessToSalimax, setAccessToSalidomo,setAccessToSodiohome } =
|
||||
useContext(ProductIdContext);
|
||||
const navigate = useNavigate();
|
||||
|
||||
|
@ -78,6 +78,7 @@ function Login() {
|
|||
|
||||
setAccessToSalimax(response.data.accessToSalimax);
|
||||
setAccessToSalidomo(response.data.accessToSalidomo);
|
||||
setAccessToSodiohome(response.data.accessToSodioHome);
|
||||
|
||||
if (rememberMe) {
|
||||
cookies.set('rememberedUsername', username, { path: '/' });
|
||||
|
@ -85,8 +86,10 @@ function Login() {
|
|||
}
|
||||
if (response.data.accessToSalimax) {
|
||||
navigate(routes.installations);
|
||||
} else {
|
||||
} else if(response.data.accessToSalidomo){
|
||||
navigate(routes.salidomo_installations);
|
||||
} else{
|
||||
navigate(routes.sodiohome_installations);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
@ -28,6 +28,9 @@ const InstallationsContextProvider = ({
|
|||
const [salidomoInstallations, setSalidomoInstallations] = useState<
|
||||
I_Installation[]
|
||||
>([]);
|
||||
const [sodiohomeInstallations, setSodiohomeInstallations] = useState<
|
||||
I_Installation[]
|
||||
>([]);
|
||||
const [foldersAndInstallations, setFoldersAndInstallations] = useState([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState(false);
|
||||
|
@ -75,12 +78,24 @@ const InstallationsContextProvider = ({
|
|||
: installation;
|
||||
});
|
||||
|
||||
const updatedSodiohome = sodiohomeInstallations.map((installation) => {
|
||||
const update = pendingUpdates.current[installation.id];
|
||||
return update
|
||||
? {
|
||||
...installation,
|
||||
status: update.status,
|
||||
testingMode: update.testingMode
|
||||
}
|
||||
: installation;
|
||||
});
|
||||
|
||||
setSalidomoInstallations(updatedSalidomo);
|
||||
setSalimaxInstallations(updatedSalimax);
|
||||
setSodiohomeInstallations(updatedSodiohome);
|
||||
|
||||
// Clear the pending updates after applying
|
||||
pendingUpdates.current = {};
|
||||
}, [salidomoInstallations, salimaxInstallations]);
|
||||
}, [salidomoInstallations, salimaxInstallations,sodiohomeInstallations]);
|
||||
|
||||
useEffect(() => {
|
||||
const timer = setInterval(() => {
|
||||
|
@ -98,17 +113,33 @@ const InstallationsContextProvider = ({
|
|||
|
||||
const socket = new WebSocket(urlWithToken);
|
||||
|
||||
// Connection opened
|
||||
socket.addEventListener('open', () => {
|
||||
let installationsToSend = [];
|
||||
|
||||
if (product === 0) {
|
||||
installationsToSend = salimaxInstallations;
|
||||
} else if (product === 1) {
|
||||
installationsToSend = salidomoInstallations;
|
||||
} else if (product === 2) {
|
||||
installationsToSend = sodiohomeInstallations;
|
||||
}
|
||||
|
||||
// Send the corresponding installation IDs
|
||||
socket.send(
|
||||
JSON.stringify(
|
||||
product === 1
|
||||
? salidomoInstallations.map((installation) => installation.id)
|
||||
: salimaxInstallations.map((installation) => installation.id)
|
||||
)
|
||||
JSON.stringify(installationsToSend.map((installation) => installation.id))
|
||||
);
|
||||
});
|
||||
|
||||
// socket.addEventListener('open', () => {
|
||||
// socket.send(
|
||||
// JSON.stringify(
|
||||
// product === 1
|
||||
// ? salidomoInstallations.map((installation) => installation.id)
|
||||
// : salimaxInstallations.map((installation) => installation.id)
|
||||
// )
|
||||
// );
|
||||
// });
|
||||
|
||||
// Periodically send ping messages to keep the connection alive
|
||||
const pingInterval = setInterval(() => {
|
||||
if (socket.readyState === WebSocket.OPEN) {
|
||||
|
@ -166,6 +197,20 @@ const InstallationsContextProvider = ({
|
|||
});
|
||||
}, [navigate, removeToken]);
|
||||
|
||||
const fetchAllSodiohomeInstallations = useCallback(async () => {
|
||||
axiosConfig
|
||||
.get('/GetAllSodiohomeInstallations')
|
||||
.then((res: AxiosResponse<I_Installation[]>) =>
|
||||
setSodiohomeInstallations(res.data)
|
||||
)
|
||||
.catch((err: AxiosError) => {
|
||||
if (err.response?.status === 401) {
|
||||
removeToken();
|
||||
navigate(routes.login);
|
||||
}
|
||||
});
|
||||
}, [navigate, removeToken]);
|
||||
|
||||
const fetchAllFoldersAndInstallations = useCallback(
|
||||
async (product: number) => {
|
||||
axiosConfig
|
||||
|
@ -207,6 +252,8 @@ const InstallationsContextProvider = ({
|
|||
fetchAllInstallations();
|
||||
else if (formValues.product === 1 && view === 'installation')
|
||||
fetchAllSalidomoInstallations();
|
||||
else if (formValues.product === 2 && view === 'installation')
|
||||
fetchAllSodiohomeInstallations();
|
||||
else fetchAllFoldersAndInstallations(formValues.product);
|
||||
setTimeout(() => setUpdated(false), 3000);
|
||||
})
|
||||
|
@ -222,6 +269,7 @@ const InstallationsContextProvider = ({
|
|||
fetchAllFoldersAndInstallations,
|
||||
fetchAllInstallations,
|
||||
fetchAllSalidomoInstallations,
|
||||
fetchAllSodiohomeInstallations,
|
||||
navigate,
|
||||
removeToken
|
||||
]
|
||||
|
@ -237,6 +285,8 @@ const InstallationsContextProvider = ({
|
|||
fetchAllInstallations();
|
||||
else if (formValues.product === 1 && view === 'installation')
|
||||
fetchAllSalidomoInstallations();
|
||||
else if (formValues.product === 2 && view === 'installation')
|
||||
fetchAllSodiohomeInstallations();
|
||||
else fetchAllFoldersAndInstallations(formValues.product);
|
||||
setTimeout(() => setUpdated(false), 3000);
|
||||
})
|
||||
|
@ -252,6 +302,7 @@ const InstallationsContextProvider = ({
|
|||
fetchAllFoldersAndInstallations,
|
||||
fetchAllInstallations,
|
||||
fetchAllSalidomoInstallations,
|
||||
fetchAllSodiohomeInstallations,
|
||||
navigate,
|
||||
removeToken
|
||||
]
|
||||
|
@ -317,9 +368,11 @@ const InstallationsContextProvider = ({
|
|||
() => ({
|
||||
salimaxInstallations,
|
||||
salidomoInstallations,
|
||||
sodiohomeInstallations,
|
||||
foldersAndInstallations,
|
||||
fetchAllInstallations,
|
||||
fetchAllSalidomoInstallations,
|
||||
fetchAllSodiohomeInstallations,
|
||||
fetchAllFoldersAndInstallations,
|
||||
createInstallation,
|
||||
updateInstallation,
|
||||
|
@ -341,6 +394,7 @@ const InstallationsContextProvider = ({
|
|||
[
|
||||
salimaxInstallations,
|
||||
salidomoInstallations,
|
||||
sodiohomeInstallations,
|
||||
foldersAndInstallations,
|
||||
loading,
|
||||
error,
|
||||
|
|
|
@ -7,8 +7,10 @@ interface ProductIdContextType {
|
|||
setProduct: (new_product: number) => void;
|
||||
accessToSalimax: boolean;
|
||||
accessToSalidomo: boolean;
|
||||
accessToSodiohome: boolean;
|
||||
setAccessToSalimax: (access: boolean) => void;
|
||||
setAccessToSalidomo: (access: boolean) => void;
|
||||
setAccessToSodiohome: (access: boolean) => void;
|
||||
}
|
||||
|
||||
// Create the context.
|
||||
|
@ -16,6 +18,14 @@ export const ProductIdContext = createContext<ProductIdContextType | undefined>(
|
|||
undefined
|
||||
);
|
||||
|
||||
// Define the product mapping for dynamic assignment
|
||||
const productMapping: { [key: string]: number } = {
|
||||
salimax: 0,
|
||||
salidomo: 1,
|
||||
sodiohome: 2,
|
||||
// Additional mappings can be added here
|
||||
};
|
||||
|
||||
// Create a UserContextProvider component
|
||||
export const ProductIdContextProvider = ({
|
||||
children
|
||||
|
@ -31,8 +41,14 @@ export const ProductIdContextProvider = ({
|
|||
const storedValue = localStorage.getItem('accessToSalidomo');
|
||||
return storedValue === 'true';
|
||||
});
|
||||
const [product, setProduct] = useState(location.includes('salidomo') ? 1 : 0);
|
||||
|
||||
const [accessToSodiohome, setAccessToSodiohome] = useState(() => {
|
||||
const storedValue = localStorage.getItem('accessToSodiohome');
|
||||
return storedValue === 'true';
|
||||
});
|
||||
// const [product, setProduct] = useState(location.includes('salidomo') ? 1 : 0);
|
||||
const [product, setProduct] = useState<number>(
|
||||
productMapping[Object.keys(productMapping).find((key) => location.includes(key)) || ''] || -1
|
||||
);
|
||||
const changeProductId = (new_product: number) => {
|
||||
setProduct(new_product);
|
||||
};
|
||||
|
@ -47,6 +63,11 @@ export const ProductIdContextProvider = ({
|
|||
localStorage.setItem('accessToSalidomo', JSON.stringify(access));
|
||||
};
|
||||
|
||||
const changeAccessSodiohome = (access: boolean) => {
|
||||
setAccessToSodiohome(access);
|
||||
localStorage.setItem('accessToSodiohome', JSON.stringify(access));
|
||||
};
|
||||
|
||||
return (
|
||||
<ProductIdContext.Provider
|
||||
value={{
|
||||
|
@ -54,8 +75,10 @@ export const ProductIdContextProvider = ({
|
|||
setProduct: changeProductId,
|
||||
accessToSalimax,
|
||||
accessToSalidomo,
|
||||
accessToSodiohome,
|
||||
setAccessToSalimax: changeAccessSalimax,
|
||||
setAccessToSalidomo: changeAccessSalidomo
|
||||
setAccessToSalidomo: changeAccessSalidomo,
|
||||
setAccessToSodiohome: changeAccessSodiohome
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
|
|
|
@ -164,7 +164,7 @@ function SidebarMenu() {
|
|||
const { closeSidebar } = useContext(SidebarContext);
|
||||
const context = useContext(UserContext);
|
||||
const { currentUser, setUser } = context;
|
||||
const { accessToSalimax, accessToSalidomo } = useContext(ProductIdContext);
|
||||
const { accessToSalimax, accessToSalidomo,accessToSodiohome } = useContext(ProductIdContext);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
@ -216,6 +216,24 @@ function SidebarMenu() {
|
|||
</ListItem>
|
||||
</List>
|
||||
)}
|
||||
|
||||
{accessToSodiohome && (
|
||||
<List component="div">
|
||||
<ListItem component="div">
|
||||
<Button
|
||||
disableRipple
|
||||
component={RouterLink}
|
||||
onClick={closeSidebar}
|
||||
to="/sodiohome_installations"
|
||||
startIcon={<BrightnessLowTwoToneIcon />}
|
||||
>
|
||||
<Box sx={{ marginTop: '3px' }}>
|
||||
<FormattedMessage id="sodiohome" defaultMessage="Sodiohome" />
|
||||
</Box>
|
||||
</Button>
|
||||
</ListItem>
|
||||
</List>
|
||||
)}
|
||||
</SubMenuWrapper>
|
||||
</List>
|
||||
|
||||
|
|
Loading…
Reference in New Issue