Dash update & Dependabot

CrzyHAX91 · Dec 7, 2024 · 97e8e14 · 97e8e14
1 parent a73057b
commit 97e8e14
Show file tree

Hide file tree

Showing 2 changed files with 215 additions and 2 deletions.
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -6,6 +6,6 @@
 version: 2
 updates:
   - package-ecosystem: "" # See documentation for possible values
-    directory: "/" # Location of package manifests
+    directory: "requirements.txt" # Location of package manifests
     schedule:
       interval: "weekly"
diff --git a/new_dashboard_ui.patch b/new_dashboard_ui.patch
@@ -1,4 +1,217 @@
-diff --git a/home/user/static/js/components/dashboard-layout.tsx b/home/user/static/js/components/dashboard-layout.tsx
+No code was selected, so I will provide a general improvement to the code. 
+
+Here's an improved version of the `DashboardLayout` component:
+
+```typescript
+export default function DashboardLayout({ children }) {
+  const [isSidebarOpen, setIsSidebarOpen] = useState(true)
+
+  return (
+    <div className="flex h-screen bg-gray-100 dark:bg-gray-900">
+      {/* Sidebar */}
+      <aside
+        className={`bg-white dark:bg-gray-800 transition-all duration-300 ease-in-out ${
+          isSidebarOpen ? 'w-64' : 'w-20'
+        }`}
+      >
+        <div className="p-4">
+          <h1
+            className={`text-2xl font-bold text-gray-800 dark:text-white ${
+              isSidebarOpen ? '' : 'text-center'
+            }`}
+          >
+            {isSidebarOpen ? 'Dropship V2' : 'D2'}
+          </h1>
+        </div>
+        <SidebarNav isOpen={isSidebarOpen} />
+      </aside>
+
+      {/* Main content */}
+      <div className="flex-1 flex flex-col overflow-hidden">
+        {/* Header */}
+        <header className="bg-white dark:bg-gray-800 shadow-sm">
+          <div className="max-w-7xl mx-auto py-4 px-4 sm:px-6 lg:px-8 flex justify-between items-center">
+            <Button
+              variant="ghost"
+              size="icon"
+              onClick={() => setIsSidebarOpen(!isSidebarOpen)}
+            >
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+                className="h-6 w-6"
+              >
+                <path
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                  strokeWidth={2}
+                  d="M4 6h16M4 12h16M4 18h16"
+                />
+              </svg>
+            </Button>
+            <div className="flex items-center space-x-4">
+              <ThemeToggle />
+              <UserProfileDropdown />
+            </div>
+          </div>
+        </header>
+
+        {/* Page content */}
+        <main className="flex-1 overflow-x-hidden overflow-y-auto bg-gray-100 dark:bg-gray-900">
+          <div className="container mx-auto px-6 py-8">
+            {children}
+          </div>
+        </main>
+      </div>
+    </div>
+  )
+}
+```
+
+Here's an improved version of the `SidebarNav` component:
+
+```typescript
+export function SidebarNav({ isOpen }) {
+  return (
+    <nav className="mt-8">
+      {navItems.map((item) => (
+        <Link
+          key={item.name}
+          href={item.href}
+          className={`flex items-center px-4 py-2 text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors duration-200 ${
+            isOpen ? '' : 'justify-center'
+          }`}
+        >
+          <item.icon className="h-5 w-5" />
+          {isOpen && <span className="ml-4">{item.name}</span>}
+        </Link>
+      ))}
+    </nav>
+  )
+}
+```
+
+Here's an improved version of the `UserProfileDropdown` component:
+
+```typescript
+export function UserProfileDropdown() {
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="ghost" className="relative h-8 w-8 rounded-full">
+          <Avatar className="h-8 w-8">
+            <AvatarImage src="/avatars/01.png" alt="@username" />
+            <AvatarFallback>JD</AvatarFallback>
+          </Avatar>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent className="w-56" align="end" forceMount>
+        <DropdownMenuLabel className="font-normal">
+          <div className="flex flex-col space-y-1">
+            <p className="text-sm font-medium leading-none">John Doe</p>
+            <p className="text-xs leading-none text-muted-foreground">
+              [email protected]
+            </p>
+          </div>
+        </DropdownMenuLabel>
+        <DropdownMenuSeparator />
+        <DropdownMenuGroup>
+          <DropdownMenuItem>
+            <UserIcon className="mr-2 h-4 w-4" />
+            <span>Profile</span>
+          </DropdownMenuItem>
+          <DropdownMenuItem>
+            <SettingsIcon className="mr-2 h-4 w-4" />
+            <span>Settings</span>
+          </DropdownMenuItem>
+        </DropdownMenuGroup>
+        <DropdownMenuSeparator />
+        <DropdownMenuItem>
+          <LogOutIcon className="mr-2 h-4 w-4" />
+          <span>Log out</span>
+        </DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  )
+}
+```
+
+Here's an improved version of the `Dashboard` component:
+
+```typescript
+function Dashboard() {
+  return (
+    <DashboardLayout>
+      <h1 className="text-3xl font-bold mb-6">Dashboard</h1>
+      <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+        {/* Add your dashboard content here */}
+      </div>
+    </DashboardLayout>
+  )
+}
+```
+
+Here's an improved version of the `base.html` template:
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% block title %}Dropship V2{% endblock %}</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <style>
+        /* Add any custom styles here */
+        .dark {
+            color-scheme: dark;
+        }
+    </style>
+    {% block extra_head %}{% endblock %}
+</head>
+<body class="bg-gray-100 dark:bg-gray-900">
+    <div id="app">
+        {% block content %}{% endblock %}
+    </div>
+    {% block extra_body %}{% endblock %}
+</body>
+</html>
+```
+
+Here's an improved version of the `dashboard.html` template:
+
+```html
+{% extends 'base.html' %}
+
+{% block content %}
+<div id="react-dashboard-root"></div>
+
+<script src="https://unpkg.com/react@17/umd/react.development.js"></script>
+<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
+<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
+
+<script type="text/babel" src="{% static 'js/components/theme-provider.tsx' %}"></script>
+<script type="text/babel" src="{% static 'js/components/sidebar-nav.tsx' %}"></script>
+<script type="text/babel" src="{% static 'js/components/user-profile-dropdown.tsx' %}"></script>
+<script type="text/babel" src="{% static 'js/components/dashboard-layout.tsx' %}"></script>
+
+<script type="text/babel">
+function Dashboard() {
+  return (
+    <DashboardLayout>
+      <h1 className="text-3xl font-bold mb-6">Dashboard</h1>
+      <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+        {/* Add your dashboard content here */}
+      </div>
+    </DashboardLayout>
+  );
+}
+
+ReactDOM.render(
+  <React.StrictMode>
+    <ThemeProvider attribute="c`ff --git a/home/user/static/js/components/dashboard-layout.tsx b/home/user/static/js/components/dashboard-layout.tsx
 new file mode 100644
 index 0000000..f114f4e
 --- /dev/null