improvements

src/views/DashboardView.tsx

@@ -0,0 +1,105 @@
+import {JSX} from 'react';
+import {useAppDispatch, useAppSelector} from '../hooks/store';
+import {selectCredentials, selectSessionInfo, authenticationActions} from '../store/slices/Authentication.slice';
+import {useNavigate} from 'react-router-dom';
+import {Navigation} from '../components';
+
+export function DashboardView(): JSX.Element {
+  const dispatch = useAppDispatch();
+  const navigate = useNavigate();
+  const credentials = useAppSelector(selectCredentials);
+  const sessionInfo = useAppSelector(selectSessionInfo);
+
+  const handleLogout = () => {
+    dispatch(authenticationActions.signout());  
+    navigate('/login', {replace: true});
+  };
+
+  return (
+    <>
+      <Navigation />
+      <div
+        style={{
+          padding: '2rem',
+          maxWidth: '1200px',
+          margin: '0 auto'
+        }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            marginBottom: '2rem'
+          }}>
+          <h1>Dashboard</h1>
+          <button
+            onClick={handleLogout}
+            style={{
+              padding: '0.5rem 1rem',
+              background: '#dc3545',
+              color: 'white',
+              border: 'none',
+              borderRadius: '4px',
+              cursor: 'pointer'
+            }}>
+            Logout
+          </button>
+        </div>
+
+        <div
+          style={{
+            background: '#222',
+            padding: '1rem',
+            borderRadius: '8px',
+            marginBottom: '2rem'
+          }}>
+          <h3>Welcome!</h3>
+          <p>You are successfully authenticated.</p>
+          <p>
+            <strong>Application ID:</strong> {credentials.applicationId || 'N/A'}
+          </p>
+          <p>
+            <strong>Session ID:</strong> {sessionInfo.sessionId || 'N/A'}
+          </p>
+          <p>
+            <strong>Roles:</strong> {sessionInfo.roles.length > 0 ? sessionInfo.roles.join(', ') : 'None'}
+          </p>
+        </div>
+
+        <div
+          style={{
+            display: 'grid',
+            gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))',
+            gap: '1rem'
+          }}>
+          <div
+            style={{
+              background: 'white',
+              padding: '1rem',
+              borderRadius: '8px',
+              border: '1px solid #ddd'
+            }}>
+            <h4>Quick Actions</h4>
+            <ul>
+              <li>View Channels</li>
+              <li>Check Analytics</li>
+              <li>Monitor QoS</li>
+              <li>Manage Rooms</li>
+            </ul>
+          </div>
+
+          <div
+            style={{
+              background: 'white',
+              padding: '1rem',
+              borderRadius: '8px',
+              border: '1px solid #ddd'
+            }}>
+            <h4>Recent Activity</h4>
+            <p>No recent activity to display.</p>
+          </div>
+        </div>
+      </div>
+    </>
+  );
+}