Add our first view via Next.js for Agents (#817)

Initialize our migration to use Next.js for front-end views via Agents. This includes setup for getting authenticated users, reading in available agents, setting up a pop-up modal when you're clicking on an agent, and allowing users to start new conversations with agents.

Best attempt at an in-place migration, though there are some noticeable differences.

Also adds view for chat that are not being used, but in experimental phase.

src/interface/web/app/components/sidePanel/sidePanel.module.css

@@ -0,0 +1,98 @@
+div.session {
+    padding: 0.5rem;
+    margin-bottom: 0.25rem;
+    border-radius: 0.5rem;
+    color: var(--main-text-color);
+    cursor: pointer;
+    max-width: 14rem;
+}
+
+button.button {
+    border: none;
+    outline: none;
+    background-color: transparent;
+    cursor: pointer;
+    color: var(--main-text-color);
+    width: 24px;
+}
+
+button.showMoreButton {
+    background: var(--intense-green);
+    border: none;
+    color: var(--frosted-background-color);
+    border-radius: 0.5rem;
+    padding: 8px;
+}
+
+div.panel {
+    display: grid;
+    grid-auto-flow: row;
+    padding: 1rem;
+    border-radius: 1rem;
+    background-color: var(--calm-blue);
+    color: var(--main-text-color);
+    height: 100%;
+    overflow-y: auto;
+    max-width: auto;
+}
+
+div.expanded {
+    display: grid;
+    grid-template-columns: 1fr auto;
+    gap: 1rem;
+}
+
+div.collapsed {
+    display: grid;
+    grid-template-columns: 1fr;
+}
+
+div.session:hover {
+    background-color: var(--calmer-blue);
+}
+
+p.session {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+}
+
+div.header {
+    display: grid;
+    grid-template-columns: 1fr auto;
+}
+
+img.profile {
+    width: 24px;
+    height: 24px;
+    border-radius: 50%;
+}
+
+
+div.modalSessionsList {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: var(--frosted-background-color);
+    z-index: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    backdrop-filter: blur(2px);
+}
+
+div.modalSessionsList div.content {
+    max-width: 80%;
+    max-height: 80%;
+    background-color: var(--frosted-background-color);
+    overflow: auto;
+    padding: 20px;
+    border-radius: 10px;
+}
+
+div.modalSessionsList div.session {
+    max-width: 100%;
+    text-overflow: ellipsis;
+}