From 9a24a30ba75812db6b4c3dc73c1492c3f92c516f Mon Sep 17 00:00:00 2001 From: Artem Date: Thu, 24 Apr 2025 22:25:24 -0400 Subject: [PATCH 1/2] AI-7: Add AI Agents skill icon to portfolio --- components/techIcon.tsx | 3 +- components/utils/skills.ts | 5 ++ tasks/AI-7.md | 76 +++++++++++++++++++++++++++++ tests/components/skillIcon.test.tsx | 22 +++++++++ 4 files changed, 105 insertions(+), 1 deletion(-) create mode 100644 tasks/AI-7.md create mode 100644 tests/components/skillIcon.test.tsx diff --git a/components/techIcon.tsx b/components/techIcon.tsx index 29712e9..68c5141 100644 --- a/components/techIcon.tsx +++ b/components/techIcon.tsx @@ -24,7 +24,8 @@ export type TechType = | "serverless" | "splunk" | "tableau" - | "redshift"; + | "redshift" + | "ai-agents"; interface props { tech: TechType; diff --git a/components/utils/skills.ts b/components/utils/skills.ts index 7a16394..b009253 100644 --- a/components/utils/skills.ts +++ b/components/utils/skills.ts @@ -1,6 +1,11 @@ import { ISkill } from "./types"; export const skills: ISkill[] = [ + { + tech: "ai-agents", + prettyName: "AI Agents", + years: 2, + }, { tech: "react", prettyName: "ReactJS", diff --git a/tasks/AI-7.md b/tasks/AI-7.md new file mode 100644 index 0000000..70416ac --- /dev/null +++ b/tasks/AI-7.md @@ -0,0 +1,76 @@ +# AI-7: Update portfolio main page to show AI agents as a skill + +## Important Rules +- Do not run commands, always use MCP tools +- Stop if a tool is missing +- Always commit changes +- Always update this task list + +## Task Description +Add "AI Agents" as a new skill icon in the Skills grid on the portfolio main page. + +## Acceptance Criteria +1. A new icon labelled "AI Agents" appears in the Skills grid +2. Icon size, padding and hover behaviour match existing skill icons +3. Tooltip/alt text reads "AI Agents" +4. Grid remains responsive on all breakpoints (no layout shift) +5. Lighthouse performance score remains ≥ 95 (no CLS regressions) +6. Unit or Cypress test asserts icon renders in the DOM + +## Tasks +1. [x] Create a new branch for this task +2. [ ] Find or create an AI agent icon image and add to public/icons and public/hq_icons + - Need to manually create/add these files: + - `/public/icons/ai-agents-icon.png` (standard resolution) + - `/public/hq_icons/ai-agents-icon.png` (high resolution) + - Consider using Font Awesome *fa-robot* as mentioned in ticket +3. [x] Update TechType in techIcon.tsx to include "ai-agents" +4. [x] Add the new skill to the skills array in components/utils/skills.ts +5. [x] Write a test to verify the icon renders correctly +6. [ ] Update component snapshot if needed +7. [ ] Create or update Confluence documentation regarding: + - Purpose of the AI Agents skill entry + - SVG source, file location, naming conventions + - Steps for adding future skills + - Add changelog entry referencing this Jira ticket + + Documentation Content (to be added to Confluence): + ``` + # AI Agents Skill Icon + + ## Purpose + The AI Agents skill icon represents Art's experience in building autonomous, LLM-powered solutions. This skill was added to highlight expertise in developing conversational agents, recommendation systems, and other AI-powered applications. + + ## Asset Information + - **Icon Name**: ai-agents + - **File Format**: PNG + - **Location**: + - `/public/icons/ai-agents-icon.png` (standard resolution) + - `/public/hq_icons/ai-agents-icon.png` (high resolution) + - **Source**: [Optional: Include the source of the icon here] + + ## Adding Future Skills + To add a new skill to the portfolio site: + + 1. Create icon files in both standard and high resolutions + 2. Add the new skill type to the `TechType` in `components/techIcon.tsx` + 3. Add the skill entry to the `skills` array in `components/utils/skills.ts` + 4. Create a test to verify the icon renders correctly + 5. Update component snapshots if necessary + 6. Document the new skill in Confluence + + ## Changelog + - April 24, 2025: Added AI Agents skill icon ([AI-7](link-to-jira-ticket)) + ``` + +8. [ ] Commit changes +9. [ ] Open pull request + +## Progress +- Created task file and planning implementation +- Created branch feat/AI-7-ai-agents-skill +- Updated TechType in techIcon.tsx to include "ai-agents" +- Added "AI Agents" skill entry to the skills array in skills.ts +- Created test file to verify AI Agents skill icon rendering +- Note: Need icon files to be manually created and placed in the appropriate directories +- Prepared Confluence documentation content (to be added when access is available) \ No newline at end of file diff --git a/tests/components/skillIcon.test.tsx b/tests/components/skillIcon.test.tsx new file mode 100644 index 0000000..c98183e --- /dev/null +++ b/tests/components/skillIcon.test.tsx @@ -0,0 +1,22 @@ +import "@testing-library/jest-dom"; +import { render, screen } from "@testing-library/react"; +import SkillIcon from "../../components/skillIcon"; + +describe("", () => { + it("renders skill icon with correct name and years", async () => { + render(); + + // Check if the icon appears with the proper alt and title text + const iconElement = screen.getByAltText("AI Agents"); + expect(iconElement).toBeInTheDocument(); + expect(iconElement).toHaveAttribute('title', '2 years of experience with AI Agents'); + + // Check if the skill name is rendered + const nameElement = screen.getByText("AI Agents"); + expect(nameElement).toBeInTheDocument(); + + // Check if the years text is rendered + const yearsElement = screen.getByText("2 years"); + expect(yearsElement).toBeInTheDocument(); + }); +}); \ No newline at end of file From 684977ccf783bd1d80d367e4e8eeac7b3e2e5f92 Mon Sep 17 00:00:00 2001 From: Artem Date: Thu, 24 Apr 2025 22:31:07 -0400 Subject: [PATCH 2/2] AI-7: Add AI agent icon files --- public/hq_icons/ai-agents-icon.png | Bin 0 -> 7673 bytes public/icons/ai-agents-icon.png | Bin 0 -> 838 bytes tasks/AI-7.md | 12 ++++++------ 3 files changed, 6 insertions(+), 6 deletions(-) create mode 100644 public/hq_icons/ai-agents-icon.png create mode 100644 public/icons/ai-agents-icon.png diff --git a/public/hq_icons/ai-agents-icon.png b/public/hq_icons/ai-agents-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..4e4f2476a5af8d7b0d7480f3a3e67c0f703e9c99 GIT binary patch literal 7673 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 literal 0 HcmV?d00001 diff --git a/tasks/AI-7.md b/tasks/AI-7.md index 70416ac..6a3c671 100644 --- a/tasks/AI-7.md +++ b/tasks/AI-7.md @@ -19,11 +19,10 @@ Add "AI Agents" as a new skill icon in the Skills grid on the portfolio main pag ## Tasks 1. [x] Create a new branch for this task -2. [ ] Find or create an AI agent icon image and add to public/icons and public/hq_icons - - Need to manually create/add these files: +2. [x] Find or create an AI agent icon image and add to public/icons and public/hq_icons + - Added files: - `/public/icons/ai-agents-icon.png` (standard resolution) - `/public/hq_icons/ai-agents-icon.png` (high resolution) - - Consider using Font Awesome *fa-robot* as mentioned in ticket 3. [x] Update TechType in techIcon.tsx to include "ai-agents" 4. [x] Add the new skill to the skills array in components/utils/skills.ts 5. [x] Write a test to verify the icon renders correctly @@ -63,7 +62,7 @@ Add "AI Agents" as a new skill icon in the Skills grid on the portfolio main pag - April 24, 2025: Added AI Agents skill icon ([AI-7](link-to-jira-ticket)) ``` -8. [ ] Commit changes +8. [x] Commit changes 9. [ ] Open pull request ## Progress @@ -72,5 +71,6 @@ Add "AI Agents" as a new skill icon in the Skills grid on the portfolio main pag - Updated TechType in techIcon.tsx to include "ai-agents" - Added "AI Agents" skill entry to the skills array in skills.ts - Created test file to verify AI Agents skill icon rendering -- Note: Need icon files to be manually created and placed in the appropriate directories -- Prepared Confluence documentation content (to be added when access is available) \ No newline at end of file +- Added icon files to public/icons and public/hq_icons directories +- Prepared Confluence documentation content (to be added when access is available) +- Committed all changes to the branch \ No newline at end of file