agent-starter-pack 0.3.3__py3-none-any.whl → 0.21.0__py3-none-any.whl

src/frontends/live_api_react/frontend/src/components/side-panel/SidePanel.tsx

@@ -1,161 +0,0 @@
-/**
- * Copyright 2024 Google LLC
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import cn from "classnames";
-import { useEffect, useRef, useState } from "react";
-import { RiSidebarFoldLine, RiSidebarUnfoldLine } from "react-icons/ri";
-import Select from "react-select";
-import { useLiveAPIContext } from "../../contexts/LiveAPIContext";
-import { useLoggerStore } from "../../utils/store-logger";
-import Logger, { LoggerFilterType } from "../logger/Logger";
-import "./side-panel.scss";
-
-const filterOptions = [
-  { value: "conversations", label: "Conversations" },
-  { value: "tools", label: "Tool Use" },
-  { value: "none", label: "All" },
-];
-
-export default function SidePanel() {
-  const { connected, client } = useLiveAPIContext();
-  const [open, setOpen] = useState(true);
-  const loggerRef = useRef<HTMLDivElement>(null);
-  const loggerLastHeightRef = useRef<number>(-1);
-  const { log, logs } = useLoggerStore();
-
-  const [textInput, setTextInput] = useState("");
-  const [selectedOption, setSelectedOption] = useState<{
-    value: string;
-    label: string;
-  } | null>(null);
-  const inputRef = useRef<HTMLTextAreaElement>(null);
-
-  //scroll the log to the bottom when new logs come in
-  useEffect(() => {
-    if (loggerRef.current) {
-      const el = loggerRef.current;
-      const scrollHeight = el.scrollHeight;
-      if (scrollHeight !== loggerLastHeightRef.current) {
-        el.scrollTop = scrollHeight;
-        loggerLastHeightRef.current = scrollHeight;
-      }
-    }
-  }, [logs]);
-
-  // listen for log events and store them
-  useEffect(() => {
-    client.on("log", log);
-    return () => {
-      client.off("log", log);
-    };
-  }, [client, log]);
-
-  const handleSubmit = () => {
-    client.send([{ text: textInput }]);
-
-    setTextInput("");
-    if (inputRef.current) {
-      inputRef.current.innerText = "";
-    }
-  };
-
-  return (
-    <div className={`side-panel ${open ? "open" : ""}`}>
-      <header className="top">
-        <h2>Console</h2>
-        {open ? (
-          <button className="opener" onClick={() => setOpen(false)}>
-            <RiSidebarFoldLine color="#b4b8bb" />
-          </button>
-        ) : (
-          <button className="opener" onClick={() => setOpen(true)}>
-            <RiSidebarUnfoldLine color="#b4b8bb" />
-          </button>
-        )}
-      </header>
-      <section className="indicators">
-        <Select
-          className="react-select"
-          classNamePrefix="react-select"
-          styles={{
-            control: (baseStyles) => ({
-              ...baseStyles,
-              background: "var(--Neutral-15)",
-              color: "var(--Neutral-90)",
-              minHeight: "33px",
-              maxHeight: "33px",
-              border: 0,
-            }),
-            option: (styles, { isFocused, isSelected }) => ({
-              ...styles,
-              backgroundColor: isFocused
-                ? "var(--Neutral-30)"
-                : isSelected
-                  ? "var(--Neutral-20)"
-                  : undefined,
-            }),
-          }}
-          defaultValue={selectedOption}
-          options={filterOptions}
-          onChange={(e) => {
-            setSelectedOption(e);
-          }}
-        />
-        <div className={cn("streaming-indicator", { connected })}>
-          {connected
-            ? `🔵${open ? " Streaming" : ""}`
-            : `⏸️${open ? " Paused" : ""}`}
-        </div>
-      </section>
-      <div className="side-panel-container" ref={loggerRef}>
-        <Logger
-          filter={(selectedOption?.value as LoggerFilterType) || "none"}
-        />
-      </div>
-      <div className={cn("input-container", { disabled: !connected })}>
-        <div className="input-content">
-          <textarea
-            className="input-area"
-            ref={inputRef}
-            onKeyDown={(e) => {
-              if (e.key === "Enter" && !e.shiftKey) {
-                e.preventDefault();
-                e.stopPropagation();
-                handleSubmit();
-              }
-            }}
-            onChange={(e) => setTextInput(e.target.value)}
-            value={textInput}
-          ></textarea>
-          <span
-            className={cn("input-content-placeholder", {
-              hidden: textInput.length,
-            })}
-          >
-            Type&nbsp;something...
-          </span>
-
-          <button
-            className="send-button material-symbols-outlined filled"
-            onClick={handleSubmit}
-          >
-            send
-          </button>
-        </div>
-      </div>
-    </div>
-  );
-}

src/frontends/live_api_react/frontend/src/components/side-panel/side-panel.scss

@@ -1,285 +0,0 @@
-/**
- * Copyright 2025 Google LLC
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/* stylelint-disable */
-.side-panel {
-  .react-select {
-    background: var(--Neutral-20);
-    color: var(--Neutral-90);
-    width: 193px;
-    height: 30px;
-
-    .react-select__single-value {
-      color: var(--Neutral-90);
-    }
-
-    .react-select__menu {
-      background: var(--Neutral-20);
-      color: var(--Neutral-90);
-    }
-
-    .react-select__option {
-    }
-    .react-select__value-container {
-    }
-    .react-select__indicators {
-    }
-    .react-select__option:hover,
-    .react-select__option:focus,
-    .react-select_option:focus-within {
-      background: var(--Neutral-30);
-    }
-    .react-select__option--is-focused: {
-      background: var(--Neutral-30);
-    }
-  }
-  background: var(--Neutral-00);
-  width: 40px; /* when closed */
-  display: flex;
-  flex-direction: column;
-  height: 100vh;
-  transition: all 0.2s ease-in;
-  font-family: Arial, sans-serif;
-  border-right: 1px solid var(--gray-600);
-  color: var(--Neutral-90, #e1e2e3);
-  font-family: var(--font-family);
-  font-size: 13px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 160%; /* 20.8px */
-
-  .hidden {
-    display: none !important;
-  }
-
-  &.open {
-    .top {
-      h2 {
-        left: 0%;
-        display: block;
-        opacity: 1;
-      }
-    }
-  }
-
-  .top {
-    display: flex;
-    width: calc(100% - 45px);
-    justify-content: space-between;
-    align-items: center;
-    padding: 12px 20px 12px 25px;
-    border-bottom: 1px solid var(--Neutral-20);
-
-    h2 {
-      position: relative;
-      color: var(--Neutral-90, #e1e2e3);
-      font-family: "Google Sans";
-      font-size: 21px;
-      font-style: normal;
-      font-weight: 500;
-      line-height: 16px; /* 100% */
-
-      opacity: 0;
-      display: none;
-      left: -100%;
-      transition:
-        opacity 0.2s ease-in,
-        left 0.2s ease-in,
-        display 0.2s ease-in;
-      transition-behavior: allow-discrete;
-
-      @starting-style {
-        left: 0%;
-        opacity: 1;
-      }
-    }
-  }
-
-  .opener {
-    height: 30px;
-    transition: transform 0.2s ease-in;
-  }
-
-  &:not(.open) {
-    .side-panel-container {
-      opacity: 0;
-      display: none;
-      transition: all 0.2s ease-in allow-discrete;
-      transition-delay: 0.1s;
-    }
-
-    .indicators .streaming-indicator {
-      width: 30px;
-      opacity: 0;
-    }
-
-    .opener {
-      transform: translate(-50%, 0);
-    }
-
-    .input-container {
-      opacity: 0;
-      display: none;
-      transition: all 0.2s ease-in allow-discrete;
-    }
-  }
-
-  .indicators {
-    display: flex;
-    padding: 24px 25px;
-    justify-content: flex-end;
-    gap: 21px;
-    .streaming-indicator {
-      user-select: none;
-      border-radius: 4px;
-      border: 1px solid var(--Neutral-20, #2a2f31);
-      background: var(--Neutral-10, #1c1f21);
-      display: flex;
-      width: 136px;
-      height: 30px;
-      padding-left: 4px;
-      justify-content: center;
-      align-items: center;
-      gap: 6px;
-      flex-shrink: 0;
-      text-align: center;
-      font-family: "Space Mono";
-      font-size: 14px;
-      font-style: normal;
-      font-weight: 400;
-      line-height: normal;
-      transition: width 0.2s ease-in;
-
-      &.connected {
-        color: var(--Blue-500, #0d9c53);
-      }
-    }
-  }
-
-  .side-panel-container {
-    align-self: flex-end;
-    width: 400px;
-    flex-grow: 1;
-    overflow-x: hidden;
-    overflow-y: auto;
-    /*scrollbar-gutter: stable both-edges;*/
-  }
-
-  .input-container {
-    height: 50px;
-    flex-grow: 0;
-    flex-shrink: 0;
-    border-top: 1px solid var(--Neutral-20);
-    padding: 14px 25px;
-    overflow: hidden;
-
-    .input-content {
-      position: relative;
-      background: var(--Neutral-10);
-      border: 1px solid var(--Neutral-15);
-      height: 22px;
-      border-radius: 10px;
-      padding: 11px 18px;
-
-      .send-button {
-        position: absolute;
-        top: 50%;
-        right: 0;
-        transform: translate(0, -50%);
-        background: none;
-        border: 0;
-        color: var(--Neutral-20);
-        cursor: pointer;
-        transition: color 0.1s ease-in;
-        z-index: 2;
-
-        &:hover {
-          color: var(--Neutral-60);
-        }
-      }
-
-      .input-area {
-        background: none;
-        color: var(--Neutral-90);
-        field-sizing: content;
-        position: absolute;
-        top: 0;
-        left: 0;
-        z-index: 2;
-        display: inline-block;
-        width: calc(100% - 72px);
-        max-height: 20px;
-        outline: none;
-        --webkit-box-flex: 1;
-        flex: 1;
-        word-break: break-word;
-        overflow: auto;
-        padding: 14px 18px;
-        border: 0;
-        resize: none;
-      }
-
-      .input-content-placeholder {
-        position: absolute;
-        left: 0;
-        top: 0;
-        display: flex;
-        align-items: center;
-        z-index: 1;
-        height: 100%;
-        width: 100%;
-        pointer-events: none;
-        user-select: none;
-        padding: 0px 18px;
-        white-space: pre-wrap;
-      }
-    }
-  }
-}
-.side-panel.open {
-  width: 400px;
-  height: 100vh;
-}
-
-.side-panel-responses,
-.side-panel-requests {
-  flex-grow: 1;
-  flex-shrink: 1;
-  overflow-x: hidden;
-  overflow-y: auto;
-  width: 100%;
-  display: block;
-  margin-left: 8px;
-}
-
-.top {
-  width: 100%;
-  flex-grow: 0;
-  flex-shrink: 0;
-  height: 30px;
-  display: flex;
-  align-self: flex-end;
-  align-items: center;
-  transition: all 0.2s ease-in;
-}
-.top button {
-  background: transparent;
-  border: 0;
-  cursor: pointer;
-  font-size: 1.25rem;
-  line-height: 1.75rem;
-  padding: 4px;
-}

src/frontends/streamlit/frontend/side_bar.py

@@ -1,214 +0,0 @@
-# Copyright 2025 Google LLC
-#
-# Licensed under the Apache License, Version 2.0 (the "License");
-# you may not use this file except in compliance with the License.
-# You may obtain a copy of the License at
-#
-#     http://www.apache.org/licenses/LICENSE-2.0
-#
-# Unless required by applicable law or agreed to in writing, software
-# distributed under the License is distributed on an "AS IS" BASIS,
-# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-# See the License for the specific language governing permissions and
-# limitations under the License.
-
-# ruff: noqa: RUF015
-import json
-import os
-import uuid
-from typing import Any
-
-from frontend.utils.chat_utils import save_chat
-from frontend.utils.multimodal_utils import (
-    HELP_GCS_CHECKBOX,
-    HELP_MESSAGE_MULTIMODALITY,
-    upload_files_to_gcs,
-)
-
-EMPTY_CHAT_NAME = "Empty chat"
-NUM_CHAT_IN_RECENT = 3
-DEFAULT_BASE_URL = "http://localhost:8000/"
-
-DEFAULT_REMOTE_AGENT_ENGINE_ID = "N/A"
-if os.path.exists("deployment_metadata.json"):
-    with open("deployment_metadata.json") as f:
-        DEFAULT_REMOTE_AGENT_ENGINE_ID = json.load(f)["remote_agent_engine_id"]
-DEFAULT_AGENT_CALLABLE_PATH = "app.agent_engine_app.AgentEngineApp"
-
-
-class SideBar:
-    """Manages the sidebar components of the Streamlit application."""
-
-    def __init__(self, st: Any) -> None:
-        """
-        Initialize the SideBar.
-
-        Args:
-            st (Any): The Streamlit object for rendering UI components.
-        """
-        self.st = st
-
-    def init_side_bar(self) -> None:
-        """Initialize and render the sidebar components."""
-        with self.st.sidebar:
-            default_agent_type = (
-                "Remote URL" if os.path.exists("Dockerfile") else "Local Agent"
-            )
-            use_agent_path = self.st.selectbox(
-                "Select Agent Type",
-                ["Local Agent", "Remote Agent Engine ID", "Remote URL"],
-                index=["Local Agent", "Remote Agent Engine ID", "Remote URL"].index(
-                    default_agent_type
-                ),
-                help="'Local Agent' uses a local implementation, 'Remote Agent Engine ID' connects to a deployed Vertex AI agent, and 'Remote URL' connects to a custom endpoint.",
-            )
-
-            if use_agent_path == "Local Agent":
-                self.agent_callable_path = self.st.text_input(
-                    label="Agent Callable Path",
-                    value=os.environ.get(
-                        "AGENT_CALLABLE_PATH", DEFAULT_AGENT_CALLABLE_PATH
-                    ),
-                )
-                self.remote_agent_engine_id = None
-                self.url_input_field = None
-                self.should_authenticate_request = False
-            elif use_agent_path == "Remote Agent Engine ID":
-                self.remote_agent_engine_id = self.st.text_input(
-                    label="Remote Agent Engine ID",
-                    value=os.environ.get(
-                        "REMOTE_AGENT_ENGINE_ID", DEFAULT_REMOTE_AGENT_ENGINE_ID
-                    ),
-                )
-                self.agent_callable_path = None
-                self.url_input_field = None
-                self.should_authenticate_request = False
-            else:
-                self.url_input_field = self.st.text_input(
-                    label="Service URL",
-                    value=os.environ.get("SERVICE_URL", DEFAULT_BASE_URL),
-                )
-                self.should_authenticate_request = self.st.checkbox(
-                    label="Authenticate request",
-                    value=False,
-                    help="If checked, any request to the server will contain an"
-                    "Identity token to allow authentication. "
-                    "See the Cloud Run documentation to know more about authentication:"
-                    "https://cloud.google.com/run/docs/authenticating/service-to-service",
-                )
-                self.agent_callable_path = None
-                self.remote_agent_engine_id = None
-
-            col1, col2, col3 = self.st.columns(3)
-            with col1:
-                if self.st.button("+ New chat"):
-                    if (
-                        len(
-                            self.st.session_state.user_chats[
-                                self.st.session_state["session_id"]
-                            ]["messages"]
-                        )
-                        > 0
-                    ):
-                        self.st.session_state.run_id = None
-
-                        self.st.session_state["session_id"] = str(uuid.uuid4())
-                        self.st.session_state.session_db.get_session(
-                            session_id=self.st.session_state["session_id"],
-                        )
-                        self.st.session_state.user_chats[
-                            self.st.session_state["session_id"]
-                        ] = {
-                            "title": EMPTY_CHAT_NAME,
-                            "messages": [],
-                        }
-
-            with col2:
-                if self.st.button("Delete chat"):
-                    self.st.session_state.run_id = None
-                    self.st.session_state.session_db.clear()
-                    self.st.session_state.user_chats.pop(
-                        self.st.session_state["session_id"]
-                    )
-                    if len(self.st.session_state.user_chats) > 0:
-                        chat_id = list(self.st.session_state.user_chats.keys())[0]
-                        self.st.session_state["session_id"] = chat_id
-                        self.st.session_state.session_db.get_session(
-                            session_id=self.st.session_state["session_id"],
-                        )
-                    else:
-                        self.st.session_state["session_id"] = str(uuid.uuid4())
-                        self.st.session_state.user_chats[
-                            self.st.session_state["session_id"]
-                        ] = {
-                            "title": EMPTY_CHAT_NAME,
-                            "messages": [],
-                        }
-            with col3:
-                if self.st.button("Save chat"):
-                    save_chat(self.st)
-
-            self.st.subheader("Recent")  # Style the heading
-
-            all_chats = list(reversed(self.st.session_state.user_chats.items()))
-            for chat_id, chat in all_chats[:NUM_CHAT_IN_RECENT]:
-                if self.st.button(chat["title"], key=chat_id):
-                    self.st.session_state.run_id = None
-                    self.st.session_state["session_id"] = chat_id
-                    self.st.session_state.session_db.get_session(
-                        session_id=self.st.session_state["session_id"],
-                    )
-
-            with self.st.expander("Other chats"):
-                for chat_id, chat in all_chats[NUM_CHAT_IN_RECENT:]:
-                    if self.st.button(chat["title"], key=chat_id):
-                        self.st.session_state.run_id = None
-                        self.st.session_state["session_id"] = chat_id
-                        self.st.session_state.session_db.get_session(
-                            session_id=self.st.session_state["session_id"],
-                        )
-
-            self.st.divider()
-            self.st.header("Upload files from local")
-            bucket_name = self.st.text_input(
-                label="GCS Bucket for upload",
-                value=os.environ.get("BUCKET_NAME", "gs://your-bucket-name"),
-            )
-            if "checkbox_state" not in self.st.session_state:
-                self.st.session_state.checkbox_state = True
-
-            self.st.session_state.checkbox_state = self.st.checkbox(
-                "Upload to GCS first (suggested)", value=False, help=HELP_GCS_CHECKBOX
-            )
-
-            self.uploaded_files = self.st.file_uploader(
-                label="Send files from local",
-                accept_multiple_files=True,
-                key=f"uploader_images_{self.st.session_state.uploader_key}",
-                type=[
-                    "png",
-                    "jpg",
-                    "jpeg",
-                    "txt",
-                    "docx",
-                    "pdf",
-                    "rtf",
-                    "csv",
-                    "tsv",
-                    "xlsx",
-                ],
-            )
-            if self.uploaded_files and self.st.session_state.checkbox_state:
-                upload_files_to_gcs(self.st, bucket_name, self.uploaded_files)
-
-            self.st.divider()
-
-            self.st.header("Upload files from GCS")
-            self.gcs_uris = self.st.text_area(
-                "GCS uris (comma-separated)",
-                value=self.st.session_state["gcs_uris_to_be_sent"],
-                key=f"upload_text_area_{self.st.session_state.uploader_key}",
-                help=HELP_MESSAGE_MULTIMODALITY,
-            )
-
-            self.st.caption(f"Note: {HELP_MESSAGE_MULTIMODALITY}")