@vheins/local-memory-mcp 0.4.12 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (201) hide show
  1. package/README.md +21 -0
  2. package/bin/mcp-memory-server.js +1 -1
  3. package/dist/dashboard/public/assets/index-KxrQ6fPK.css +1 -0
  4. package/dist/dashboard/public/assets/index-Lu37nzOi.js +72 -0
  5. package/dist/dashboard/public/index.html +11 -1772
  6. package/dist/dashboard/server.js +115 -5
  7. package/dist/dashboard/server.js.map +1 -1
  8. package/dist/mcp/capabilities.d.ts +22 -0
  9. package/dist/mcp/capabilities.d.ts.map +1 -0
  10. package/dist/mcp/capabilities.js +38 -0
  11. package/dist/mcp/capabilities.js.map +1 -0
  12. package/dist/mcp/client.js +3 -3
  13. package/dist/mcp/client.js.map +1 -1
  14. package/dist/mcp/completion.d.ts +25 -0
  15. package/dist/mcp/completion.d.ts.map +1 -0
  16. package/dist/mcp/completion.js +127 -0
  17. package/dist/mcp/completion.js.map +1 -0
  18. package/dist/mcp/prompts/registry.d.ts +314 -0
  19. package/dist/mcp/prompts/registry.d.ts.map +1 -0
  20. package/dist/mcp/prompts/registry.js +936 -0
  21. package/dist/mcp/prompts/registry.js.map +1 -0
  22. package/dist/mcp/resources/index.d.ts +68 -0
  23. package/dist/mcp/resources/index.d.ts.map +1 -0
  24. package/dist/mcp/resources/index.js +323 -0
  25. package/dist/mcp/resources/index.js.map +1 -0
  26. package/dist/mcp/router.d.ts +14 -0
  27. package/dist/mcp/router.d.ts.map +1 -0
  28. package/dist/mcp/router.js +242 -0
  29. package/dist/mcp/router.js.map +1 -0
  30. package/dist/mcp/server.d.ts +3 -0
  31. package/dist/mcp/server.d.ts.map +1 -0
  32. package/dist/mcp/server.js +338 -0
  33. package/dist/mcp/server.js.map +1 -0
  34. package/dist/mcp/storage/sqlite.d.ts +83 -0
  35. package/dist/mcp/storage/sqlite.d.ts.map +1 -0
  36. package/dist/mcp/storage/sqlite.js +1237 -0
  37. package/dist/mcp/storage/sqlite.js.map +1 -0
  38. package/dist/mcp/storage/vectors.d.ts +19 -0
  39. package/dist/mcp/storage/vectors.d.ts.map +1 -0
  40. package/dist/mcp/storage/vectors.js +74 -0
  41. package/dist/mcp/storage/vectors.js.map +1 -0
  42. package/dist/mcp/storage/vectors.stub.d.ts +12 -0
  43. package/dist/mcp/storage/vectors.stub.d.ts.map +1 -0
  44. package/dist/mcp/storage/vectors.stub.js +88 -0
  45. package/dist/mcp/storage/vectors.stub.js.map +1 -0
  46. package/dist/mcp/tests/client.test.d.ts +2 -0
  47. package/dist/mcp/tests/client.test.d.ts.map +1 -0
  48. package/dist/mcp/tests/client.test.js +130 -0
  49. package/dist/mcp/tests/client.test.js.map +1 -0
  50. package/dist/mcp/tests/dashboard.test.d.ts +2 -0
  51. package/dist/mcp/tests/dashboard.test.d.ts.map +1 -0
  52. package/dist/mcp/tests/dashboard.test.js +370 -0
  53. package/dist/mcp/tests/dashboard.test.js.map +1 -0
  54. package/dist/mcp/tests/e2e.test.d.ts +2 -0
  55. package/dist/mcp/tests/e2e.test.d.ts.map +1 -0
  56. package/dist/mcp/tests/e2e.test.js +250 -0
  57. package/dist/mcp/tests/e2e.test.js.map +1 -0
  58. package/dist/mcp/tests/index.test.d.ts +2 -0
  59. package/dist/mcp/tests/index.test.d.ts.map +1 -0
  60. package/dist/mcp/tests/index.test.js +185 -0
  61. package/dist/mcp/tests/index.test.js.map +1 -0
  62. package/dist/mcp/tests/logger.test.d.ts +2 -0
  63. package/dist/mcp/tests/logger.test.d.ts.map +1 -0
  64. package/dist/mcp/tests/logger.test.js +104 -0
  65. package/dist/mcp/tests/logger.test.js.map +1 -0
  66. package/dist/mcp/tests/memory.bulk.test.d.ts +2 -0
  67. package/dist/mcp/tests/memory.bulk.test.d.ts.map +1 -0
  68. package/dist/mcp/tests/memory.bulk.test.js +52 -0
  69. package/dist/mcp/tests/memory.bulk.test.js.map +1 -0
  70. package/dist/mcp/tests/memory.search.test.d.ts +2 -0
  71. package/dist/mcp/tests/memory.search.test.d.ts.map +1 -0
  72. package/dist/mcp/tests/memory.search.test.js +181 -0
  73. package/dist/mcp/tests/memory.search.test.js.map +1 -0
  74. package/dist/mcp/tests/normalize.test.d.ts +2 -0
  75. package/dist/mcp/tests/normalize.test.d.ts.map +1 -0
  76. package/dist/mcp/tests/normalize.test.js +181 -0
  77. package/dist/mcp/tests/normalize.test.js.map +1 -0
  78. package/dist/mcp/tests/query-expander.test.d.ts +2 -0
  79. package/dist/mcp/tests/query-expander.test.d.ts.map +1 -0
  80. package/dist/mcp/tests/query-expander.test.js +33 -0
  81. package/dist/mcp/tests/query-expander.test.js.map +1 -0
  82. package/dist/mcp/tests/router.test.d.ts +2 -0
  83. package/dist/mcp/tests/router.test.d.ts.map +1 -0
  84. package/dist/mcp/tests/router.test.js +470 -0
  85. package/dist/mcp/tests/router.test.js.map +1 -0
  86. package/dist/mcp/tests/sqlite.test.d.ts +2 -0
  87. package/dist/mcp/tests/sqlite.test.d.ts.map +1 -0
  88. package/dist/mcp/tests/sqlite.test.js +367 -0
  89. package/dist/mcp/tests/sqlite.test.js.map +1 -0
  90. package/dist/mcp/tests/tasks-search.test.d.ts +2 -0
  91. package/dist/mcp/tests/tasks-search.test.d.ts.map +1 -0
  92. package/dist/mcp/tests/tasks-search.test.js +154 -0
  93. package/dist/mcp/tests/tasks-search.test.js.map +1 -0
  94. package/dist/mcp/tests/tasks-transition.test.d.ts +2 -0
  95. package/dist/mcp/tests/tasks-transition.test.d.ts.map +1 -0
  96. package/dist/mcp/tests/tasks-transition.test.js +174 -0
  97. package/dist/mcp/tests/tasks-transition.test.js.map +1 -0
  98. package/dist/mcp/tests/tasks.bulk.test.d.ts +2 -0
  99. package/dist/mcp/tests/tasks.bulk.test.d.ts.map +1 -0
  100. package/dist/mcp/tests/tasks.bulk.test.js +254 -0
  101. package/dist/mcp/tests/tasks.bulk.test.js.map +1 -0
  102. package/dist/mcp/tests/tasks.e2e.test.d.ts +2 -0
  103. package/dist/mcp/tests/tasks.e2e.test.d.ts.map +1 -0
  104. package/dist/mcp/tests/tasks.e2e.test.js +289 -0
  105. package/dist/mcp/tests/tasks.e2e.test.js.map +1 -0
  106. package/dist/mcp/tests/tasks.pending-limit-refined.test.d.ts +2 -0
  107. package/dist/mcp/tests/tasks.pending-limit-refined.test.d.ts.map +1 -0
  108. package/dist/mcp/tests/tasks.pending-limit-refined.test.js +72 -0
  109. package/dist/mcp/tests/tasks.pending-limit-refined.test.js.map +1 -0
  110. package/dist/mcp/tests/v2-features.test.d.ts +2 -0
  111. package/dist/mcp/tests/v2-features.test.d.ts.map +1 -0
  112. package/dist/mcp/tests/v2-features.test.js +209 -0
  113. package/dist/mcp/tests/v2-features.test.js.map +1 -0
  114. package/dist/mcp/tools/memory.acknowledge.d.ts +4 -0
  115. package/dist/mcp/tools/memory.acknowledge.d.ts.map +1 -0
  116. package/dist/mcp/tools/memory.acknowledge.js +30 -0
  117. package/dist/mcp/tools/memory.acknowledge.js.map +1 -0
  118. package/dist/mcp/tools/memory.bulk-delete.d.ts +4 -0
  119. package/dist/mcp/tools/memory.bulk-delete.d.ts.map +1 -0
  120. package/dist/mcp/tools/memory.bulk-delete.js +39 -0
  121. package/dist/mcp/tools/memory.bulk-delete.js.map +1 -0
  122. package/dist/mcp/tools/memory.delete.d.ts +9 -0
  123. package/dist/mcp/tools/memory.delete.d.ts.map +1 -0
  124. package/dist/mcp/tools/memory.delete.js +39 -0
  125. package/dist/mcp/tools/memory.delete.js.map +1 -0
  126. package/dist/mcp/tools/memory.recap.d.ts +4 -0
  127. package/dist/mcp/tools/memory.recap.d.ts.map +1 -0
  128. package/dist/mcp/tools/memory.recap.js +90 -0
  129. package/dist/mcp/tools/memory.recap.js.map +1 -0
  130. package/dist/mcp/tools/memory.search.d.ts +5 -0
  131. package/dist/mcp/tools/memory.search.d.ts.map +1 -0
  132. package/dist/mcp/tools/memory.search.js +134 -0
  133. package/dist/mcp/tools/memory.search.js.map +1 -0
  134. package/dist/mcp/tools/memory.store.d.ts +5 -0
  135. package/dist/mcp/tools/memory.store.d.ts.map +1 -0
  136. package/dist/mcp/tools/memory.store.js +117 -0
  137. package/dist/mcp/tools/memory.store.js.map +1 -0
  138. package/dist/mcp/tools/memory.summarize.d.ts +4 -0
  139. package/dist/mcp/tools/memory.summarize.d.ts.map +1 -0
  140. package/dist/mcp/tools/memory.summarize.js +31 -0
  141. package/dist/mcp/tools/memory.summarize.js.map +1 -0
  142. package/dist/mcp/tools/memory.synthesize.d.ts +14 -0
  143. package/dist/mcp/tools/memory.synthesize.d.ts.map +1 -0
  144. package/dist/mcp/tools/memory.synthesize.js +228 -0
  145. package/dist/mcp/tools/memory.synthesize.js.map +1 -0
  146. package/dist/mcp/tools/memory.update.d.ts +5 -0
  147. package/dist/mcp/tools/memory.update.d.ts.map +1 -0
  148. package/dist/mcp/tools/memory.update.js +73 -0
  149. package/dist/mcp/tools/memory.update.js.map +1 -0
  150. package/dist/mcp/tools/schemas.d.ts +2762 -0
  151. package/dist/mcp/tools/schemas.d.ts.map +1 -0
  152. package/dist/mcp/tools/schemas.js +952 -0
  153. package/dist/mcp/tools/schemas.js.map +1 -0
  154. package/dist/mcp/tools/task.bulk-manage.d.ts +4 -0
  155. package/dist/mcp/tools/task.bulk-manage.d.ts.map +1 -0
  156. package/dist/mcp/tools/task.bulk-manage.js +146 -0
  157. package/dist/mcp/tools/task.bulk-manage.js.map +1 -0
  158. package/dist/mcp/tools/task.manage.d.ts +16 -0
  159. package/dist/mcp/tools/task.manage.d.ts.map +1 -0
  160. package/dist/mcp/tools/task.manage.js +395 -0
  161. package/dist/mcp/tools/task.manage.js.map +1 -0
  162. package/dist/mcp/types.d.ts +87 -0
  163. package/dist/mcp/types.d.ts.map +1 -0
  164. package/dist/mcp/types.js +3 -0
  165. package/dist/mcp/types.js.map +1 -0
  166. package/dist/mcp/utils/completion.d.ts +2 -0
  167. package/dist/mcp/utils/completion.d.ts.map +1 -0
  168. package/dist/mcp/utils/completion.js +28 -0
  169. package/dist/mcp/utils/completion.js.map +1 -0
  170. package/dist/mcp/utils/git-scope.d.ts +8 -0
  171. package/dist/mcp/utils/git-scope.d.ts.map +1 -0
  172. package/dist/mcp/utils/git-scope.js +38 -0
  173. package/dist/mcp/utils/git-scope.js.map +1 -0
  174. package/dist/mcp/utils/logger.d.ts +25 -0
  175. package/dist/mcp/utils/logger.d.ts.map +1 -0
  176. package/dist/mcp/utils/logger.js +152 -0
  177. package/dist/mcp/utils/logger.js.map +1 -0
  178. package/dist/mcp/utils/mcp-response.d.ts +96 -0
  179. package/dist/mcp/utils/mcp-response.d.ts.map +1 -0
  180. package/dist/mcp/utils/mcp-response.js +131 -0
  181. package/dist/mcp/utils/mcp-response.js.map +1 -0
  182. package/dist/mcp/utils/normalize.d.ts +9 -0
  183. package/dist/mcp/utils/normalize.d.ts.map +1 -0
  184. package/dist/mcp/utils/normalize.js +62 -0
  185. package/dist/mcp/utils/normalize.js.map +1 -0
  186. package/dist/mcp/utils/pagination.d.ts +6 -0
  187. package/dist/mcp/utils/pagination.d.ts.map +1 -0
  188. package/dist/mcp/utils/pagination.js +32 -0
  189. package/dist/mcp/utils/pagination.js.map +1 -0
  190. package/dist/mcp/utils/query-expander.d.ts +2 -0
  191. package/dist/mcp/utils/query-expander.d.ts.map +1 -0
  192. package/dist/mcp/utils/query-expander.js +29 -0
  193. package/dist/mcp/utils/query-expander.js.map +1 -0
  194. package/dist/storage/sqlite.d.ts +3 -0
  195. package/dist/storage/sqlite.d.ts.map +1 -1
  196. package/dist/storage/sqlite.js +38 -9
  197. package/dist/storage/sqlite.js.map +1 -1
  198. package/package.json +17 -5
  199. package/dist/dashboard/public/app.js +0 -2779
  200. package/dist/dashboard/public/chart.js +0 -0
  201. package/dist/dashboard/public/screenshot.png +0 -0
