diff --git a/web/README.md b/web/README.md index 5ce67661..33f21478 100644 --- a/web/README.md +++ b/web/README.md @@ -1,5 +1,5 @@ # create-svelte - + Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte). ## Creating a project diff --git a/web/src/lib/components/SettingsAgent.svelte b/web/src/lib/components/SettingsAgent.svelte new file mode 100644 index 00000000..80787c10 --- /dev/null +++ b/web/src/lib/components/SettingsAgent.svelte @@ -0,0 +1,140 @@ + + +{#if showModalSettings} +
+ +
+
+

Settings

+ +
+
+ +
+
+
+ {#if selectedOption === "info"} +
+ Avatar +
+
+

+ {agentDisplayName} +

+
+

+ {agentDescription} +

+
+
+
+
+

Link Badge in README or Documentation

+
+ + AI Code Agent Badge + + +
+
+
+
+

+ Data Sources +

+ {#each agentDataSources as sourceData} + +
+ {sourceData.uri} +
+
+ {#if sourceData.type === "github"} + + {:else if sourceData.type === "web_page"} + + {:else} + + {/if} +
+ + {/each} +
+ {:else if selectedOption === "share"} + share + {/if} +
+
+
+ +
+{/if} diff --git a/web/src/lib/components/chat/ChatIntroduction.svelte b/web/src/lib/components/chat/ChatIntroduction.svelte index b1d50854..430e873a 100644 --- a/web/src/lib/components/chat/ChatIntroduction.svelte +++ b/web/src/lib/components/chat/ChatIntroduction.svelte @@ -7,12 +7,16 @@ import { ToastType } from "$lib/types/Toast"; import type { Questionnaire } from "$lib/types/Questionnaires"; import { questionnaireStore } from "$lib/stores/QuestionnaireStores"; + import SettingsAgent from "$lib/components/SettingsAgent.svelte"; export let agentDisplayName: string = ""; export let agentDescription: string = ""; export let agentLogo: string = ""; export let agentId: string = ""; export let agentIsDataSourceIndexed: boolean = true; + export let agentDataSources: Array = []; + + let showModalSettings: boolean = false; let emailValue: string = ""; let questionnaires: Array = [ @@ -28,7 +32,6 @@ recipient_mail: emailValue, notify_for: "data_index", }; - debugger; try { const response = await fetch( "https://api.commanddash.dev/agent/notify", @@ -40,7 +43,6 @@ }, }, ); - debugger; const _response = await response.json(); @@ -119,21 +121,25 @@

- +
{#if !agentIsDataSourceIndexed}
@@ -185,3 +191,15 @@
+ + { + showModalSettings = false; + }} +/> \ No newline at end of file diff --git a/web/src/lib/components/chat/ChatWindow.svelte b/web/src/lib/components/chat/ChatWindow.svelte index 453f4a6b..bc554567 100644 --- a/web/src/lib/components/chat/ChatWindow.svelte +++ b/web/src/lib/components/chat/ChatWindow.svelte @@ -25,6 +25,7 @@ export let agentVersion: string = "1.0.3"; export let agentPrivate: boolean = false; export let agentIsDataSourceIndexed: boolean = true; + export let agentDataSources: Array = []; let agentReferences: Array = []; let messageLoading: boolean = false; @@ -172,6 +173,7 @@ {agentLogo} {agentIsDataSourceIndexed} {agentId} + {agentDataSources} /> {/if} diff --git a/web/src/lib/types/Agent.ts b/web/src/lib/types/Agent.ts index 8c2b2de4..aaf33bbe 100644 --- a/web/src/lib/types/Agent.ts +++ b/web/src/lib/types/Agent.ts @@ -19,6 +19,13 @@ export type Agent = { tags: string [], version: string, }, + data_sources: { + id: string, + uri: { + type: string, + uri: string + }[] + }[], min_cli_version: string, name: string, publisher_id: string, diff --git a/web/src/lib/utils/copyToClipboard.ts b/web/src/lib/utils/copyToClipboard.ts new file mode 100644 index 00000000..0481bfb3 --- /dev/null +++ b/web/src/lib/utils/copyToClipboard.ts @@ -0,0 +1,9 @@ +// src/lib/utils/copyToClipboard.ts +export function copyToClipboard(text: string) { + const textarea = document.createElement("textarea"); + textarea.value = text; + document.body.appendChild(textarea); + textarea.select(); + document.execCommand("copy"); + document.body.removeChild(textarea); +} \ No newline at end of file diff --git a/web/src/routes/+page.svelte b/web/src/routes/+page.svelte index c863c2bf..90e5e2ca 100644 --- a/web/src/routes/+page.svelte +++ b/web/src/routes/+page.svelte @@ -5,6 +5,8 @@ import CarbonSearch from "~icons/carbon/search"; import CarbonAdd from "~icons/carbon/add"; import CarbonGithub from "~icons/carbon/logo-github"; + import CarbonSettings from "~icons/carbon/settings"; + import type { Agent } from "$lib/types/Agent"; import { goto } from "$app/navigation"; import { debounce } from "$lib/utils/debounce"; @@ -16,6 +18,7 @@ let filteredAgents: Agent[] = []; let searchValue: string = ""; let showModal: boolean = false; + let currentAgent: Agent; $: loading = true; diff --git a/web/src/routes/agent/+page.svelte b/web/src/routes/agent/+page.svelte index 8c1cbff1..048a3a6c 100644 --- a/web/src/routes/agent/+page.svelte +++ b/web/src/routes/agent/+page.svelte @@ -10,6 +10,10 @@ let currentAgentDetails: Agent; let errorMessage: string = "Something went wrong"; + let agentDataSources: Array = []; + + const limit: number = 10; + $: loading = true; onMount(async () => { @@ -40,6 +44,7 @@ } currentAgentDetails = _response as Agent; + agentDataSources = extractUris(currentAgentDetails?.data_sources) loading = false; // Track custom event for agent details loaded appInsights.trackEvent({ @@ -51,6 +56,26 @@ }, }); }); + + const extractUris = ( + data: { id: string; uri: { type: string; uri: string }[] }[], + ): { type: string; uri: string }[] => { + const result: { type: string; uri: string }[] = []; + data.forEach((item) => { + item.uri.forEach((uriItem) => { + if (result.length < limit) { + result.push({ + type: uriItem.type, + uri: uriItem.uri, + }); + } else { + return result; + } + }); + }); + return result; + }; + {#if currentAgentDetails} @@ -64,6 +89,7 @@ agentLogo={currentAgentDetails?.metadata?.avatar_id} agentIsDataSourceIndexed={currentAgentDetails.data_sources_indexed} agentId={currentAgentDetails?.name} + agentDataSources={agentDataSources} /> {/if} diff --git a/web/src/routes/agent/[id]/+page.svelte b/web/src/routes/agent/[id]/+page.svelte index 267eb871..c735cbe1 100644 --- a/web/src/routes/agent/[id]/+page.svelte +++ b/web/src/routes/agent/[id]/+page.svelte @@ -10,6 +10,10 @@ let currentAgentDetails: Agent; let errorMessage: string = "Something went wrong"; let errorStatus: number = 0; + let agentDataSources: Array = []; + + const limit: number = 10; + $: loading = true; onMount(async () => { @@ -36,9 +40,29 @@ } currentAgentDetails = _response as Agent; - + agentDataSources = extractUris(currentAgentDetails?.data_sources); loading = false; }); + + const extractUris = ( + data: { id: string; uri: { type: string; uri: string }[] }[], + ): { type: string; uri: string }[] => { + const result: { type: string; uri: string }[] = []; + data.forEach((item) => { + item.uri.forEach((uriItem) => { + if (result.length < limit) { + result.push({ + type: uriItem.type, + uri: uriItem.uri, + }); + } else { + return result; + } + }); + }); + return result; + }; + {#if currentAgentDetails} @@ -52,6 +76,7 @@ agentLogo={currentAgentDetails?.metadata?.avatar_id} agentIsDataSourceIndexed={currentAgentDetails.data_sources_indexed} agentId={currentAgentDetails?.name} + agentDataSources={agentDataSources} /> {/if}