Skip to content

Commit

Permalink
AgentTask
Browse files Browse the repository at this point in the history
  • Loading branch information
Oceania2018 committed Feb 2, 2024
1 parent b9bc7d6 commit 7cbc0cc
Show file tree
Hide file tree
Showing 7 changed files with 293 additions and 7 deletions.
20 changes: 20 additions & 0 deletions src/lib/helpers/types.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,26 @@
* @property {AgentLlmConfig} llmConfig - LLM settings.
*/

/**
* @typedef {Object} AgentTaskFilter
* @property {Pagination} pager - Pagination
* @property {string} [agentId] - The agent id.
*/

/**
* @typedef {Object} AgentTaskViewModel
* @property {string} id - Task id.
* @property {string} name - Task name.
* @property {string} description - Description.
* @property {string} content - Task detail.
* @property {boolean} enabled
* @property {Date} created_datetime
* @property {Date} updated_datetime
* @property {string} agent_id - Description.
* @property {string} agent_name - Task detail.
*/


/**
* @typedef {Object} InstructMessageModel
* @property {string} [instruction] - User provided prompt instead of predefined template.
Expand Down
3 changes: 3 additions & 0 deletions src/lib/services/api-endpoints.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,9 @@ export const endpoints = {
agentDetailUrl: `${host}/agent/{id}`,
agentRefreshUrl: `${host}/refresh-agents`,

// agent task
agentTaskListUrl: `${host}/agent/tasks`,

// agent instruct
instructCompletionUrl: `${host}/instruct/{agentId}`,

Expand Down
18 changes: 18 additions & 0 deletions src/lib/services/task-service.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import { endpoints } from '$lib/services/api-endpoints.js';
import { replaceUrl } from '$lib/helpers/http';
import axios from 'axios';

/**
* Get agent list
* @param {import('$types').AgentTaskFilter} filter
* @returns {Promise<import('$types').PagedItems<import('$types').AgentTaskViewModel>>}
*/
export async function getAgentTasks(filter) {
const response = await axios.get(endpoints.agentTaskListUrl, { params: filter,
paramsSerializer: {
dots: true,
indexes: null,
}
});
return response.data;
}
2 changes: 1 addition & 1 deletion src/routes/(home)/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
</Link>
</Col>
</Row>
<Row>
<Row class="d-flex justify-content-center align-items-center" style="height: 60vh;">
<Col lg="12">
<div class="text-center">
<Row class="justify-content-center mt-5">
Expand Down
4 changes: 2 additions & 2 deletions src/routes/page/conversation/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -246,9 +246,9 @@
</Link>
</li>
<li data-bs-toggle="tooltip" data-bs-placement="top" title="Delete">
<Link href="#" on:click={() => openDeleteModal(conv.id)} class="btn btn-sm btn-soft-danger">
<Button on:click={() => openDeleteModal(conv.id)} class="btn btn-sm btn-soft-danger">
<i class="mdi mdi-delete-outline" />
</Link>
</Button>
</li>
</ul>
</td>
Expand Down
17 changes: 13 additions & 4 deletions src/routes/page/conversation/[conversationId]/conv-dialogs.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,15 @@
onMount(async () => {
dialogs = await GetDialogs(conversation.id);
});
/**
* @param {import('$types').ChatResponseModel} dialog
* @returns {boolean}
*/
function showInRight(dialog) {
const sender = dialog.sender;
return sender.role != "client" && sender.role != "user";
}
</script>

