feat: Dashboard Redesign

.cursorrules

@@ -0,0 +1,135 @@
+# Cursor and Code Style Guidelines
+
+## File Structure
+
+### Directory Organization
+
+- `src/`: Main source code directory
+  - `api/`: API service layer and network calls
+  - `ui/`: React components and UI logic
+    - `components/`: Reusable UI components
+    - `pages/`: Page-level components
+    - `styles/`: Global styles and themes
+  - `utils/`: Utility functions and helpers
+  - `constants.ts`: Global constants
+  - `version.ts`: Version information
+
+- `docs/`: Documentation files
+- `server/`: Backend server code
+- `build/`: Production build output
+
+### Required File Header
+
+All source files must begin with the following copyright header:
+/\* Copyright (c) 2024, VRAI Labs and/or its affiliates. All rights reserved.
+
+-   This software is licensed under the Apache License, Version 2.0 (the
+-   "License") as published by the Apache Software Foundation.
+-   You may not use this file except in compliance with the License. You may
+-   obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+-   Unless required by applicable law or agreed to in writing, software
+-   distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+-   WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+-   License for the specific language governing permissions and limitations
+-   under the License.
+    \*/
+
+## BEM Styling Guidelines
+
+### Naming Convention
+
+-   Block: Standalone component (e.g., `section-container`)
+-   Element: Parts of a block (prefixed with `__`) (e.g., `section-container__header`)
+-   Modifier: Variations (prefixed with `--`) (e.g., `section-container--large`)
+
+### Rules
+
+1. Use kebab-case for all BEM classes
+2. Never nest BEM elements (no `block__element1__element2`)
+3. Keep modifiers simple and boolean-like
+4. Use semantic class names
+
+### Example
+
+```scss
+.section-container {
+	// Block styles
+	&__header {
+		// Element styles
+	}
+	&--large {
+		// Modifier styles
+	}
+}
+```
+
+## TypeScript Component Guidelines
+
+### Component Structure
+
+1. Use functional components with explicit type definitions
+2. Props interface must be defined above component
+3. Export components as default when they're the main export
+4. Use React.FC for functional components with children
+
+### Example
+
+```typescript
+interface SectionContainerProps {
+	children: React.ReactNode;
+	className?: string;
+	variant?: "default" | "large";
+}
+
+export default function SectionContainer({ children, className, variant = "default" }: SectionContainerProps) {
+	const baseClass = "section-container";
+	const modifierClass = variant !== "default" ? `${baseClass}--${variant}` : "";
+	const combinedClass = [baseClass, modifierClass, className].filter(Boolean).join(" ");
+
+	return <div className={combinedClass}>{children}</div>;
+}
+```
+
+## Best Practices
+
+### General
+
+1. Use meaningful variable and function names
+2. Keep components focused and single-responsibility
+3. Implement proper error boundaries
+4. Use proper TypeScript types (avoid `any`)
+5. Document complex logic with JSDoc comments
+
+### Styling
+
+1. Use CSS variables for theming
+2. Implement responsive design using mixins
+3. Follow mobile-first approach
+4. Use semantic HTML elements
+
+### Performance
+
+1. Implement proper memoization (useMemo, useCallback)
+2. Lazy load components when appropriate
+3. Optimize re-renders
+4. Use proper key props in lists
+
+### Accessibility
+
+1. Use proper ARIA attributes
+2. Ensure keyboard navigation
+3. Maintain proper color contrast
+4. Support screen readers
+
+## Code Review Checklist
+
+-   [ ] Copyright header present
+-   [ ] BEM naming conventions followed
+-   [ ] TypeScript types properly defined
+-   [ ] Props interface documented
+-   [ ] Responsive design implemented
+-   [ ] Accessibility requirements met
+-   [ ] Performance optimizations in place
+-   [ ] Code properly formatted
+-   [ ] No unused imports or variables
+-   [ ] Tests written and passing

.vscode/settings.json

@@ -15,7 +15,7 @@
 	"editor.trimAutoWhitespace": true,
 	"editor.formatOnSave": true,
 	"editor.codeActionsOnSave": {
-		"source.organizeImports": "explicit"
+		"source.organizeImports": "never"
 	},
 	"files.exclude": {
 		"**/.DS_Store": true,

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [unreleased]
 
+## [0.14.0]
+
+-   Redesigns the dashboard UI and improves user experience
+
 ## [0.13.0]
 
 -   Adds support for SAML metadata

build/asset-manifest.json

@@ -18,18 +18,16 @@
     "static/media/no-tenants.svg": "/static/media/no-tenants.svg",
     "static/media/logo.svg": "/static/media/logo.svg",
     "static/media/plus-square.svg": "/static/media/plus-square.svg",
-    "static/media/roles-and-permissions.svg": "/static/media/roles-and-permissions.svg",
     "static/media/no-results.svg": "/static/media/no-results.svg",
     "static/media/question-mark.svg": "/static/media/question-mark.svg",
     "static/media/help-circle.svg": "/static/media/help-circle.svg",
     "static/media/info-icon.svg": "/static/media/info-icon.svg",
     "static/media/email.svg": "/static/media/email.svg",
-    "static/media/user-managment.svg": "/static/media/user-managment.svg",
+    "static/media/tenant-management.svg": "/static/media/tenant-management.svg",
     "static/media/lock.svg": "/static/media/lock.svg",
     "static/media/checkmark-green.svg": "/static/media/checkmark-green.svg",
+    "static/media/roles-and-permissions.svg": "/static/media/roles-and-permissions.svg",
     "static/media/plus.svg": "/static/media/plus.svg",
-    "static/media/green-check.svg": "/static/media/green-check.svg",
-    "static/media/tenant-management.svg": "/static/media/tenant-management.svg",
     "static/media/close-inactive.svg": "/static/media/close-inactive.svg",
     "static/media/close-active.svg": "/static/media/close-active.svg",
     "static/media/clear.svg": "/static/media/clear.svg",
@@ -42,6 +40,7 @@
     "static/media/provider-google.svg": "/static/media/provider-google.svg",
     "static/media/no-users-graphic.svg": "/static/media/no-users-graphic.svg",
     "static/media/unlink-login-method.png": "/static/media/unlink-login-method.png",
+    "static/media/user-management.svg": "/static/media/user-management.svg",
     "static/media/eye-stroke.svg": "/static/media/eye-stroke.svg",
     "static/media/people-restricted.svg": "/static/media/people-restricted.svg",
     "static/media/mail-opened.svg": "/static/media/mail-opened.svg",