@@ -1,1778 +1,17 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en">
3
3
  <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>MCP Memory Dashboard</title>
7
- <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><defs><linearGradient id=%22g%22 x1=%220%%22 y1=%220%%22 x2=%22100%%22 y2=%22100%%22><stop offset=%220%%22 stop-color=%22%230ea5e9%22/><stop offset=%22100%%22 stop-color=%22%236366f1%22/></linearGradient></defs><rect x=%2215%22 y=%2215%22 width=%2270%22 height=%2270%22 rx=%2215%22 fill=%22url(%23g)%22/><path d=%22M30 35h40M30 50h40M30 65h25%22 stroke=%22white%22 stroke-width=%228%22 stroke-linecap=%22round%22/></svg>">
8
- <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.js" onerror="window.Chart = null;"></script>
9
- <script src="https://cdn.jsdelivr.net/npm/marked@12.0.0/marked.min.js"></script>
10
- <script>
11
- // Suppress Tailwind production warning for local dashboard
12
- const originalWarn = console.warn;
13
- console.warn = (...args) => {
14
- if (args[0] && typeof args[0] === 'string' && args[0].includes('tailwindcss.com should not be used in production')) return;
15
- originalWarn(...args);
16
- };
17
- </script>
18
- <script src="https://cdn.tailwindcss.com"></script>
19
- <script>
20
- tailwind.config = {
21
- darkMode: 'class',
22
- theme: {
23
- extend: {
24
- colors: {
25
- decision: { bg: '#e3f2fd', text: '#1976d2', dark: '#1a3a5c', 'dark-text': '#64b5f6' },
26
- mistake: { bg: '#ffebee', text: '#d32f2f', dark: '#5c1a1a', 'dark-text': '#ef9a9a' },
27
- code_fact: { bg: '#f3e5f5', text: '#7b1fa2', dark: '#3a1a4c', 'dark-text': '#ce93d8' },
28
- pattern: { bg: '#e8f5e9', text: '#388e3c', dark: '#1a3a1a', 'dark-text': '#a5d6a7' },
29
- }
30
- }
31
- }
32
- }
33
- </script>
34
- <style>
35
- :root {
36
- --glass-bg: rgba(255, 255, 255, 0.58);
37
- --glass-bg-strong: rgba(255, 255, 255, 0.76);
38
- --glass-border: rgba(255, 255, 255, 0.34);
39
- --glass-shadow: 0 28px 90px rgba(15, 23, 42, 0.14);
40
- --glow-blue: rgba(56, 189, 248, 0.24);
41
- --glow-cyan: rgba(34, 211, 238, 0.18);
42
- --glow-violet: rgba(129, 140, 248, 0.14);
43
- --panel-dark: rgba(7, 15, 28, 0.72);
44
- --panel-dark-strong: rgba(6, 12, 24, 0.9);
45
- --panel-dark-border: rgba(148, 163, 184, 0.12);
46
- --panel-dark-highlight: rgba(125, 211, 252, 0.16);
47
- --dashboard-header-offset: 0px;
48
- --dashboard-tab-offset: 0px;
49
- --dashboard-main-offset: 280px;
50
- --dashboard-main-gutter: 16px;
51
- --dashboard-left-seam: 0px;
52
- }
53
-
54
- html {
55
- background:
56
- radial-gradient(circle at 14% 16%, rgba(125, 211, 252, 0.4), transparent 0 24rem),
57
- radial-gradient(circle at 88% 12%, rgba(59, 130, 246, 0.2), transparent 0 18rem),
58
- radial-gradient(circle at 82% 82%, rgba(99, 102, 241, 0.14), transparent 0 20rem),
59
- linear-gradient(180deg, #f4fbff 0%, #eef5ff 38%, #f7faff 100%) fixed;
60
- transition: background 0.5s ease;
61
- min-height: 100vh;
62
- overflow-x: hidden;
63
- }
64
-
65
- html.dark {
66
- background:
67
- radial-gradient(circle at 14% 16%, rgba(14, 165, 233, 0.12), transparent 0 24rem),
68
- radial-gradient(circle at 88% 12%, rgba(30, 58, 138, 0.1), transparent 0 18rem),
69
- radial-gradient(circle at 82% 82%, rgba(67, 56, 202, 0.08), transparent 0 20rem),
70
- linear-gradient(180deg, #020617 0%, #070a18 38%, #020617 100%) fixed;
71
- }
72
-
73
- body {
74
- position: relative;
75
- min-height: 100vh;
76
- background: transparent;
77
- color: #0f172a;
78
- transition: color 0.3s ease;
79
- overflow-x: hidden;
80
- }
81
-
82
- html.dark body {
83
- color: #f8fafc;
84
- }
85
-
86
- body::before,
87
- body::after {
88
- content: "";
89
- position: fixed;
90
- inset: auto;
91
- pointer-events: none;
92
- z-index: 0;
93
- border-radius: 9999px;
94
- filter: blur(70px);
95
- opacity: 0.55;
96
- }
97
-
98
- body::before {
99
- width: 28rem;
100
- height: 28rem;
101
- top: 3rem;
102
- left: -7rem;
103
- background: rgba(56, 189, 248, 0.16);
104
- }
105
-
106
- body::after {
107
- width: 26rem;
108
- height: 26rem;
109
- right: -5rem;
110
- bottom: 2rem;
111
- background: rgba(99, 102, 241, 0.12);
112
- }
113
-
114
- html.dark body::before {
115
- background: rgba(34, 211, 238, 0.14);
116
- opacity: 0.65;
117
- }
118
-
119
- html.dark body::after {
120
- background: rgba(99, 102, 241, 0.16);
121
- opacity: 0.55;
122
- }
123
-
124
- header,
125
- main .rounded-lg,
126
- #bulkActionBar {
127
- position: relative;
128
- background: var(--glass-bg) !important;
129
- border: 1px solid var(--glass-border) !important;
130
- box-shadow: var(--glass-shadow);
131
- backdrop-filter: blur(24px) saturate(1.15);
132
- -webkit-backdrop-filter: blur(24px) saturate(1.15);
133
- }
134
-
135
- html.dark header,
136
- html.dark main .rounded-lg,
137
- html.dark #bulkActionBar {
138
- background: var(--panel-dark) !important;
139
- border-color: var(--panel-dark-border) !important;
140
- box-shadow:
141
- 0 28px 90px rgba(2, 6, 23, 0.55),
142
- inset 0 1px 0 rgba(148, 163, 184, 0.05);
143
- }
144
-
145
- /* Drawer: always pure white in light, dark in dark — no glass */
146
- #memoryDrawer aside {
147
- background: #ffffff !important;
148
- backdrop-filter: none !important;
149
- -webkit-backdrop-filter: none !important;
150
- border-color: #e2e8f0 !important;
151
- box-shadow: -20px 0 50px rgba(0,0,0,0.12) !important;
152
- }
153
- html.dark #memoryDrawer aside {
154
- background: #0f172a !important;
155
- border-color: rgba(255,255,255,0.06) !important;
156
- }
157
- /* Reset glass glass on all cards/elements inside the drawer */
158
- #memoryDrawer aside .rounded-lg,
159
- #memoryDrawer aside .rounded-xl {
160
- background: transparent !important;
161
- backdrop-filter: none !important;
162
- -webkit-backdrop-filter: none !important;
163
- box-shadow: none !important;
164
- }
165
- /* drawerBody itself: white bg to prevent glass bleed-through */
166
- #drawerBody {
167
- background: #ffffff !important;
168
- }
169
- html.dark #drawerBody {
170
- background: #0f172a !important;
171
- }
172
-
173
- header {
174
- background: var(--glass-bg-strong) !important;
175
- }
176
-
177
- html.dark header {
178
- background: var(--panel-dark-strong) !important;
179
- }
180
-
181
- .sticky-table-header th {
182
- backdrop-filter: blur(12px);
183
- -webkit-backdrop-filter: blur(12px);
184
- background: rgba(248, 250, 252, 0.82) !important;
185
- }
186
-
187
- html.dark .sticky-table-header th {
188
- background: rgba(15, 23, 42, 0.88) !important;
189
- border-color: rgba(148, 163, 184, 0.1);
190
- }
191
-
192
- .table-animate tr {
193
- transition: all 0.2s ease;
194
- }
195
-
196
- .table-animate tr:hover {
197
- background: rgba(241, 245, 249, 0.5) !important;
198
- transform: scale(1.002);
199
- }
200
-
201
- html.dark .table-animate tr:hover {
202
- background: rgba(30, 41, 59, 0.4) !important;
203
- }
204
-
205
- /* Glassy Futuristic Type Chips */
206
- .table-chip {
207
- display: inline-flex;
208
- align-items: center;
209
- padding: 0.2rem 0.65rem;
210
- border-radius: 9999px;
211
- font-size: 0.65rem;
212
- font-weight: 700;
213
- text-transform: uppercase;
214
- letter-spacing: 0.06em;
215
- backdrop-filter: blur(8px);
216
- -webkit-backdrop-filter: blur(8px);
217
- border: 1px solid transparent;
218
- transition: all 0.2s ease;
219
- box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 2px 8px rgba(0,0,0,0.06);
220
- }
221
- .table-chip:hover {
222
- transform: translateY(-1px);
223
- box-shadow: inset 0 1px 0 rgba(255,255,255,0.22), 0 4px 12px rgba(0,0,0,0.1);
224
- }
225
-
226
- .type-decision {
227
- background: linear-gradient(135deg, rgba(33,150,243,0.12), rgba(25,118,210,0.08));
228
- color: #1565c0;
229
- border-color: rgba(33,150,243,0.28);
230
- text-shadow: 0 0 12px rgba(33,150,243,0.3);
231
- }
232
- .type-mistake {
233
- background: linear-gradient(135deg, rgba(244,67,54,0.12), rgba(211,47,47,0.08));
234
- color: #c62828;
235
- border-color: rgba(244,67,54,0.28);
236
- text-shadow: 0 0 12px rgba(244,67,54,0.3);
237
- }
238
- .type-code_fact {
239
- background: linear-gradient(135deg, rgba(156,39,176,0.12), rgba(123,31,162,0.08));
240
- color: #6a1b9a;
241
- border-color: rgba(156,39,176,0.28);
242
- text-shadow: 0 0 12px rgba(156,39,176,0.3);
243
- }
244
- .type-pattern {
245
- background: linear-gradient(135deg, rgba(56,142,60,0.12), rgba(27,94,32,0.08));
246
- color: #1b5e20;
247
- border-color: rgba(56,142,60,0.28);
248
- text-shadow: 0 0 12px rgba(76,175,80,0.3);
249
- }
250
- .type-agent_handoff {
251
- background: linear-gradient(135deg, rgba(255,152,0,0.12), rgba(245,124,0,0.08));
252
- color: #e65100;
253
- border-color: rgba(255,152,0,0.28);
254
- text-shadow: 0 0 12px rgba(255,152,0,0.3);
255
- }
256
- .type-agent_registered {
257
- background: linear-gradient(135deg, rgba(156,204,101,0.12), rgba(139,195,74,0.08));
258
- color: #33691e;
259
- border-color: rgba(156,204,101,0.28);
260
- text-shadow: 0 0 12px rgba(156,204,101,0.3);
261
- }
262
-
263
- html.dark .type-decision {
264
- background: linear-gradient(135deg, rgba(56,189,248,0.18), rgba(14,165,233,0.08));
265
- color: #7dd3fc;
266
- border-color: rgba(56,189,248,0.3);
267
- text-shadow: 0 0 14px rgba(56,189,248,0.5);
268
- }
269
- html.dark .type-mistake {
270
- background: linear-gradient(135deg, rgba(251,113,133,0.18), rgba(244,63,94,0.08));
271
- color: #fda4af;
272
- border-color: rgba(251,113,133,0.3);
273
- text-shadow: 0 0 14px rgba(251,113,133,0.5);
274
- }
275
- html.dark .type-code_fact {
276
- background: linear-gradient(135deg, rgba(192,132,252,0.18), rgba(167,139,250,0.08));
277
- color: #d8b4fe;
278
- border-color: rgba(192,132,252,0.3);
279
- text-shadow: 0 0 14px rgba(192,132,252,0.5);
280
- }
281
- html.dark .type-pattern {
282
- background: linear-gradient(135deg, rgba(52,211,153,0.18), rgba(16,185,129,0.08));
283
- color: #6ee7b7;
284
- border-color: rgba(52,211,153,0.3);
285
- text-shadow: 0 0 14px rgba(52,211,153,0.5);
286
- }
287
- html.dark .type-agent_handoff {
288
- background: linear-gradient(135deg, rgba(251,146,60,0.18), rgba(249,115,22,0.08));
289
- color: #fdba74;
290
- border-color: rgba(251,146,60,0.3);
291
- text-shadow: 0 0 14px rgba(251,146,60,0.5);
292
- }
293
- html.dark .type-agent_registered {
294
- background: linear-gradient(135deg, rgba(163,230,53,0.18), rgba(132,204,22,0.08));
295
- color: #bef264;
296
- border-color: rgba(163,230,53,0.3);
297
- text-shadow: 0 0 14px rgba(163,230,53,0.5);
298
- }
299
-
300
- /* Importance/Metric Badge */
301
- .metric-badge {
302
- display: inline-flex;
303
- align-items: center;
304
- justify-content: center;
305
- padding: 0.2rem 0.6rem;
306
- border-radius: 8px;
307
- font-size: 0.72rem;
308
- font-weight: 700;
309
- letter-spacing: 0.02em;
310
- backdrop-filter: blur(6px);
311
- border: 1px solid transparent;
312
- box-shadow: inset 0 1px 0 rgba(255,255,255,0.15), 0 2px 6px rgba(0,0,0,0.06);
313
- transition: transform 0.15s ease;
314
- }
315
-
316
- .skeleton {
317
- background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
318
- background-size: 200% 100%;
319
- animation: skeleton-loading 1.5s infinite;
320
- }
321
-
322
- html.dark .skeleton {
323
- background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
324
- background-size: 200% 100%;
325
- }
326
-
327
- @keyframes skeleton-loading {
328
- 0% { background-position: 200% 0; }
329
- 100% { background-position: -200% 0; }
330
- }
331
-
332
- #memoryDrawer.hidden { display: none; }
333
- body.drawer-open { overflow: hidden; }
334
-
335
- @keyframes fade-in {
336
- from { opacity: 0; transform: translateY(10px); }
337
- to { opacity: 1; transform: translateY(0); }
338
- }
339
- .animate-fade-in { animation: fade-in 0.4s cubic-bezier(0.16, 1, 0.3, 1); }
340
-
341
-
342
- /* btn-open and btn-edit-light overrides for glass context */
343
- .btn-open { background: #2563eb !important; color: #ffffff !important; }
344
- html.dark .btn-open { background: rgba(56,189,248,0.15) !important; color: #7dd3fc !important; }
345
- .btn-open:hover { background: #1d4ed8 !important; }
346
- html.dark .btn-open:hover { background: rgba(56,189,248,0.25) !important; }
347
-
348
- .btn-edit-light { background: #fef3c7 !important; color: #92400e !important; }
349
- html.dark .btn-edit-light { background: rgba(245,158,11,0.18) !important; color: #fcd34d !important; }
350
- .btn-edit-light:hover { background: #fde68a !important; }
351
- html.dark .btn-edit-light:hover { background: rgba(245,158,11,0.28) !important; }
352
-
353
- /* Add Task / Refresh Tasks buttons */
354
- .btn-add-task {
355
- display: inline-flex;
356
- align-items: center;
357
- gap: 6px;
358
- padding: 0.45rem 1rem;
359
- background: #6366f1 !important;
360
- color: #ffffff !important;
361
- border-radius: 10px;
362
- font-size: 0.8rem;
363
- font-weight: 600;
364
- border: 1px solid #4f46e5;
365
- box-shadow: 0 4px 14px rgba(99,102,241,0.35);
366
- transition: all 0.2s ease;
367
- }
368
- .btn-add-task:hover {
369
- background: #4f46e5 !important;
370
- box-shadow: 0 6px 20px rgba(99,102,241,0.45);
371
- transform: translateY(-1px);
372
- }
373
- html.dark .btn-add-task {
374
- background: rgba(99,102,241,0.2) !important;
375
- color: #a5b4fc !important;
376
- border-color: rgba(99,102,241,0.4);
377
- box-shadow: 0 4px 14px rgba(99,102,241,0.2);
378
- }
379
- html.dark .btn-add-task:hover {
380
- background: rgba(99,102,241,0.32) !important;
381
- color: #c7d2fe !important;
382
- }
383
- .btn-refresh {
384
- display: inline-flex;
385
- align-items: center;
386
- gap: 6px;
387
- padding: 0.45rem 1rem;
388
- background: #0ea5e9 !important;
389
- color: #ffffff !important;
390
- border-radius: 10px;
391
- font-size: 0.8rem;
392
- font-weight: 600;
393
- border: 1px solid #0284c7;
394
- box-shadow: 0 4px 14px rgba(14,165,233,0.3);
395
- transition: all 0.2s ease;
396
- }
397
- .btn-refresh:hover {
398
- background: #0284c7 !important;
399
- transform: translateY(-1px);
400
- }
401
- html.dark .btn-refresh {
402
- background: rgba(14,165,233,0.15) !important;
403
- color: #7dd3fc !important;
404
- border-color: rgba(14,165,233,0.35);
405
- }
406
- html.dark .btn-refresh:hover {
407
- background: rgba(14,165,233,0.28) !important;
408
- color: #bae6fd !important;
409
- }
410
-
411
- /* Add Memory button */
412
- .btn-add-memory {
413
- display: inline-flex;
414
- align-items: center;
415
- gap: 6px;
416
- padding: 0.45rem 0.85rem;
417
- background: #0ea5e9 !important;
418
- color: #ffffff !important;
419
- border-radius: 10px;
420
- font-size: 0.65rem;
421
- font-weight: 700;
422
- text-transform: uppercase;
423
- letter-spacing: 0.07em;
424
- border: 1px solid #0284c7;
425
- box-shadow: 0 4px 14px rgba(14,165,233,0.35);
426
- transition: all 0.2s ease;
427
- }
428
- .btn-add-memory:hover {
429
- background: #0284c7 !important;
430
- box-shadow: 0 6px 20px rgba(14,165,233,0.45);
431
- transform: translateY(-1px);
432
- }
433
- html.dark .btn-add-memory {
434
- background: rgba(14,165,233,0.2) !important;
435
- color: #7dd3fc !important;
436
- border-color: rgba(14,165,233,0.4);
437
- box-shadow: 0 4px 14px rgba(14,165,233,0.2);
438
- }
439
- html.dark .btn-add-memory:hover {
440
- background: rgba(14,165,233,0.32) !important;
441
- color: #bae6fd !important;
442
- }
443
-
444
-
445
- /* Markdown body styles for Full Content section */
446
- .custom-scrollbar::-webkit-scrollbar {
447
- width: 6px;
448
- height: 6px;
449
- }
450
-
451
- .snap-x {
452
- scroll-snap-type: x mandatory;
453
- -webkit-overflow-scrolling: touch;
454
- }
455
-
456
- .snap-center {
457
- scroll-snap-align: center;
458
- }
459
-
460
- /* Responsive Kanban Board */
461
- @media (max-width: 768px) {
462
- #taskBoard {
463
- margin-left: -1rem;
464
- margin-right: -1rem;
465
- padding-left: 1rem;
466
- padding-right: 1rem;
467
- }
468
- }
469
-
470
- .markdown-body {
471
- font-size: 0.875rem;
472
- line-height: 1.75;
473
- color: #374151;
474
- word-break: break-word;
475
- }
476
- html.dark .markdown-body { color: #d1d5db; }
477
-
478
- .markdown-body h1, .markdown-body h2, .markdown-body h3,
479
- .markdown-body h4, .markdown-body h5, .markdown-body h6 {
480
- font-weight: 700;
481
- line-height: 1.3;
482
- margin: 1.2em 0 0.5em;
483
- color: #111827;
484
- }
485
- html.dark .markdown-body h1, html.dark .markdown-body h2,
486
- html.dark .markdown-body h3, html.dark .markdown-body h4 { color: #f9fafb; }
487
-
488
- .markdown-body h1 { font-size: 1.25rem; border-bottom: 2px solid #e5e7eb; padding-bottom: 0.4rem; }
489
- .markdown-body h2 { font-size: 1.1rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.3rem; }
490
- html.dark .markdown-body h1, html.dark .markdown-body h2 { border-color: #374151; }
491
- .markdown-body h3 { font-size: 0.95rem; }
492
-
493
- .markdown-body p { margin: 0.6em 0; }
494
- .markdown-body ul, .markdown-body ol {
495
- padding-left: 1.5rem;
496
- margin: 0.5em 0;
497
- }
498
- .markdown-body ul { list-style-type: disc; }
499
- .markdown-body ol { list-style-type: decimal; }
500
- .markdown-body li { margin: 0.25em 0; }
501
-
502
- .markdown-body code {
503
- font-family: 'JetBrains Mono', 'Fira Code', monospace;
504
- font-size: 0.8rem;
505
- background: #f3f4f6;
506
- color: #6d28d9;
507
- padding: 0.15em 0.4em;
508
- border-radius: 5px;
509
- border: 1px solid #e5e7eb;
510
- }
511
- html.dark .markdown-body code {
512
- background: rgba(139,92,246,0.12);
513
- color: #c4b5fd;
514
- border-color: rgba(139,92,246,0.2);
515
- }
516
- .markdown-body pre {
517
- background: #f8fafc;
518
- border: 1px solid #e5e7eb;
519
- border-radius: 10px;
520
- padding: 1rem;
521
- overflow-x: auto;
522
- margin: 0.75em 0;
523
- }
524
- html.dark .markdown-body pre {
525
- background: #0f172a;
526
- border-color: #334155;
527
- }
528
- .markdown-body pre code {
529
- background: none;
530
- border: none;
531
- padding: 0;
532
- color: inherit;
533
- font-size: 0.82rem;
534
- }
535
- .markdown-body blockquote {
536
- border-left: 3px solid #0ea5e9;
537
- margin: 0.75em 0;
538
- padding: 0.5rem 1rem;
539
- background: rgba(14,165,233,0.05);
540
- border-radius: 0 8px 8px 0;
541
- color: #4b5563;
542
- font-style: italic;
543
- }
544
- html.dark .markdown-body blockquote {
545
- color: #9ca3af;
546
- background: rgba(14,165,233,0.08);
547
- }
548
- .markdown-body a {
549
- color: #0ea5e9;
550
- text-decoration: underline;
551
- text-underline-offset: 2px;
552
- }
553
- .markdown-body a:hover { color: #0284c7; }
554
- html.dark .markdown-body a { color: #38bdf8; }
555
-
556
- .markdown-body strong { font-weight: 700; color: #111827; }
557
- html.dark .markdown-body strong { color: #f9fafb; }
558
- .markdown-body em { font-style: italic; }
559
-
560
- .markdown-body hr {
561
- border: none;
562
- border-top: 1px solid #e5e7eb;
563
- margin: 1rem 0;
564
- }
565
- html.dark .markdown-body hr { border-color: #374151; }
566
-
567
- .markdown-body table {
568
- width: 100%;
569
- border-collapse: collapse;
570
- font-size: 0.8rem;
571
- margin: 0.75em 0;
572
- }
573
- .markdown-body th {
574
- background: #f1f5f9;
575
- font-weight: 700;
576
- text-align: left;
577
- padding: 0.5rem 0.75rem;
578
- border: 1px solid #e5e7eb;
579
- }
580
- html.dark .markdown-body th { background: #1e293b; border-color: #334155; }
581
- .markdown-body td {
582
- padding: 0.4rem 0.75rem;
583
- border: 1px solid #e5e7eb;
584
- }
585
- html.dark .markdown-body td { border-color: #334155; }
586
- .markdown-body tr:nth-child(even) { background: #f8fafc; }
587
- html.dark .markdown-body tr:nth-child(even) { background: rgba(30,41,59,0.4); }
588
-
589
- /* Custom Scrollbar */
590
- ::-webkit-scrollbar { width: 8px; height: 8px; }
591
- ::-webkit-scrollbar-track { background: transparent; }
592
- ::-webkit-scrollbar-thumb {
593
- background: rgba(148, 163, 184, 0.2);
594
- border-radius: 10px;
595
- }
596
- ::-webkit-scrollbar-thumb:hover {
597
- background: rgba(148, 163, 184, 0.4);
598
- }
599
- html.dark ::-webkit-scrollbar-thumb {
600
- background: rgba(51, 65, 85, 0.4);
601
- }
602
-
603
- /* Repo Sidebar */
604
- #repoSidebar {
605
- transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
606
- width: 280px;
607
- }
608
- .repo-sidebar-collapsed #repoSidebar {
609
- width: 80px;
610
- }
611
- .repo-sidebar-collapsed .repo-item-copy,
612
- .repo-sidebar-collapsed .repo-group-label,
613
- .repo-sidebar-collapsed .repo-sidebar-header-text,
614
- .repo-sidebar-collapsed .repo-search-container,
615
- .repo-sidebar-collapsed .repo-item-pin {
616
- display: none;
617
- }
618
- .repo-sidebar-collapsed .repo-item {
619
- justify-content: center;
620
- padding-left: 0;
621
- padding-right: 0;
622
- }
623
- .repo-item {
624
- display: flex;
625
- align-items: center;
626
- gap: 12px;
627
- padding: 10px 14px;
628
- border-radius: 12px;
629
- cursor: pointer;
630
- transition: all 0.2s ease;
631
- position: relative;
632
- border: 1px solid transparent;
633
- }
634
- .repo-item:hover {
635
- background: rgba(241, 245, 249, 0.8);
636
- }
637
- html.dark .repo-item:hover {
638
- background: rgba(30, 41, 59, 0.6);
639
- }
640
- /* Chat UI Styles */
641
- .chat-bubble {
642
- max-width: 85%;
643
- padding: 0.75rem 1rem;
644
- border-radius: 1.25rem;
645
- position: relative;
646
- font-size: 0.875rem;
647
- line-height: 1.5;
648
- box-shadow: 0 2px 5px rgba(0,0,0,0.05);
649
- transition: all 0.2s ease;
650
- }
651
- .chat-bubble-agent {
652
- align-self: flex-end;
653
- border-bottom-right-radius: 0.25rem;
654
- background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
655
- color: white;
656
- }
657
- .chat-bubble-mcp {
658
- align-self: flex-start;
659
- border-bottom-left-radius: 0.25rem;
660
- background: #f1f5f9;
661
- color: #1e293b;
662
- border: 1px solid #e2e8f0;
663
- }
664
- html.dark .chat-bubble-mcp {
665
- background: #1e293b;
666
- color: #f1f5f9;
667
- border-color: #334155;
668
- }
669
- .chat-timestamp {
670
- font-size: 0.65rem;
671
- color: #94a3b8;
672
- margin-top: 0.25rem;
673
- padding: 0 0.5rem;
674
- }
675
- .agent-align { align-items: flex-end; }
676
- .mcp-align { align-items: flex-start; }
677
-
678
- #recentQueries {
679
- display: flex;
680
- flex-direction: column;
681
- gap: 1rem;
682
- }
683
-
684
- .repo-item.active {
685
- background: white;
686
- border-color: rgba(14, 165, 233, 0.2);
687
- box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
688
- }
689
- html.dark .repo-item.active {
690
- background: rgba(30, 41, 59, 0.8);
691
- border-color: rgba(56, 189, 248, 0.3);
692
- box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
693
- }
694
- .repo-avatar {
695
- width: 36px;
696
- height: 36px;
697
- border-radius: 10px;
698
- background: linear-gradient(135deg, #0ea5e9 0%, #6366f1 100%);
699
- color: white;
700
- display: flex;
701
- align-items: center;
702
- justify-content: center;
703
- font-weight: 700;
704
- font-size: 13px;
705
- flex-shrink: 0;
706
- box-shadow: 0 4px 10px rgba(14, 165, 233, 0.2);
707
- }
708
- .repo-group-label {
709
- font-size: 11px;
710
- font-weight: 700;
711
- text-transform: uppercase;
712
- letter-spacing: 0.05em;
713
- color: #94a3b8;
714
- margin: 20px 0 8px 14px;
715
- }
716
- .repo-active-dot {
717
- position: absolute;
718
- left: 4px;
719
- top: 50%;
720
- transform: translateY(-50%);
721
- width: 4px;
722
- height: 16px;
723
- background: #0ea5e9;
724
- border-radius: 0 4px 4px 0;
725
- }
726
-
727
- .repo-item-pin {
728
- opacity: 0;
729
- transition: opacity 0.2s ease;
730
- color: #94a3b8;
731
- }
732
- .repo-item:hover .repo-item-pin, .repo-item-pin.pinned {
733
- opacity: 1;
734
- }
735
- .repo-item-pin.pinned {
736
- color: #0ea5e9;
737
- }
738
- .repo-item.dragging {
739
- opacity: 0.5;
740
- cursor: grabbing;
741
- }
742
- .repo-item.drag-target {
743
- border-top: 2px solid #0ea5e9;
744
- }
745
-
746
- .repo-drag-handle {
747
- cursor: grab;
748
- color: #cbd5e1;
749
- padding: 4px;
750
- }
751
- html.dark .repo-drag-handle {
752
- color: #475569;
753
- }
754
-
755
- #appLayout {
756
- min-height: 100vh;
757
- }
758
- #appLayout.repo-sidebar-collapsed {
759
- --dashboard-main-offset: 80px;
760
- }
761
- #mainContent {
762
- min-width: 0;
763
- margin-left: 280px;
764
- transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
765
- }
766
- #appLayout.repo-sidebar-collapsed {
767
- }
768
- #appLayout.repo-sidebar-collapsed #mainContent {
769
- margin-left: 80px;
770
- }
771
- #repoSidebar {
772
- position: fixed !important;
773
- top: 0 !important;
774
- left: 0;
775
- height: 100dvh;
776
- max-height: 100dvh;
777
- overflow: hidden !important;
778
- }
779
- #mainTopBar {
780
- position: fixed !important;
781
- top: 0;
782
- left: calc(var(--dashboard-main-offset) + var(--dashboard-left-seam));
783
- right: 0;
784
- margin-bottom: 0 !important;
785
- }
786
- #dashboardShell {
787
- padding-top: calc(var(--dashboard-header-offset) + 0.2rem);
788
- }
789
-
790
- @media (max-width: 1024px) {
791
- #appLayout {
792
- --dashboard-main-offset: 0px;
793
- --dashboard-left-seam: var(--dashboard-main-gutter);
794
- }
795
- #repoSidebar {
796
- display: none;
797
- }
798
- #mainContent {
799
- margin-left: 0;
800
- }
801
- }
802
- @media (min-width: 768px) {
803
- :root {
804
- --dashboard-main-gutter: 32px;
805
- }
806
- }
807
- @media (min-width: 1024px) {
808
- :root {
809
- --dashboard-main-gutter: 48px;
810
- }
811
- }
812
-
813
- /* Sticky Tab Navigation */
814
- .sticky-tab-nav {
815
- position: relative;
816
- top: auto;
817
- left: auto;
818
- right: auto;
819
- z-index: 30;
820
- padding-top: 0.15rem;
821
- padding-bottom: 0.55rem;
822
- margin-left: 0;
823
- margin-right: 0;
824
- padding-left: 0;
825
- padding-right: 0;
826
- background: linear-gradient(180deg, rgba(244,251,255,0.97) 70%, transparent 100%);
827
- backdrop-filter: blur(18px);
828
- -webkit-backdrop-filter: blur(18px);
829
- }
830
- html.dark .sticky-tab-nav {
831
- background: linear-gradient(180deg, rgba(2,6,23,0.97) 70%, transparent 100%);
832
- }
833
-
834
- #tabRail {
835
- background: rgba(255, 255, 255, 0.72);
836
- border-color: rgba(148, 163, 184, 0.22);
837
- box-shadow:
838
- 0 14px 30px rgba(148, 163, 184, 0.16),
839
- inset 0 1px 0 rgba(255, 255, 255, 0.8);
840
- }
841
-
842
- html.dark #tabRail {
843
- background: rgba(15, 23, 42, 0.9);
844
- border-color: rgba(51, 65, 85, 0.9);
845
- box-shadow:
846
- 0 18px 40px rgba(2, 6, 23, 0.42),
847
- inset 0 1px 0 rgba(148, 163, 184, 0.06);
848
- }
849
-
850
- #tabIndicator {
851
- display: none;
852
- }
853
-
854
- html.dark #tabIndicator {
855
- display: none;
856
- }
857
-
858
- .tab-button {
859
- min-height: 2.5rem;
860
- color: #475569;
861
- }
862
-
863
- .tab-button:hover {
864
- color: #0f172a;
865
- background: rgba(255, 255, 255, 0.58);
866
- }
867
-
868
- .tab-button.tab-active,
869
- .tab-button.tab-active:hover {
870
- color: #ffffff;
871
- background: linear-gradient(135deg, #0ea5e9 0%, #2563eb 100%);
872
- border: 1px solid rgba(37, 99, 235, 0.18);
873
- box-shadow:
874
- 0 10px 24px rgba(37, 99, 235, 0.24),
875
- inset 0 1px 0 rgba(255, 255, 255, 0.28);
876
- }
877
-
878
- html.dark .tab-button {
879
- color: #94a3b8;
880
- }
881
-
882
- html.dark .tab-button:hover {
883
- color: #e2e8f0;
884
- background: rgba(30, 41, 59, 0.78);
885
- }
886
-
887
- html.dark .tab-button.tab-active,
888
- html.dark .tab-button.tab-active:hover {
889
- color: #ffffff;
890
- background: linear-gradient(135deg, rgba(14,165,233,0.95) 0%, rgba(79,70,229,0.92) 100%);
891
- border: 1px solid rgba(59, 130, 246, 0.32);
892
- box-shadow:
893
- 0 12px 28px rgba(14,165,233,0.2),
894
- inset 0 1px 0 rgba(255,255,255,0.12);
895
- }
896
-
897
- /* Chart containers - precise height control */
898
- .chart-donut-wrap {
899
- position: relative;
900
- width: 100%;
901
- height: 220px;
902
- }
903
- .chart-line-wrap {
904
- position: relative;
905
- width: 100%;
906
- height: 200px;
907
- }
908
- .chart-bar-wrap {
909
- position: relative;
910
- width: 100%;
911
- height: 180px;
912
- }
913
- .chart-scatter-wrap {
914
- position: relative;
915
- width: 100%;
916
- height: 180px;
917
- }
918
-
919
- /* Edit button - fixed contrast for dark/light */
920
- .btn-edit-light {
921
- padding: 0.35rem 0.75rem;
922
- border-radius: 6px;
923
- font-size: 0.7rem;
924
- font-weight: 700;
925
- background: #fef3c7;
926
- color: #92400e;
927
- border: 1px solid #fcd34d;
928
- transition: all 0.2s;
929
- }
930
- .btn-edit-light:hover {
931
- background: #fde68a;
932
- color: #78350f;
933
- }
934
- html.dark .btn-edit-light {
935
- background: rgba(245,158,11,0.18);
936
- color: #fcd34d;
937
- border-color: rgba(245,158,11,0.35);
938
- }
939
- html.dark .btn-edit-light:hover {
940
- background: rgba(245,158,11,0.28);
941
- color: #fef08a;
942
- }
943
- .btn-open {
944
- padding: 0.35rem 0.75rem;
945
- border-radius: 6px;
946
- font-size: 0.7rem;
947
- font-weight: 700;
948
- background: #2563eb;
949
- color: #ffffff;
950
- border: 1px solid #1d4ed8;
951
- transition: all 0.2s;
952
- }
953
- .btn-open:hover {
954
- background: #1d4ed8;
955
- }
956
- html.dark .btn-open {
957
- background: rgba(56,189,248,0.15);
958
- color: #7dd3fc;
959
- border-color: rgba(56,189,248,0.3);
960
- }
961
- html.dark .btn-open:hover {
962
- background: rgba(56,189,248,0.25);
963
- color: #bae6fd;
964
- }
965
- </style>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>MCP Memory Dashboard</title>
7
+ <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><defs><linearGradient id=%22g%22 x1=%220%%22 y1=%220%%22 x2=%22100%%22 y2=%22100%%22><stop offset=%220%%22 stop-color=%22%230ea5e9%22/><stop offset=%22100%%22 stop-color=%22%236366f1%22/></linearGradient></defs><rect x=%2215%22 y=%2215%22 width=%2270%22 height=%2270%22 rx=%2215%22 fill=%22url(%23g)%22/><path d=%22M30 35h40M30 50h40M30 65h25%22 stroke=%22white%22 stroke-width=%228%22 stroke-linecap=%22round%22/></svg>" />
8
+ <link rel="preconnect" href="https://fonts.googleapis.com">
9
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
11
+ <script type="module" crossorigin src="/assets/index-Lu37nzOi.js"></script>
12
+ <link rel="stylesheet" crossorigin href="/assets/index-KxrQ6fPK.css">
966
13
  </head>
967
- <body class="bg-slate-50 dark:bg-slate-950 text-slate-900 dark:text-slate-100 min-h-screen transition-colors duration-500 font-sans selection:bg-sky-500/30">
968
- <div id="appLayout" class="relative">
969
- <!-- Sidebar -->
970
- <aside id="repoSidebar" class="h-screen overflow-y-auto bg-white/40 dark:bg-slate-900/40 backdrop-blur-xl border-r border-slate-200 dark:border-slate-800 z-20 flex flex-col" style="position: sticky; top: 0;">
971
- <div class="p-6 flex items-center justify-between repo-sidebar-header">
972
- <div class="flex items-center gap-3 repo-sidebar-header-text">
973
- <div class="w-8 h-8 rounded-lg bg-gradient-to-tr from-sky-500 to-indigo-600 flex items-center justify-center shadow-lg shadow-sky-500/20">
974
- <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path></svg>
975
- </div>
976
- <span class="font-bold text-lg tracking-tight">Contexts</span>
977
- <span id="repoCountBadge" class="ml-auto px-2 py-0.5 rounded-full bg-slate-100 dark:bg-slate-800 text-[10px] font-bold text-slate-500 dark:text-slate-400 border border-slate-200 dark:border-slate-700">0</span>
978
- </div>
979
- <button id="repoSidebarCollapseToggle" class="p-2 hover:bg-slate-100 dark:hover:bg-slate-800 rounded-lg transition-colors" title="Collapse repositories">
980
- <svg id="repoSidebarCollapseIcon" class="w-5 h-5 text-slate-500 transition-transform duration-300" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 19l-7-7 7-7m8 14l-7-7 7-7"></path></svg>
981
- </button>
982
- </div>
983
-
984
- <!-- Collapsed Summary -->
985
- <div id="repoCollapsedSummary" class="hidden flex-col items-center py-4 gap-4">
986
- <button id="repoCollapsedSummaryButton" class="w-12 h-12 rounded-xl bg-sky-500/10 border border-sky-500/20 flex flex-col items-center justify-center gap-0.5 hover:bg-sky-500/20 transition-all group">
987
- <span id="repoCollapsedSummaryInitials" class="text-xs font-bold text-sky-600 dark:text-sky-400">RP</span>
988
- <span id="repoCollapsedSummaryCount" class="text-[10px] font-medium text-sky-500/70">0</span>
989
- </button>
990
- </div>
991
-
992
- <div class="px-4 mb-6 repo-search-container">
993
- <div class="relative group">
994
- <input type="text" id="repoSearchInput" placeholder="Search repositories..." class="w-full pl-10 pr-4 py-2.5 bg-slate-100 dark:bg-slate-800/50 border-none rounded-xl text-sm focus:ring-2 focus:ring-sky-500/50 transition-all outline-none">
995
- <svg class="w-4 h-4 text-slate-400 absolute left-3.5 top-3 group-focus-within:text-sky-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
996
- </div>
997
- </div>
998
-
999
- <div id="repoSidebarList" class="flex-1 overflow-y-auto px-3 space-y-1 pb-20">
1000
- <div class="text-sm text-gray-500 dark:text-gray-400 px-3 py-4 text-center">
1001
- <div class="skeleton h-8 w-full mb-2 rounded-lg"></div>
1002
- <div class="skeleton h-8 w-full mb-2 rounded-lg"></div>
1003
- <div class="skeleton h-8 w-full mb-2 rounded-lg"></div>
1004
- </div>
1005
- </div>
1006
-
1007
- <div class="p-4 border-t border-slate-200 dark:border-slate-800 bg-white/40 dark:bg-slate-900/40 backdrop-blur-md repo-sidebar-footer">
1008
- <div class="flex items-center gap-3 px-2">
1009
- <div class="w-2 h-2 rounded-full bg-emerald-500 animate-pulse"></div>
1010
- <div class="flex-1 min-w-0">
1011
- <p class="text-[10px] font-bold text-slate-400 uppercase tracking-widest">Active Store</p>
1012
- <p id="dbPathLabel" class="text-xs font-medium truncate text-slate-600 dark:text-slate-300">memory.db</p>
1013
- </div>
1014
- </div>
1015
- </div>
1016
- </aside>
1017
-
1018
- <!-- Main Content -->
1019
- <main id="mainContent" class="flex-1 p-4 md:p-8 lg:p-12 relative z-10">
1020
- <!-- Header/Navbar substitute (Sticky) -->
1021
- <div id="mainTopBar" class="z-40 flex flex-col md:flex-row md:items-center justify-between gap-6 py-3 px-4 md:px-8 lg:px-12 bg-white/60 dark:bg-slate-900/60 backdrop-blur-xl border-b border-slate-200/50 dark:border-white/5 shadow-sm">
1022
- <div>
1023
- <h1 class="text-2xl font-extrabold tracking-tight bg-clip-text text-transparent bg-gradient-to-r from-slate-900 to-slate-600 dark:from-white dark:to-slate-400 mb-1">MCP Memory Dashboard</h1>
1024
- <div class="flex items-center gap-3">
1025
- <span id="currentRepoLabel" class="px-3 py-0.5 rounded-full bg-sky-500/10 text-sky-600 dark:text-sky-400 text-[10px] font-bold border border-sky-500/20">No repository</span>
1026
- <span id="memorySummaryLabel" class="text-slate-500 dark:text-slate-400 text-[10px] font-medium">0 memories indexed</span>
1027
- <span id="appVersion" class="text-[9px] font-bold text-slate-400 dark:text-slate-600 bg-slate-100 dark:bg-slate-800/50 px-1.5 py-0.5 rounded border border-slate-200 dark:border-slate-700/50">...</span>
1028
- </div>
1029
- </div>
1030
-
1031
- <div class="flex items-center gap-3">
1032
- <button id="repoNavToggle" class="md:hidden p-2 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl shadow-sm hover:shadow-md transition-all active:scale-95" title="View repositories">
1033
- <svg class="w-5 h-5 text-slate-600 dark:text-slate-300" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
1034
- </button>
1035
-
1036
- <div class="hidden md:flex items-center gap-2 px-3 py-1.5 bg-white/50 dark:bg-slate-800/50 backdrop-blur-md border border-slate-200 dark:border-slate-700 rounded-xl shadow-sm">
1037
- <div id="statusDot" class="w-1.5 h-1.5 rounded-full bg-gray-400 shadow-[0_0_8px_rgba(156,163,175,0.5)]"></div>
1038
- <span id="statusText" class="text-[9px] font-bold uppercase tracking-wider text-slate-600 dark:text-slate-300">Checking...</span>
1039
- </div>
1040
-
1041
- <div class="hidden md:flex flex-col gap-1 px-3 py-1.5 bg-white/50 dark:bg-slate-800/50 backdrop-blur-md border border-slate-200 dark:border-slate-700 rounded-xl shadow-sm min-w-[120px]">
1042
- <div class="flex items-center justify-between gap-3">
1043
- <span id="syncStatus" class="text-[9px] font-bold text-slate-400 uppercase tracking-widest leading-none">Synced 0s ago</span>
1044
- <div class="w-1 h-1 rounded-full bg-emerald-500 animate-pulse"></div>
1045
- </div>
1046
- <div class="w-full h-0.5 bg-slate-100 dark:bg-slate-800 rounded-full overflow-hidden">
1047
- <div id="countdownFill" class="h-full bg-sky-500 transition-all duration-1000 ease-linear" style="width: 100%"></div>
1048
- </div>
1049
- </div>
1050
-
1051
- <div class="h-8 w-[1px] bg-slate-200 dark:bg-slate-800 hidden md:block"></div>
1052
-
1053
- <div class="flex items-center gap-2">
1054
- <a href="https://github.com/vheins/local-memory-mcp" target="_blank" class="p-2 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl shadow-sm hover:shadow-md transition-all active:scale-95 group" title="View on GitHub">
1055
- <svg class="w-4 h-4 text-slate-600 dark:text-slate-300 group-hover:text-sky-500" fill="currentColor" viewBox="0 0 24 24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.744.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
1056
- </a>
1057
- <a href="https://www.npmjs.com/package/@vheins/local-memory-mcp" target="_blank" class="p-2 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl shadow-sm hover:shadow-md transition-all active:scale-95 group" title="View on NPM">
1058
- <svg class="w-4 h-4 text-slate-600 dark:text-slate-300 group-hover:text-red-500" fill="currentColor" viewBox="0 0 24 24"><path d="M0 7.334v8h6.666v1.332H12v-1.332h12v-8H0zm6.666 6.666H5.334v-4H3.999v4H1.335V8.669h5.331v5.331zm4 0H9.332V8.669h1.334v5.331zm6.666 0h-1.332v-4h-1.335v4h-1.332v-4h-1.335v4h-1.332V8.669h6.666v5.331z"/></svg>
1059
- </a>
1060
- <a href="https://github.com/vheins/local-memory-mcp/stargazers" target="_blank" class="hidden lg:flex items-center gap-2 px-3 py-2 bg-amber-400 hover:bg-amber-500 text-amber-950 rounded-xl shadow-sm hover:shadow-md transition-all active:scale-95 font-bold text-[10px]">
1061
- <svg class="w-3.5 h-3.5" fill="currentColor" viewBox="0 0 24 24"><path d="M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z"/></svg>
1062
- Star
1063
- </a>
1064
- </div>
1065
-
1066
- <div class="h-8 w-[1px] bg-slate-200 dark:bg-slate-800 hidden md:block"></div>
1067
-
1068
- <button id="themeToggle" class="p-2 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl shadow-sm hover:shadow-md transition-all active:scale-95 group" title="Toggle dark mode">
1069
- <svg class="w-4 h-4 text-slate-600 dark:text-slate-300 group-hover:text-sky-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
1070
- <path class="dark:hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path>
1071
- <path class="hidden dark:block" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364-6.364l-.707.707M6.343 17.657l-.707.707m12.728 0l-.707-.707M6.343 6.343l-.707-.707M12 5a7 7 0 100 14 7 7 0 000-14z"></path>
1072
- </svg>
1073
- </button>
1074
- </div>
1075
- </div>
1076
-
1077
- <div id="dashboardShell" class="min-w-0">
1078
- <!-- Sticky Tab Navigation Wrapper -->
1079
- <div class="sticky-tab-nav px-4 md:px-0">
1080
- <!-- Futuristic Agentic Tab Switcher -->
1081
- <div id="tabRail" class="relative mb-0 mx-auto grid w-full max-w-[42rem] grid-cols-4 items-stretch overflow-hidden rounded-2xl border border-white/20 bg-white/5 p-1.5 shadow-[0_8px_32px_0_rgba(31,38,135,0.07)] backdrop-blur-md dark:border-white/10 dark:bg-black/20 group">
1082
- <!-- Active Indicator Slide Background -->
1083
- <div id="tabIndicator" class="absolute top-1.5 bottom-1.5 left-1.5 rounded-xl bg-gradient-to-br from-sky-400/90 via-sky-500 to-indigo-600/90 shadow-[0_0_15px_rgba(14,165,233,0.3)] transition-all duration-500 cubic-bezier(0.4, 0, 0.2, 1) z-0"></div>
1084
-
1085
- <button onclick="switchTab('dashboard')" id="dashboardTabBtn"
1086
- class="tab-button tab-active relative z-10 flex min-w-0 items-center justify-center gap-2 rounded-xl px-2 py-2.5 text-[10px] font-bold uppercase tracking-[0.1em] transition-all duration-300">
1087
- <svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-5l-5 5v-5z"></path></svg>
1088
- <span class="hidden sm:inline">Dashboard</span>
1089
- </button>
1090
- <button onclick="switchTab('memories')" id="memoriesTabBtn"
1091
- class="tab-button relative z-10 flex min-w-0 items-center justify-center gap-2 rounded-xl px-2 py-2.5 text-[10px] font-bold uppercase tracking-[0.1em] transition-all duration-300">
1092
- <svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path></svg>
1093
- <span class="hidden sm:inline">Memories</span>
1094
- </button>
1095
- <button onclick="switchTab('tasks')" id="tasksTabBtn"
1096
- class="tab-button relative z-10 flex min-w-0 items-center justify-center gap-2 rounded-xl px-2 py-2.5 text-[10px] font-bold uppercase tracking-[0.1em] transition-all duration-300">
1097
- <svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"></path></svg>
1098
- <span class="hidden sm:inline">Tasks</span>
1099
- </button>
1100
- <button onclick="switchTab('reference')" id="referenceTabBtn"
1101
- class="tab-button relative z-10 flex min-w-0 items-center justify-center gap-2 rounded-xl px-2 py-2.5 text-[10px] font-bold uppercase tracking-[0.1em] transition-all duration-300">
1102
- <svg class="h-3.5 w-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
1103
- <span class="hidden sm:inline">Reference</span>
1104
- </button>
1105
- </div>
1106
- </div><!-- end sticky-tab-nav -->
1107
-
1108
- <div id="dashboardContent" class="animate-fade-in mt-5">
1109
- <!-- Summary Cards + Charts + Recent Queries (2/3 + 1/3) -->
1110
- <div class="grid lg:grid-cols-3 gap-6 mb-6" style="min-height: 60vh;">
1111
- <!-- Main Content: 2/3 -->
1112
- <div class="lg:col-span-2 flex flex-col">
1113
- <!-- Summary Cards -->
1114
- <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
1115
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1116
- <div class="text-xs text-gray-500 dark:text-gray-400 uppercase font-bold tracking-wider mb-1">Total Memories</div>
1117
- <div id="totalCount" class="text-2xl font-bold">0</div>
1118
- </div>
1119
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1120
- <div class="text-xs text-gray-500 dark:text-gray-400 uppercase font-bold tracking-wider mb-1">Avg Importance</div>
1121
- <div id="avgImportance" class="text-2xl font-bold">0</div>
1122
- </div>
1123
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1124
- <div class="text-xs text-gray-500 dark:text-gray-400 uppercase font-bold tracking-wider mb-1">Total Hits</div>
1125
- <div id="totalHits" class="text-2xl font-bold">0</div>
1126
- </div>
1127
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1128
- <div class="text-xs text-gray-500 dark:text-gray-400 uppercase font-bold tracking-wider mb-1">Expiring Soon</div>
1129
- <div id="expiringSoon" class="text-2xl font-bold text-orange-500">0</div>
1130
- </div>
1131
- </div>
1132
-
1133
- <!-- Task Summary Cards -->
1134
- <div class="grid grid-cols-2 md:grid-cols-5 gap-4 mb-6">
1135
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-indigo-100 dark:border-indigo-900/30">
1136
- <div class="text-xs text-indigo-500 dark:text-indigo-400 uppercase font-bold tracking-wider mb-1">Total Tasks</div>
1137
- <div id="totalTasks" class="text-2xl font-bold">0</div>
1138
- </div>
1139
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-100 dark:border-gray-700">
1140
- <div class="text-xs text-gray-500 dark:text-gray-400 uppercase font-bold tracking-wider mb-1">Backlog</div>
1141
- <div id="backlogTasksCount" class="text-2xl font-bold text-gray-500">0</div>
1142
- </div>
1143
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-100 dark:border-gray-700">
1144
- <div class="text-xs text-gray-500 dark:text-gray-400 uppercase font-bold tracking-wider mb-1">Task To Do</div>
1145
- <div id="todoTasksCount" class="text-2xl font-bold">0</div>
1146
- </div>
1147
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-sky-100 dark:border-sky-900/30">
1148
- <div class="text-xs text-sky-500 dark:text-sky-400 uppercase font-bold tracking-wider mb-1">In Progress</div>
1149
- <div id="inProgressTasksCount" class="text-2xl font-bold text-sky-600">0</div>
1150
- </div>
1151
- <div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-emerald-100 dark:border-emerald-900/30">
1152
- <div class="text-xs text-emerald-500 dark:text-emerald-400 uppercase font-bold tracking-wider mb-1">Completed</div>
1153
- <div id="completedTasksCount" class="text-2xl font-bold text-emerald-600">0</div>
1154
- </div>
1155
- </div>
1156
-
1157
- <!-- Today's Stats Cards -->
1158
- <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
1159
- <div class="bg-gradient-to-br from-emerald-50 to-white dark:from-emerald-900/10 dark:to-gray-800 p-4 rounded-lg shadow-sm border border-emerald-100 dark:border-emerald-900/30">
1160
- <div class="flex items-center justify-between">
1161
- <div class="text-xs text-emerald-600 dark:text-emerald-400 uppercase font-bold tracking-wider">Today Completed</div>
1162
- <svg class="w-4 h-4 text-emerald-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
1163
- </div>
1164
- <div id="todayCompleted" class="text-3xl font-black text-emerald-600 dark:text-emerald-400 mt-1">0</div>
1165
- </div>
1166
- <div class="bg-gradient-to-br from-indigo-50 to-white dark:from-indigo-900/10 dark:to-gray-800 p-4 rounded-lg shadow-sm border border-indigo-100 dark:border-indigo-900/30">
1167
- <div class="flex items-center justify-between">
1168
- <div class="text-xs text-indigo-600 dark:text-indigo-400 uppercase font-bold tracking-wider">Today Added</div>
1169
- <svg class="w-4 h-4 text-indigo-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path></svg>
1170
- </div>
1171
- <div id="todayAdded" class="text-3xl font-black text-indigo-600 dark:text-indigo-400 mt-1">0</div>
1172
- </div>
1173
- <div class="bg-gradient-to-br from-sky-50 to-white dark:from-sky-900/10 dark:to-gray-800 p-4 rounded-lg shadow-sm border border-sky-100 dark:border-sky-900/30">
1174
- <div class="flex items-center justify-between">
1175
- <div class="text-xs text-sky-600 dark:text-sky-400 uppercase font-bold tracking-wider">Today Processed</div>
1176
- <svg class="w-4 h-4 text-sky-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
1177
- </div>
1178
- <div id="todayProcessed" class="text-3xl font-black text-sky-600 dark:text-sky-400 mt-1">0</div>
1179
- </div>
1180
- <div class="bg-gradient-to-br from-amber-50 to-white dark:from-amber-900/10 dark:to-gray-800 p-4 rounded-lg shadow-sm border border-amber-100 dark:border-amber-900/30">
1181
- <div class="flex items-center justify-between">
1182
- <div class="text-xs text-amber-600 dark:text-amber-400 uppercase font-bold tracking-wider">Today Tokens</div>
1183
- <svg class="w-4 h-4 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
1184
- </div>
1185
- <div id="todayTokens" class="text-3xl font-black text-amber-600 dark:text-amber-400 mt-1">0</div>
1186
- </div>
1187
- <div class="bg-gradient-to-br from-rose-50 to-white dark:from-rose-900/10 dark:to-gray-800 p-4 rounded-lg shadow-sm border border-rose-100 dark:border-rose-900/30">
1188
- <div class="flex items-center justify-between">
1189
- <div class="text-xs text-rose-600 dark:text-rose-400 uppercase font-bold tracking-wider">Today Avg Time</div>
1190
- <svg class="w-4 h-4 text-rose-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
1191
- </div>
1192
- <div id="todayAvgTime" class="text-3xl font-black text-rose-600 dark:text-rose-400 mt-1">0m</div>
1193
- </div>
1194
- </div>
1195
-
1196
- <!-- Charts Section -->
1197
- <div class="grid md:grid-cols-2 gap-6 flex-1">
1198
- <div class="bg-white dark:bg-gray-800 p-4 md:p-5 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1199
- <h3 class="text-xs font-bold text-gray-500 dark:text-gray-400 uppercase tracking-widest mb-3">Memory by Type</h3>
1200
- <div class="chart-donut-wrap">
1201
- <canvas id="typeChart"></canvas>
1202
- </div>
1203
- <div class="grid grid-cols-2 gap-1.5 mt-3 text-[10px]">
1204
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-rose-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Decision:</span> <span id="decisionCount" class="font-bold">0</span></div>
1205
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-violet-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Mistake:</span> <span id="mistakeCount" class="font-bold">0</span></div>
1206
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-sky-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Code Fact:</span> <span id="codeFactCount" class="font-bold">0</span></div>
1207
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-emerald-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Pattern:</span> <span id="patternCount" class="font-bold">0</span></div>
1208
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-orange-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Handoff:</span> <span id="handoffCount" class="font-bold">0</span></div>
1209
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-lime-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Registry:</span> <span id="registeredCount" class="font-bold">0</span></div>
1210
- </div>
1211
- </div>
1212
- <div class="bg-white dark:bg-gray-800 p-4 md:p-5 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1213
- <h3 class="text-xs font-bold text-gray-500 dark:text-gray-400 uppercase tracking-widest mb-3">Task Status Overview</h3>
1214
- <div class="chart-donut-wrap">
1215
- <canvas id="taskStatusChart"></canvas>
1216
- </div>
1217
- <div class="grid grid-cols-2 gap-1.5 mt-3 text-[10px]">
1218
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-slate-500 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Backlog:</span> <span id="backlogStatCount" class="font-bold">0</span></div>
1219
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-slate-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">To Do:</span> <span id="todoStatCount" class="font-bold">0</span></div>
1220
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-sky-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">In Progress:</span> <span id="inProgressStatCount" class="font-bold">0</span></div>
1221
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-emerald-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Completed:</span> <span id="completedStatCount" class="font-bold">0</span></div>
1222
- <div class="flex items-center gap-1.5"><span class="w-2 h-2 rounded-full bg-rose-400 flex-shrink-0"></span> <span class="text-gray-500 dark:text-gray-400">Blocked:</span> <span id="blockedStatCount" class="font-bold">0</span></div>
1223
- </div>
1224
- </div>
1225
- <div class="bg-white dark:bg-gray-800 p-4 md:p-5 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1226
- <h3 class="text-xs font-bold text-gray-500 dark:text-gray-400 uppercase tracking-widest mb-3">Activity Over Time (30 days)</h3>
1227
- <div class="chart-line-wrap">
1228
- <canvas id="timeSeriesChart"></canvas>
1229
- </div>
1230
- </div>
1231
- <div class="bg-white dark:bg-gray-800 p-4 md:p-5 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1232
- <h3 class="text-xs font-bold text-gray-500 dark:text-gray-400 uppercase tracking-widest mb-3">Importance vs Hit Count</h3>
1233
- <div class="chart-scatter-wrap">
1234
- <canvas id="scatterChart"></canvas>
1235
- </div>
1236
- </div>
1237
- <div class="bg-white dark:bg-gray-800 p-4 md:p-5 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">
1238
- <h3 class="text-xs font-bold text-gray-500 dark:text-gray-400 uppercase tracking-widest mb-3">Top 10 by Hit Count</h3>
1239
- <div class="chart-bar-wrap">
1240
- <canvas id="topMemoriesChart"></canvas>
1241
- </div>
1242
- </div>
1243
- </div>
1244
- </div>
1245
-
1246
- <!-- Recent Actions Sidebar: 1/3 -->
1247
- <div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 flex flex-col max-h-[85vh]">
1248
- <div class="p-4 border-b border-gray-100 dark:border-gray-700 flex items-center justify-between">
1249
- <h3 class="text-sm font-bold text-gray-500 dark:text-gray-400 uppercase tracking-widest">Recent Actions</h3>
1250
- <div class="w-8 h-8 rounded-full bg-slate-50 dark:bg-slate-900 flex items-center justify-center text-slate-400">
1251
- <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
1252
- </div>
1253
- </div>
1254
- <div id="recentQueries" class="flex-1 overflow-y-auto p-4 custom-scrollbar">
1255
- <div class="text-gray-400 text-sm text-center py-6">Loading actions...</div>
1256
- </div>
1257
- <div id="recentActionsPagination" class="p-3 bg-gray-50 dark:bg-gray-900/50 rounded-b-lg"></div>
1258
- </div>
1259
- </div>
1260
- </div>
1261
-
1262
- <div id="memoriesContent" class="hidden animate-fade-in mt-5">
1263
- <!-- Filters and Table Full Width -->
1264
- <div class="bg-white dark:bg-gray-800 rounded-2xl shadow-sm border border-gray-200 dark:border-gray-700 mb-6 relative overflow-hidden">
1265
- <div id="syncProgress" class="absolute top-0 left-0 h-0.5 bg-sky-500 transition-all duration-300 z-50" style="width: 0%"></div>
1266
-
1267
- <div class="p-4 md:p-6 border-b border-gray-100 dark:border-gray-700 bg-gray-50/50 dark:bg-gray-900/20">
1268
- <div class="flex flex-col lg:flex-row lg:items-center justify-between gap-6">
1269
- <div class="flex-1 flex items-center gap-4">
1270
- <div class="relative flex-1 max-w-md group">
1271
- <input type="text" id="searchInput" placeholder="Search memories..." class="w-full pl-10 pr-4 py-2.5 bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-xl text-sm focus:ring-2 focus:ring-sky-500/50 transition-all outline-none">
1272
- <svg class="w-4 h-4 text-gray-400 absolute left-3.5 top-3 group-focus-within:text-sky-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
1273
- </div>
1274
-
1275
- <!-- Filters Popover -->
1276
- <div class="relative">
1277
- <button id="filterPopoverBtn" onclick="toggleFilterPopover()" class="flex items-center gap-2 px-4 py-2.5 bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-xl text-sm font-semibold hover:bg-gray-50 dark:hover:bg-gray-800 transition-all active:scale-95">
1278
- <svg class="w-4 h-4 text-slate-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z"></path></svg>
1279
- Filters
1280
- <span id="activeFilterCount" class="hidden ml-1 px-1.5 py-0.5 rounded-full bg-sky-500 text-white text-[10px] font-bold">0</span>
1281
- </button>
1282
-
1283
- <!-- Popover Menu -->
1284
- <div id="filterPopover" class="hidden absolute left-0 mt-3 w-72 bg-white dark:bg-slate-900 rounded-2xl shadow-2xl border border-slate-200 dark:border-slate-700 z-[60] p-5 animate-fade-in">
1285
- <div class="space-y-5">
1286
- <div>
1287
- <label class="block text-[10px] font-bold text-slate-400 uppercase tracking-widest mb-2">Memory Type</label>
1288
- <select id="typeFilter" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1289
- <option value="">All Types</option>
1290
- <option value="decision">Decision</option>
1291
- <option value="mistake">Mistake</option>
1292
- <option value="code_fact">Code Fact</option>
1293
- <option value="pattern">Pattern</option>
1294
- <option value="agent_handoff">Agent Handoff</option>
1295
- <option value="agent_registered">Agent Registration</option>
1296
- </select>
1297
- </div>
1298
- <div class="grid grid-cols-2 gap-4">
1299
- <div>
1300
- <label class="block text-[10px] font-bold text-slate-400 uppercase tracking-widest mb-2">Min Import.</label>
1301
- <select id="minImportanceFilter" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1302
- <option value="">Any</option>
1303
- <option value="1">1+</option>
1304
- <option value="2">2+</option>
1305
- <option value="3">3+</option>
1306
- <option value="4">4+</option>
1307
- <option value="5">5</option>
1308
- </select>
1309
- </div>
1310
- <div>
1311
- <label class="block text-[10px] font-bold text-slate-400 uppercase tracking-widest mb-2">Max Import.</label>
1312
- <select id="maxImportanceFilter" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1313
- <option value="">Any</option>
1314
- <option value="1">1</option>
1315
- <option value="2">2</option>
1316
- <option value="3">3</option>
1317
- <option value="4">4</option>
1318
- <option value="5">5 or less</option>
1319
- </select>
1320
- </div>
1321
- </div>
1322
- <div class="pt-2 border-t border-slate-100 dark:border-slate-800 flex justify-between items-center">
1323
- <button onclick="resetFilters()" class="text-xs font-bold text-slate-400 hover:text-slate-600 dark:hover:text-slate-200 transition-colors">Reset All</button>
1324
- <button onclick="toggleFilterPopover()" class="px-4 py-1.5 bg-sky-500 hover:bg-sky-600 text-white text-xs font-bold rounded-lg transition-all shadow-lg shadow-sky-500/20">Apply</button>
1325
- </div>
1326
- </div>
1327
- </div>
1328
- </div>
1329
- </div>
1330
-
1331
- <div class="flex flex-wrap items-center gap-3">
1332
- <button onclick="showAddMemoryModal()" class="btn-add-memory h-[42px]" title="Add memory manually">
1333
- <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M12 4v16m8-8H4"></path></svg>
1334
- <span>Add Memory</span>
1335
- </button>
1336
-
1337
- <div class="h-8 w-[1px] bg-slate-200 dark:bg-slate-700 hidden sm:block"></div>
1338
-
1339
- <div class="flex items-center gap-2">
1340
- <button onclick="loadData()" class="p-2.5 text-slate-500 hover:text-sky-600 hover:bg-sky-50 dark:hover:bg-sky-900/20 rounded-xl transition-all active:scale-90" title="Refresh data">
1341
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path></svg>
1342
- </button>
1343
-
1344
- <!-- Export Popover -->
1345
- <div class="relative">
1346
- <button id="exportPopoverBtn" onclick="toggleExportPopover()" class="p-2.5 text-slate-500 hover:text-indigo-600 hover:bg-indigo-50 dark:hover:bg-indigo-900/20 rounded-xl transition-all active:scale-90" title="Export options">
1347
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1m-4-8l-4-4m0 0L8 8m4-4v12"></path></svg>
1348
- </button>
1349
- <div id="exportPopover" class="hidden absolute right-0 mt-3 w-48 bg-white dark:bg-slate-900 rounded-2xl shadow-2xl border border-slate-200 dark:border-slate-700 z-[60] overflow-hidden animate-fade-in">
1350
- <button onclick="exportData('json'); toggleExportPopover();" class="w-full text-left px-4 py-3 text-sm font-semibold hover:bg-slate-50 dark:hover:bg-slate-800 transition-colors flex items-center gap-3">
1351
- <div class="w-2 h-2 rounded-full bg-amber-400"></div> Export as JSON
1352
- </button>
1353
- <button onclick="exportData('csv'); toggleExportPopover();" class="w-full text-left px-4 py-3 text-sm font-semibold hover:bg-slate-50 dark:hover:bg-slate-800 transition-colors flex items-center gap-3 border-t border-slate-100 dark:border-slate-800">
1354
- <div class="w-2 h-2 rounded-full bg-emerald-400"></div> Export as CSV
1355
- </button>
1356
- </div>
1357
- </div>
1358
-
1359
- <button onclick="archiveExpired()" class="p-2.5 text-slate-500 hover:text-amber-600 hover:bg-amber-50 dark:hover:bg-amber-900/20 rounded-xl transition-all active:scale-90" title="Archive expired memories">
1360
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4"></path></svg>
1361
- </button>
1362
- </div>
1363
- </div>
1364
- </div>
1365
- </div>
1366
-
1367
- <div id="errorMessage"></div>
1368
- <div id="tableContainer" class="p-0">
1369
- <div class="text-gray-500 py-12 text-center">Loading memories...</div>
1370
- </div>
1371
-
1372
- <!-- Footer / Pagination -->
1373
- <div class="p-4 border-t border-gray-100 dark:border-gray-700 bg-gray-50/30 dark:bg-gray-900/10 flex flex-col md:flex-row items-center justify-between gap-4">
1374
- <div id="paginationInfo" class="text-xs font-medium text-gray-500 dark:text-gray-400">Showing 0-0 of 0</div>
1375
- <div class="flex items-center gap-2">
1376
- <button id="firstPageBtn" onclick="goToPage(1)" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30 transition-all">First</button>
1377
- <button id="prevPageBtn" onclick="goToPage(currentPage-1)" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30 transition-all">Prev</button>
1378
- <div id="pageIndicator" class="flex items-center gap-1">
1379
- <!-- Dynamic page buttons -->
1380
- </div>
1381
- <button id="nextPageBtn" onclick="goToPage(currentPage+1)" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30 transition-all">Next</button>
1382
- <button id="lastPageBtn" onclick="goToPage(totalPages)" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30 transition-all">Last</button>
1383
- </div>
1384
- <div class="flex items-center gap-2">
1385
- <span class="text-xs font-bold text-gray-400 uppercase tracking-wider">Per page:</span>
1386
- <select id="pageSizeSelect" onchange="changePageSize()" class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-lg text-xs p-1.5 outline-none focus:ring-2 focus:ring-sky-500/50">
1387
- <option value="10">10</option>
1388
- <option value="25">25</option>
1389
- <option value="50">50</option>
1390
- <option value="100">100</option>
1391
- </select>
1392
- </div>
1393
- </div>
1394
- </div>
1395
- </div>
1396
-
1397
- <div id="tasksContent" class="hidden animate-fade-in mt-5">
1398
- <div class="bg-white dark:bg-gray-800 rounded-lg shadow-md p-4 md:p-6 mb-6">
1399
- <div class="flex items-center justify-between mb-6">
1400
- <h2 class="text-xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-sky-600 to-indigo-600 dark:from-sky-400 dark:to-indigo-400">Project Tasks</h2>
1401
- <div class="flex flex-1 max-w-md mx-4">
1402
- <div class="relative w-full group">
1403
- <input type="text" id="taskSearchInput" placeholder="Search tasks..." class="w-full pl-10 pr-4 py-2 bg-slate-50 dark:bg-slate-900/50 border border-slate-200 dark:border-slate-700 rounded-xl text-sm focus:ring-2 focus:ring-indigo-500/50 transition-all outline-none">
1404
- <svg class="w-4 h-4 text-slate-400 absolute left-3.5 top-2.5 group-focus-within:text-indigo-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
1405
- </div>
1406
- </div>
1407
- <div class="flex items-center gap-2">
1408
- <button onclick="exportAllData()" class="btn-refresh bg-amber-500! border-amber-600! shadow-amber-500/20!">
1409
- <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1m-4-8l-4-4m0 0L8 8m4-4v12"></path></svg>
1410
- Export All
1411
- </button>
1412
- <button onclick="showAddTaskModal()" class="btn-add-task">
1413
- <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path></svg>
1414
- Add Task
1415
- </button>
1416
- <button onclick="document.getElementById('csvInput').click()" class="btn-refresh bg-emerald-500! border-emerald-600! shadow-emerald-500/20!">
1417
- <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1m-4-8l-4-4m0 0L8 8m4-4v12"></path></svg>
1418
- Import CSV
1419
- </button>
1420
- <input type="file" id="csvInput" class="hidden" accept=".csv" onchange="handleCsvImport(event)">
1421
- <button onclick="downloadCsvTemplate()" class="p-2 text-gray-500 hover:text-sky-600 rounded-lg" title="Download CSV Template">
1422
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path></svg>
1423
- </button>
1424
- <button onclick="loadTasks()" class="btn-refresh">Refresh Tasks</button>
1425
- </div>
1426
- </div>
1427
-
1428
- <!-- Task Context Stats with Tabs -->
1429
- <div class="mb-8">
1430
- <div class="flex items-center gap-1 p-1 bg-slate-100 dark:bg-slate-900/50 rounded-xl w-fit mb-4">
1431
- <button onclick="updateTimeStats('daily')" id="dailyStatsBtn" class="px-4 py-1.5 rounded-lg text-xs font-bold transition-all bg-white dark:bg-slate-800 shadow-sm text-sky-600 dark:text-sky-400">Daily</button>
1432
- <button onclick="updateTimeStats('weekly')" id="weeklyStatsBtn" class="px-4 py-1.5 rounded-lg text-xs font-bold transition-all text-slate-500 hover:text-slate-700 dark:hover:text-slate-300">Weekly</button>
1433
- <button onclick="updateTimeStats('monthly')" id="monthlyStatsBtn" class="px-4 py-1.5 rounded-lg text-xs font-bold transition-all text-slate-500 hover:text-slate-700 dark:hover:text-slate-300">Monthly</button>
1434
- <button onclick="updateTimeStats('overall')" id="overallStatsBtn" class="px-4 py-1.5 rounded-lg text-xs font-bold transition-all text-slate-500 hover:text-slate-700 dark:hover:text-slate-300">Overall</button>
1435
- </div>
1436
-
1437
- <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
1438
- <div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-xl p-4 flex items-center gap-4 shadow-sm">
1439
- <div class="w-10 h-10 rounded-full bg-emerald-500/10 flex items-center justify-center text-emerald-600">
1440
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
1441
- </div>
1442
- <div>
1443
- <div id="statsPeriodLabel1" class="text-[10px] font-bold text-slate-400 uppercase tracking-widest">Today Completed</div>
1444
- <div id="todayCompletedTasksCount" class="text-xl font-black text-slate-700 dark:text-slate-200">0</div>
1445
- </div>
1446
- </div>
1447
- <div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-xl p-4 flex items-center gap-4 shadow-sm">
1448
- <div class="w-10 h-10 rounded-full bg-indigo-500/10 flex items-center justify-center text-indigo-600">
1449
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path></svg>
1450
- </div>
1451
- <div>
1452
- <div id="statsPeriodLabel2" class="text-[10px] font-bold text-slate-400 uppercase tracking-widest">Today Added</div>
1453
- <div id="todayAddedTasksCount" class="text-xl font-black text-slate-700 dark:text-slate-200">0</div>
1454
- </div>
1455
- </div>
1456
- <div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-xl p-4 flex items-center gap-4 shadow-sm">
1457
- <div class="w-10 h-10 rounded-full bg-amber-500/10 flex items-center justify-center text-amber-600">
1458
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg>
1459
- </div>
1460
- <div>
1461
- <div id="statsPeriodLabel3" class="text-[10px] font-bold text-slate-400 uppercase tracking-widest">Today Tokens</div>
1462
- <div id="todayTokensTasksCount" class="text-xl font-black text-slate-700 dark:text-slate-200">0</div>
1463
- </div>
1464
- </div>
1465
- <div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-xl p-4 flex items-center gap-4 shadow-sm">
1466
- <div class="w-10 h-10 rounded-full bg-sky-500/10 flex items-center justify-center text-sky-600">
1467
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
1468
- </div>
1469
- <div>
1470
- <div id="statsPeriodLabel4" class="text-[10px] font-bold text-slate-400 uppercase tracking-widest">Today Avg Time</div>
1471
- <div id="todayAvgTimeTasksCount" class="text-xl font-black text-slate-700 dark:text-slate-200">0m</div>
1472
- </div>
1473
- </div>
1474
- </div>
1475
- </div>
1476
-
1477
- <div id="taskBoard" class="flex overflow-x-auto pb-6 md:grid md:grid-cols-4 gap-6 snap-x custom-scrollbar">
1478
- <!-- Column: Backlog -->
1479
- <div class="flex flex-col gap-4 flex-shrink-0 w-[85vw] md:w-auto snap-center">
1480
- <div class="flex items-center justify-between px-2">
1481
- <h3 class="font-bold text-slate-400 uppercase tracking-wider text-xs">Backlog</h3>
1482
- <span id="backlogCount" class="bg-slate-100 dark:bg-slate-800 text-slate-500 dark:text-slate-400 px-2 py-0.5 rounded-full text-[10px] font-bold">0</span>
1483
- </div>
1484
- <div id="backlogTasks" class="space-y-4 min-h-[200px] max-h-[70vh] overflow-y-auto pr-2 custom-scrollbar"></div>
1485
- </div>
1486
- <!-- Column: Todo -->
1487
- <div class="flex flex-col gap-4 flex-shrink-0 w-[85vw] md:w-auto snap-center">
1488
- <div class="flex items-center justify-between px-2">
1489
- <h3 class="font-bold text-gray-500 uppercase tracking-wider text-xs">To Do</h3>
1490
- <span id="todoCount" class="bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400 px-2 py-0.5 rounded-full text-[10px] font-bold">0</span>
1491
- </div>
1492
- <div id="todoTasks" class="space-y-4 min-h-[200px] max-h-[70vh] overflow-y-auto pr-2 custom-scrollbar"></div>
1493
- </div>
1494
- <!-- Column: In Progress -->
1495
- <div class="flex flex-col gap-4 flex-shrink-0 w-[85vw] md:w-auto snap-center">
1496
- <div class="flex items-center justify-between px-2">
1497
- <h3 class="font-bold text-sky-500 uppercase tracking-wider text-xs">In Progress</h3>
1498
- <span id="inProgressCount" class="bg-sky-100 dark:bg-sky-900/40 text-sky-600 dark:text-sky-400 px-2 py-0.5 rounded-full text-[10px] font-bold">0</span>
1499
- </div>
1500
- <div id="inProgressTasks" class="space-y-4 min-h-[200px] max-h-[70vh] overflow-y-auto pr-2 custom-scrollbar"></div>
1501
- </div>
1502
- <!-- Column: Completed -->
1503
- <div class="flex flex-col gap-4 flex-shrink-0 w-[85vw] md:w-auto snap-center">
1504
- <div class="flex items-center justify-between px-2">
1505
- <h3 class="font-bold text-emerald-500 uppercase tracking-wider text-xs">Completed</h3>
1506
- <span id="completedCount" class="bg-emerald-100 dark:bg-emerald-900/40 text-emerald-600 dark:text-emerald-400 px-2 py-0.5 rounded-full text-[10px] font-bold">0</span>
1507
- </div>
1508
- <div id="completedTasks" class="space-y-4 min-h-[200px] max-h-[70vh] overflow-y-auto pr-2 custom-scrollbar"></div>
1509
- </div>
1510
- </div>
1511
- </div>
1512
- </div>
1513
-
1514
- <div id="referenceContent" class="hidden animate-fade-in mt-5">
1515
- <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
1516
- <!-- Tools -->
1517
- <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden flex flex-col">
1518
- <div class="p-4 border-b border-gray-100 dark:border-gray-700 bg-gray-50/50 dark:bg-gray-900/20 flex items-center gap-3">
1519
- <div class="w-8 h-8 rounded-lg bg-sky-500/10 flex items-center justify-center text-sky-600">
1520
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 4a2 2 0 114 0v1a1 1 0 001 1h3a1 1 0 011 1v3a1 1 0 01-1 1h-1a2 2 0 100 4h1a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-1a2 2 0 10-4 0v1a1 1 0 01-1 1H7a1 1 0 01-1-1v-3a1 1 0 00-1-1H4a2 2 0 110-4h1a1 1 0 001-1V7a1 1 0 011-1h3a1 1 0 001-1V4z"></path></svg>
1521
- </div>
1522
- <h3 class="font-bold text-sm uppercase tracking-wider">Available Tools</h3>
1523
- </div>
1524
- <div id="toolsList" class="p-4 space-y-3 flex-1 overflow-y-auto max-h-[70vh]"></div>
1525
- </div>
1526
-
1527
- <!-- Resources -->
1528
- <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden flex flex-col">
1529
- <div class="p-4 border-b border-gray-100 dark:border-gray-700 bg-gray-50/50 dark:bg-gray-900/20 flex items-center gap-3">
1530
- <div class="w-8 h-8 rounded-lg bg-indigo-500/10 flex items-center justify-center text-indigo-600">
1531
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path></svg>
1532
- </div>
1533
- <h3 class="font-bold text-sm uppercase tracking-wider">Resources</h3>
1534
- </div>
1535
- <div id="resourcesList" class="p-4 space-y-3 flex-1 overflow-y-auto max-h-[70vh]"></div>
1536
- </div>
1537
-
1538
- <!-- Prompts -->
1539
- <div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden flex flex-col">
1540
- <div class="p-4 border-b border-gray-100 dark:border-gray-700 bg-gray-50/50 dark:bg-gray-900/20 flex items-center gap-3">
1541
- <div class="w-8 h-8 rounded-lg bg-emerald-500/10 flex items-center justify-center text-emerald-600">
1542
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"></path></svg>
1543
- </div>
1544
- <h3 class="font-bold text-sm uppercase tracking-wider">Prompts</h3>
1545
- </div>
1546
- <div id="promptsList" class="p-4 space-y-3 flex-1 overflow-y-auto max-h-[70vh]"></div>
1547
- </div>
1548
- </div>
1549
- </div>
1550
- </div>
1551
- </main>
1552
- </div>
1553
-
1554
- <!-- Floating Selection Bar -->
1555
- <div id="bulkActionBar" class="fixed bottom-8 left-1/2 transform -translate-x-1/2 z-50 bg-slate-900/90 dark:bg-white/90 backdrop-blur-md text-white dark:text-slate-900 px-6 py-4 rounded-2xl shadow-2xl border border-white/10 dark:border-slate-200 hidden flex items-center gap-6 animate-fade-in">
1556
- <div class="flex flex-col">
1557
- <span id="selectedCount" class="text-sm font-bold">0 selected</span>
1558
- <span class="text-[10px] uppercase tracking-widest text-slate-400 dark:text-slate-500">Bulk Actions</span>
1559
- </div>
1560
- <div class="h-8 w-[1px] bg-white/10 dark:bg-slate-200"></div>
1561
- <div class="flex items-center gap-3">
1562
- <span class="text-xs font-bold text-slate-400 dark:text-slate-500 uppercase">Set Priority:</span>
1563
- <select id="bulkImportanceSelect" class="bg-white/10 dark:bg-slate-100 border border-white/20 dark:border-slate-300 rounded-lg text-xs p-1.5 outline-none focus:ring-2 focus:ring-sky-500/50">
1564
- <option value="1">1 (Minor)</option>
1565
- <option value="2">2 (Low)</option>
1566
- <option value="3">3 (Medium)</option>
1567
- <option value="4">4 (High)</option>
1568
- <option value="5">5 (Critical)</option>
1569
- </select>
1570
- <button onclick="bulkUpdateImportance()" class="px-4 py-2 bg-sky-500 hover:bg-sky-600 text-white rounded-lg text-xs font-bold transition-all shadow-lg shadow-sky-500/20">Apply</button>
1571
- </div>
1572
- <div class="h-8 w-[1px] bg-white/10 dark:bg-slate-200"></div>
1573
- <button onclick="showBulkDeleteConfirm()" class="px-4 py-2 bg-rose-500 hover:bg-rose-600 text-white rounded-lg text-xs font-bold transition-all shadow-lg shadow-rose-500/20">Delete</button>
1574
- <button onclick="clearSelection()" class="px-4 py-2 bg-white/10 dark:bg-slate-200 hover:bg-white/20 dark:hover:bg-slate-300 text-white dark:text-slate-900 rounded-lg text-xs font-bold transition-all">Clear</button>
1575
- </div>
1576
-
1577
-
1578
- <!-- Toast Container -->
1579
- <div id="toastContainer" class="fixed top-24 right-6 z-[60] flex flex-col gap-3 pointer-events-none"></div>
1580
-
1581
- <!-- Mobile Repo Sidebar Drawer -->
1582
- <div id="repoSidebarDrawer" class="hidden fixed inset-0 z-50">
1583
- <div class="absolute inset-0 bg-slate-950/40 backdrop-blur-sm transition-opacity" onclick="closeRepoSidebarDrawer()"></div>
1584
- <aside class="absolute left-0 top-0 h-full w-full max-w-[280px] bg-white dark:bg-slate-900 shadow-2xl border-r border-slate-200 dark:border-slate-800 flex flex-col transform transition-transform duration-300">
1585
- <div class="p-6 border-b border-slate-100 dark:border-slate-800 flex items-center justify-between">
1586
- <div class="flex items-center gap-3">
1587
- <div class="w-8 h-8 rounded-lg bg-gradient-to-tr from-sky-500 to-indigo-600 flex items-center justify-center">
1588
- <svg class="w-5 h-5 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path></svg>
1589
- </div>
1590
- <span class="font-bold text-lg">Contexts</span>
1591
- </div>
1592
- <button onclick="closeRepoSidebarDrawer()" class="p-2 hover:bg-slate-100 dark:hover:bg-slate-800 rounded-lg">
1593
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
1594
- </button>
1595
- </div>
1596
- <div class="px-4 py-4">
1597
- <div class="relative group">
1598
- <input type="text" id="repoSearchInputMobile" placeholder="Search repositories..." class="w-full pl-10 pr-4 py-2.5 bg-slate-100 dark:bg-slate-800/50 border-none rounded-xl text-sm focus:ring-2 focus:ring-sky-500/50 transition-all outline-none">
1599
- <svg class="w-4 h-4 text-slate-400 absolute left-3.5 top-3 group-focus-within:text-sky-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
1600
- </div>
1601
- </div>
1602
- <div id="repoSidebarListMobile" class="flex-1 overflow-y-auto px-3 space-y-1 pb-10">
1603
- <!-- Mobile repo list items -->
1604
- </div>
1605
- </aside>
1606
- </div>
1607
-
1608
- <!-- Detail Drawer -->
1609
- <div id="memoryDrawer" class="hidden fixed inset-0 z-50 overflow-hidden">
1610
- <div class="absolute inset-0 bg-slate-950/40 backdrop-blur-sm transition-opacity" onclick="closeDrawer()"></div>
1611
- <aside class="absolute right-0 top-0 h-full w-full lg:w-1/2 bg-white dark:bg-slate-900 shadow-[-20px_0_50px_rgba(0,0,0,0.15)] border-l border-slate-200 dark:border-white/5 flex flex-col transform transition-transform duration-500 ease-[cubic-bezier(0.34,1.56,0.64,1)] translate-x-full" id="drawerAside">
1612
- <div class="p-6 border-b border-slate-100 dark:border-slate-800 flex items-center justify-between bg-white dark:bg-slate-900">
1613
- <div class="flex items-center gap-4">
1614
- <button onclick="closeDrawer()" class="p-2.5 hover:bg-slate-100 dark:hover:bg-slate-800 rounded-xl transition-all active:scale-95">
1615
- <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
1616
- </button>
1617
- <h2 id="drawerTitle" class="text-2xl font-black tracking-tight truncate max-w-md bg-clip-text text-transparent bg-gradient-to-r from-slate-900 to-slate-600 dark:from-white dark:to-slate-400">Memory Detail</h2>
1618
- </div>
1619
- <div class="flex items-center gap-3">
1620
- <button onclick="exportHandbook()" class="px-4 py-2 bg-sky-500 hover:bg-sky-600 text-white text-xs font-bold uppercase tracking-widest rounded-lg transition-all shadow-lg shadow-sky-500/20 flex items-center gap-2">
1621
- <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path></svg>
1622
- Handbook
1623
- </button>
1624
- </div>
1625
- </div>
1626
- <div id="drawerBody" class="flex-1 overflow-y-auto p-8 lg:p-12 custom-scrollbar">
1627
- <!-- Content injected via JS -->
1628
- </div>
1629
- </aside>
1630
- </div>
1631
-
1632
- <!-- Add Memory Modal -->
1633
- <div id="addMemoryModal" class="hidden fixed inset-0 z-[100] flex items-center justify-center p-4">
1634
- <div class="absolute inset-0 bg-slate-950/60 backdrop-blur-md" onclick="hideAddMemoryModal()"></div>
1635
- <div class="relative bg-white dark:bg-slate-900 w-full max-w-xl rounded-2xl shadow-2xl border border-slate-200 dark:border-slate-800 overflow-hidden animate-fade-in">
1636
- <div class="p-6 border-b border-slate-100 dark:border-slate-800 flex items-center justify-between">
1637
- <h3 class="text-xl font-bold">Add New Memory</h3>
1638
- <button onclick="hideAddMemoryModal()" class="p-2 hover:bg-slate-100 dark:hover:bg-slate-800 rounded-lg">
1639
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
1640
- </button>
1641
- </div>
1642
- <form id="addMemoryForm" onsubmit="handleMemorySubmit(event)" class="p-6 space-y-4">
1643
- <div class="grid grid-cols-2 gap-4">
1644
- <div>
1645
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Type</label>
1646
- <select name="type" required class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1647
- <option value="code_fact">Code Fact</option>
1648
- <option value="decision">Decision</option>
1649
- <option value="mistake">Mistake</option>
1650
- <option value="pattern">Pattern</option>
1651
- </select>
1652
- </div>
1653
- <div>
1654
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Importance</label>
1655
- <select name="importance" required class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1656
- <option value="1">1 (Minor)</option>
1657
- <option value="2">2 (Low)</option>
1658
- <option value="3" selected>3 (Medium)</option>
1659
- <option value="4">4 (High)</option>
1660
- <option value="5">5 (Critical)</option>
1661
- </select>
1662
- </div>
1663
- </div>
1664
- <div class="grid grid-cols-3 gap-4">
1665
- <div>
1666
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Agent</label>
1667
- <input type="text" name="agent" required placeholder="e.g. Gemini CLI" value="Manual User" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1668
- </div>
1669
- <div>
1670
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Role</label>
1671
- <input type="text" name="role" required placeholder="e.g. architect" value="user" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1672
- </div>
1673
- <div>
1674
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Model</label>
1675
- <input type="text" name="model" required placeholder="e.g. gemini-2.0-flash" value="Human" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1676
- </div>
1677
- </div>
1678
- <div>
1679
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Title</label>
1680
- <input type="text" name="title" placeholder="Short descriptive title" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1681
- </div>
1682
- <div>
1683
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Content</label>
1684
- <textarea name="content" required rows="4" placeholder="What should be remembered?" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50 resize-none"></textarea>
1685
- </div>
1686
- <div>
1687
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Tags (comma separated)</label>
1688
- <input type="text" name="tags" placeholder="react, hooks, performance" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1689
- </div>
1690
- <div class="flex items-center gap-2">
1691
- <input type="checkbox" name="is_global" id="is_global_check" class="w-4 h-4 rounded border-slate-300 text-sky-600 focus:ring-sky-500">
1692
- <label for="is_global_check" class="text-sm text-slate-600 dark:text-slate-400">Mark as global (available in all repos)</label>
1693
- </div>
1694
- <div class="pt-4 flex gap-3">
1695
- <button type="button" onclick="hideAddMemoryModal()" class="flex-1 px-6 py-3 bg-slate-100 dark:bg-slate-800 text-slate-600 dark:text-slate-300 font-bold rounded-xl hover:bg-slate-200 dark:hover:bg-slate-700 transition-all">Cancel</button>
1696
- <button type="submit" class="flex-1 px-6 py-3 bg-sky-500 hover:bg-sky-600 text-white font-bold rounded-xl shadow-lg shadow-sky-500/20 transition-all">Save Memory</button>
1697
- </div>
1698
- </form>
1699
- </div>
1700
- </div>
1701
-
1702
- <!-- Add Task Modal -->
1703
- <div id="addTaskModal" class="hidden fixed inset-0 z-[100] flex items-center justify-center p-4">
1704
- <div class="absolute inset-0 bg-slate-950/60 backdrop-blur-md" onclick="hideAddTaskModal()"></div>
1705
- <div class="relative bg-white dark:bg-slate-900 w-full max-w-xl rounded-2xl shadow-2xl border border-slate-200 dark:border-slate-800 overflow-hidden animate-fade-in">
1706
- <div class="p-6 border-b border-slate-100 dark:border-slate-800 flex items-center justify-between">
1707
- <h3 class="text-xl font-bold">Create New Task</h3>
1708
- <button onclick="hideAddTaskModal()" class="p-2 hover:bg-slate-100 dark:hover:bg-slate-800 rounded-lg">
1709
- <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
1710
- </button>
1711
- </div>
1712
- <form id="addTaskForm" onsubmit="handleTaskSubmit(event)" class="p-6 space-y-4">
1713
- <div class="grid grid-cols-2 gap-4">
1714
- <div>
1715
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Task Code</label>
1716
- <input type="text" name="task_code" required placeholder="e.g. TASK-001" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1717
- </div>
1718
- <div>
1719
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Phase</label>
1720
- <input type="text" name="phase" required placeholder="e.g. implementation" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1721
- </div>
1722
- </div>
1723
- <div class="grid grid-cols-2 gap-4">
1724
- <div>
1725
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Agent</label>
1726
- <input type="text" name="agent" required placeholder="e.g. GitHub Copilot" value="Gemini CLI" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1727
- </div>
1728
- <div>
1729
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Role</label>
1730
- <input type="text" name="role" required placeholder="e.g. fullstack" value="expert" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1731
- </div>
1732
- </div>
1733
- <div>
1734
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Title</label>
1735
- <input type="text" name="title" required placeholder="Task headline" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1736
- </div>
1737
- <div>
1738
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Description</label>
1739
- <textarea name="description" rows="3" placeholder="Detailed task description" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50"></textarea>
1740
- </div>
1741
- <div>
1742
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Documentation Path / URL</label>
1743
- <input type="text" name="doc_path" placeholder="e.g. docs/setup.md or https://docs.example.com" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1744
- </div>
1745
- <div class="grid grid-cols-2 gap-4">
1746
- <div>
1747
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Priority</label>
1748
- <select name="priority" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1749
- <option value="1">1 (Minor)</option>
1750
- <option value="2">2 (Low)</option>
1751
- <option value="3" selected>3 (Medium)</option>
1752
- <option value="4">4 (High)</option>
1753
- <option value="5">5 (Critical)</option>
1754
- </select>
1755
- </div>
1756
- <div>
1757
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Status</label>
1758
- <select name="status" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1759
- <option value="backlog" selected>Backlog</option>
1760
- <option value="pending">To Do</option>
1761
- </select>
1762
- </div>
1763
- </div>
1764
- <div>
1765
- <label class="block text-xs font-bold text-slate-400 uppercase mb-1">Depends On (ID)</label>
1766
- <input type="text" name="depends_on" placeholder="Optional parent task ID" class="w-full bg-slate-50 dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl px-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-sky-500/50">
1767
- </div>
1768
- <div class="pt-4 flex gap-3">
1769
- <button type="button" onclick="hideAddTaskModal()" class="flex-1 px-6 py-3 bg-slate-100 dark:bg-slate-800 text-slate-600 dark:text-slate-300 font-bold rounded-xl hover:bg-slate-200 dark:hover:bg-slate-700 transition-all">Cancel</button>
1770
- <button type="submit" class="flex-1 px-6 py-3 bg-indigo-500 hover:bg-indigo-600 text-white font-bold rounded-xl shadow-lg shadow-indigo-500/20 transition-all">Create Task</button>
1771
- </div>
1772
- </form>
1773
- </div>
1774
- </div>
1775
-
1776
- <script src="/app.js"></script>
14
+ <body>
15
+ <div id="app"></div>
1777
16
  </body>
1778
17
  </html>