<Card>
Expand All @@ -24,14 +33,14 @@
<li class="event-list">
<div class="event-timeline-dot">
<i
class={dialog.sender.role === "client"
? "bx bx-right-arrow-circle bx-fade-right"
: "bx bx-right-arrow-circle"}
class={"bx " + showInRight(dialog)
? "bx-right-arrow-circle bx-fade-right"
: "bx-right-arrow-circle"}
/>
</div>
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<i class={"bx " + (dialog.sender.role == "client" ? "bx-user" : "bx-bot") + " h2 text-primary"}></i>
<i class={"bx " + (showInRight(dialog) ? "bx-user" : "bx-bot") + " h2 text-primary"}></i>
</div>
<div class="flex-grow-1">
<div>
Expand Down
236 changes: 236 additions & 0 deletions src/routes/page/task/+page.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,236 @@
<script>
import {
Button,
Card,
CardBody,
Col,
Dropdown,
DropdownItem,
DropdownMenu,
DropdownToggle,
Input,
Row,
Table
} from '@sveltestrap/sveltestrap';
import Breadcrumb from '$lib/common/Breadcrumb.svelte';
import HeadTitle from '$lib/common/HeadTitle.svelte';
import TablePagination from '$lib/common/TablePagination.svelte';
import { onMount } from 'svelte';
import Link from 'svelte-link';
import { getAgentTasks } from '$lib/services/task-service';
import { utcToLocal } from '$lib/helpers/datetime';
import Swal from 'sweetalert2/dist/sweetalert2.js';
import "sweetalert2/src/sweetalert2.scss";
import { replaceNewLine } from '$lib/helpers/http';
let isError = false;
const duration = 3000;
const firstPage = 1;
const pageSize = 10;
/** @type {import('$types').PagedItems<import('$types').AgentTaskViewModel>} */
let tasks = { count: 0, items: [] };
/** @type {import('$types').AgentTaskFilter} */
const initFilter = {
pager: { page: firstPage, size: pageSize, count: 0 }
};
/** @type {import('$types').AgentTaskFilter} */
let filter = { ... initFilter };
/** @type {import('$types').Pagination} */
let pager = filter.pager;
onMount(async () => {
await getPagedAgentTasks();
});
async function getPagedAgentTasks() {
tasks = await getAgentTasks( filter);
refresh();
}
function refresh() {
refreshTasks();
refreshPager(tasks.count, filter.pager.page, filter.pager.size);
}
function refreshTasks() {
tasks = {
items: tasks?.items?.map(t => { return { ...t }; }) || [],
count: tasks?.count || 0
};
}
/** @param {number} totalItemsCount */
function refreshPager(totalItemsCount, page = firstPage, pageCount = pageSize) {
pager = {
page: page,
size: pageCount,
count: totalItemsCount
};
}
/** @param {number} pageNum */
function pageTo(pageNum) {
pager = {
...pager,
page: pageNum
};
filter = {
...filter,
pager: pager
};
getPagedAgentTasks();
}
async function reloadConversations() {
filter = { ...initFilter };
tasks = await getAgentTasks(filter);
refreshPager(tasks.count);
}
/** @param {string} taskId */
function handleTaskDeletion(taskId) {
/*deleteConversation(conversationId).then(async () => {
isLoading = false;
isComplete = true;
setTimeout(() => {
isComplete = false;
}, duration);
await reloadConversations();
}).catch(err => {
isLoading = false;
isComplete = false;
isError = true;
setTimeout(() => {
isError = false;
}, duration);
});*/
}
/** @param {string} taskId */
function openDeleteModal(taskId) {
// @ts-ignore
Swal.fire({
title: 'Are you sure?',
text: "You won't be able to revert this!",
icon: 'warning',
customClass: 'delete-modal',
showCancelButton: true,
confirmButtonText: 'Yes, delete it!'
// @ts-ignore
}).then((result) => {
if (result.value) {
handleTaskDeletion(taskId);
}
});
}
/**
* @param {any} e
*/
function searchTasks(e) {
e.preventDefault();
filter = {
...filter,
pager: { page: firstPage, size: pageSize, count: 0 }
};
getPagedAgentTasks();
}
</script>
<HeadTitle title="Task List" />
<Breadcrumb title="Agent" pagetitle="Task" />
<Row>
<Col lg="12">
<Card>
<CardBody class="border-bottom">
<div class="d-flex align-items-center">
<h5 class="mb-0 card-title flex-grow-1">Task List</h5>
<div class="flex-shrink-0">
<Link class="btn btn-light" on:click={(e) => searchTasks(e)}><i class="mdi mdi-magnify" /></Link>
<Dropdown class="dropdown d-inline-block">
<DropdownToggle type="menu" class="btn" id="dropdownMenuButton1">
<i class="mdi mdi-dots-vertical" /></DropdownToggle
>
<DropdownMenu>
<DropdownItem>Action</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
</div>
</CardBody>
<CardBody class="border-bottom">
<Row class="g-3">
<Col xxl="4" lg="6">
<Input
type="search"
class="form-control"
id="searchTableList"
placeholder="Search for ..."
/>
</Col>
<Col xxl="2" lg="6">
<select class="form-select" id="idStatus" bind:value={filter.status}>
<option value={null}>Status</option>
<option value="open">Active</option>
<option value="closed">Completed</option>
</select>
</Col>
<Col xxl="2" lg="4">
<Button type="button" color="secondary" class="btn-soft-secondary w-100">
<i class="mdi mdi-filter-outline align-middle" /> Filter
</Button>
</Col>
</Row>
</CardBody>
<CardBody>
<div class="table-responsive">
<Table class="align-middle nowrap" bordered>
<thead>
<tr>
<th scope="col">Name</th>
<th scope="col">Description</th>
<th scope="col">Agent</th>
<th scope="col">Content</th>
<th scope="col">Updated Date</th>
<th scope="col">Status</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
{#each tasks.items as task}
<tr>
<td scope="row">
<a href="page/conversation/{task.id}">{task.name}</a>
</td>
<td>{task.description}</td>
<td>{task.agent_name}</td>
<td>{@html replaceNewLine(task.content)}</td>
<td>{utcToLocal(task.updated_datetime)}</td>
<td><span class="badge bg-success">{task.enabled ? "Enabled" : "Disabled"}</span></td>
<td>
<ul class="list-unstyled hstack gap-1 mb-0">
<li data-bs-toggle="tooltip" data-bs-placement="top" title="Delete">
<Button on:click={() => openDeleteModal(task.id)} class="btn btn-sm btn-soft-danger">
<i class="mdi mdi-delete-outline" />
</Button>
</li>
</ul>
</td>
</tr>
{/each}
</tbody>
</Table>
</div>
<TablePagination pagination={pager} pageTo={pageTo} />
</CardBody>
</Card>
</Col>
</Row>

0 comments on commit 7cbc0cc

Please sign in to comment.