Skip to content

Dev #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
lazToum merged 3 commits into from
Oct 21, 2024
Merged

Dev #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
2472baa
update agent colors
lazToum Oct 21, 2024
2ac20b1
fix typo
lazToum Oct 21, 2024
6d68741
update: use class for [role="button"]
lazToum Oct 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion scripts/video.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const main = async () => {
await fs.promises.mkdir(dotLocal, { recursive: true });
const dstFile = path.resolve(dotLocal, 'demo.webm');
await fs.promises.copyFile(path.resolve(videosDir, srcFile), dstFile);
console.info('Video file copied to doc/demo.webm');
console.info('Video file copied to .local/demo.webm');
await fs.promises.rmdir(videosDir, { recursive: true });
if (ffmpeg) {
const src = 'demo.webm';
Expand Down
4 changes: 2 additions & 2 deletions src/waldiez/components/edges/view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ export const WaldieEdgeView = (props: WaldieEdgeViewProps) => {
<div className="edge-actions">
<div
role="button"
className="open-edge-modal"
className="open-edge-modal clickable"
data-testid={`open-edge-modal-${id}`}
onClick={onOpenModal}
>
Expand All @@ -125,7 +125,7 @@ export const WaldieEdgeView = (props: WaldieEdgeViewProps) => {
<div
role="button"
onClick={onDelete}
className="delete-edge"
className="delete-edge clickable"
data-testid={`delete-edge-${id}`}
>
<FaTrashAlt />
Expand Down
4 changes: 2 additions & 2 deletions src/waldiez/components/modal/view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export const ModalView = (props: ModalViewProps) => {
<div className="modal-header-actions">
{hasMaximizeBtn && (
<div
className="modal-fullscreen-btn"
className="modal-fullscreen-btn clickable"
role="button"
title={isFullScreen ? 'Minimize' : 'Maximize'}
onClick={onToggleFullScreen}
Expand All @@ -43,7 +43,7 @@ export const ModalView = (props: ModalViewProps) => {
)}
{hasCloseBtn && (
<div
className="modal-close-btn"
className="modal-close-btn clickable"
role="button"
title="Close"
data-testid="modal-close-btn"
Expand Down
8 changes: 7 additions & 1 deletion src/waldiez/components/nodes/agent/view/body/manager.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,15 @@ export const WaldieNodeAgentManagerBodyView = (props: WaldieNodeAgentManagerBody
{groupMembers.map(member => (
<div key={member.id} className="group-member-entry" data-testid={`group-member-${member.id}`}>
<div className="group-member-name">{member.data.label}</div>
<FaGear role="button" onClick={onOpenMemberModal.bind(null, member)} title="Edit member" />
<FaGear
role="button"
className="clickable"
onClick={onOpenMemberModal.bind(null, member)}
title="Edit member"
/>
<FaMinusCircle
role="button"
className="clickable"
onClick={onRemoveMember.bind(null, member)}
data-testid={`group-member-${member.id}-remove`}
title="Remove member"
Expand Down
4 changes: 2 additions & 2 deletions src/waldiez/components/nodes/agent/view/footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,14 @@ export const WaldieNodeAgentFooterView = (props: WaldieNodeAgentFooterViewProps)
role="button"
onClick={onDelete}
title="Delete Agent"
className={'delete-agent no-margin no-padding'}
className={'delete-agent no-margin no-padding clickable'}
/>
<div className="date-info">{renderDate(data.updatedAt)}</div>
<FaCopy
role="button"
onClick={onClone}
title="Clone Agent"
className={'clone-agent no-margin no-padding'}
className={'clone-agent no-margin no-padding clickable'}
/>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/waldiez/components/nodes/agent/view/header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export const WaldieNodeAgentHeaderView = (props: WaldieNodeAgentHeaderViewProps)
return (
<div className="agent-header">
<div className="agent-header-left">
<FaGear role="button" onClick={onOpenNodeModal} />
<FaGear role="button" className="clickable" onClick={onOpenNodeModal} />
{data.agentType === 'rag_user' && <FaDatabase color={AGENT_COLORS.rag_user} />}
<div className="agent-label" data-testid={`agent-header-label-${id}`}>
{data.label}
Expand Down
3 changes: 3 additions & 0 deletions src/waldiez/components/nodes/model/view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ export const WaldieNodeModelView = (props: WaldieNodeModelViewProps) => {
<div className="model-header">
<div
role="button"
className="clickable"
id={`open-node-modal-${modelId}`}
data-testid={`open-node-modal-${modelId}`}
onClick={onOpen}
Expand All @@ -53,6 +54,7 @@ export const WaldieNodeModelView = (props: WaldieNodeModelViewProps) => {
<div className="model-footer" data-testid={`model-footer-${modelId}`}>
<div
role="button"
className="clickable"
id={`delete-node-${modelId}`}
data-testid={`delete-node-${modelId}`}
onClick={onDelete}
Expand All @@ -61,6 +63,7 @@ export const WaldieNodeModelView = (props: WaldieNodeModelViewProps) => {
</div>
<div
role="button"
className="clickable"
id={`clone-node-${modelId}`}
data-testid={`clone-node-${modelId}`}
onClick={onClone}
Expand Down
3 changes: 3 additions & 0 deletions src/waldiez/components/nodes/skill/view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ export const WaldieNodeSkillView = (props: WaldieNodeSkillViewProps) => {
<div className="skill-header">
<div
role="button"
className="clickable"
id={`open-node-modal-${skillId}`}
data-testid={`open-node-modal-${skillId}`}
onClick={onOpen}
Expand All @@ -50,6 +51,7 @@ export const WaldieNodeSkillView = (props: WaldieNodeSkillViewProps) => {
<div className="skill-footer" data-testid={`skill-footer-${skillId}`}>
<div
role="button"
className="clickable"
id={`delete-node-${skillId}`}
data-testid={`delete-node-${skillId}`}
onClick={onDelete}
Expand All @@ -58,6 +60,7 @@ export const WaldieNodeSkillView = (props: WaldieNodeSkillViewProps) => {
</div>
<div
role="button"
className="clickable"
id={`clone-node-${skillId}`}
data-testid={`clone-node-${skillId}`}
onClick={onClone}
Expand Down
42 changes: 36 additions & 6 deletions src/waldiez/components/sidebar/view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,22 +41,40 @@ export const SideBarView = (props: SideBarViewProps) => {
<ul>
<li
role="button"
className="editor-nav-action"
className="editor-nav-action clickable"
data-testid="edit-flow"
onClick={onEdit}
title="Edit flow"
>
<FaEdit /> Edit flow
</li>
<li role="button" data-node-type="agent" data-testid="show-agents" onClick={onShowAgents}>
<li
role="button"
className="clickable"
data-node-type="agent"
data-testid="show-agents"
onClick={onShowAgents}
>
<FaRobot />
Agents
</li>
<li role="button" data-node-type="model" data-testid="show-models" onClick={onShowModels}>
<li
role="button"
className="clickable"
data-node-type="model"
data-testid="show-models"
onClick={onShowModels}
>
<AiFillOpenAI />
Models
</li>
<li role="button" data-node-type="skill" data-testid="show-skills" onClick={onShowSkills}>
<li
role="button"
className="clickable"
data-node-type="skill"
data-testid="show-skills"
onClick={onShowSkills}
>
<AiFillCode />
Skills
</li>
Expand Down Expand Up @@ -98,10 +116,22 @@ export const SideBarView = (props: SideBarViewProps) => {
Import
</label>
</li>
<li role="button" onClick={onExport} title="Export flow" data-testid={`export-flow-${flowId}`}>
<li
role="button"
className="clickable"
onClick={onExport}
title="Export flow"
data-testid={`export-flow-${flowId}`}
>
<FaFileExport /> Export
</li>
<li role="button" data-testid="theme-toggle" onClick={onThemeToggle} title="Toggle theme">
<li
role="button"
className="clickable"
data-testid="theme-toggle"
onClick={onThemeToggle}
title="Toggle theme"
>
{darkMode ? <FaSun /> : <FaMoon />}
<div className="clickable">{darkMode ? 'Light' : 'Dark'} mode</div>
</li>
Expand Down
10 changes: 3 additions & 7 deletions src/waldiez/styles/base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
:root {
--user-agent-color: #d86ecc;
--assistant-agent-color: #60af43;
--group-manager-color: #e97132;
--user-agent-color: #bc76f5;
--assistant-agent-color: #66bc57;
--group-manager-color: #ed8a34;
--rag-user-color: #e34561;
--app-height: calc(100vh - env(safe-area-inset-bottom) - env(safe-area-inset-top));
--app-width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right));
Expand All @@ -27,10 +27,6 @@
cursor: pointer;
}

.flow-wrapper *[role='button'] {
cursor: pointer;
}

.flow-wrapper input,
textarea {
border-radius: 5px;
Expand Down
6 changes: 3 additions & 3 deletions src/waldiez/theme.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,9 @@ export const LOGOS = {
};
export const AGENT_COLORS = {
agent: '#005490',
assistant: '#8ed973',
user: '#d86ecc',
manager: '#e97132',
assistant: '#66bc57',
user: '#bc76f5',
manager: '#ed8a34',
rag_user: '#e34561'
};
export const AGENT_ICONS = {
Expand Down
14 changes: 12 additions & 2 deletions tests/browser/__snapshots__/waldie.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ exports[`All > should render Waldiez components 1`] = `
>
<ul>
<li
class="editor-nav-action"
class="editor-nav-action clickable"
data-testid="edit-flow"
role="button"
title="Edit flow"
Expand All @@ -65,6 +65,7 @@ exports[`All > should render Waldiez components 1`] = `
Edit flow
</li>
<li
class="clickable"
data-node-type="agent"
data-testid="show-agents"
role="button"
Expand All @@ -85,6 +86,7 @@ exports[`All > should render Waldiez components 1`] = `
Agents
</li>
<li
class="clickable"
data-node-type="model"
data-testid="show-models"
role="button"
Expand All @@ -107,6 +109,7 @@ exports[`All > should render Waldiez components 1`] = `
Models
</li>
<li
class="clickable"
data-node-type="skill"
data-testid="show-skills"
role="button"
Expand Down Expand Up @@ -202,6 +205,7 @@ exports[`All > should render Waldiez components 1`] = `
</label>
</li>
<li
class="clickable"
data-testid="export-flow-test-flow"
role="button"
title="Export flow"
Expand All @@ -222,6 +226,7 @@ exports[`All > should render Waldiez components 1`] = `
Export
</li>
<li
class="clickable"
data-testid="theme-toggle"
role="button"
title="Toggle theme"
Expand Down Expand Up @@ -529,7 +534,7 @@ exports[`All > should render Waldiez components 1`] = `
>
<ul>
<li
class="editor-nav-action"
class="editor-nav-action clickable"
data-testid="edit-flow"
role="button"
title="Edit flow"
Expand All @@ -550,6 +555,7 @@ exports[`All > should render Waldiez components 1`] = `
Edit flow
</li>
<li
class="clickable"
data-node-type="agent"
data-testid="show-agents"
role="button"
Expand All @@ -570,6 +576,7 @@ exports[`All > should render Waldiez components 1`] = `
Agents
</li>
<li
class="clickable"
data-node-type="model"
data-testid="show-models"
role="button"
Expand All @@ -592,6 +599,7 @@ exports[`All > should render Waldiez components 1`] = `
Models
</li>
<li
class="clickable"
data-node-type="skill"
data-testid="show-skills"
role="button"
Expand Down Expand Up @@ -687,6 +695,7 @@ exports[`All > should render Waldiez components 1`] = `
</label>
</li>
<li
class="clickable"
data-testid="export-flow-test-flow"
role="button"
title="Export flow"
Expand All @@ -707,6 +716,7 @@ exports[`All > should render Waldiez components 1`] = `
Export
</li>
<li
class="clickable"
data-testid="theme-toggle"
role="button"
title="Toggle theme"
Expand Down