Skip to content

Conversation

@FredrikOseberg
Copy link
Contributor

@FredrikOseberg FredrikOseberg commented Mar 27, 2025

Standardize Tag Component and Add Color Support

Changes

  • Used tagTypeColor feature flag to control tag color display
    • When enabled, tags show their associated colors with a dot indicator
    • When disabled, maintains existing plain tag appearance
  • Created a centralized Tag component for consistent styling and behavior
    • Used across project list and feature overview
    • Handles text truncation and tooltips internally
    • Consistent border radius and spacing
  • Migrated from ITag interface to OpenAPI-generated TagSchema
    • Improved type safety with API-aligned types
    • Removed manual type conversions
    • Better maintainability through generated types

New tags:

Skjermbilde 2025-03-31 kl  10 48 16 Skjermbilde 2025-03-31 kl  10 48 28

Old:

Skjermbilde 2025-03-31 kl  10 49 29 Skjermbilde 2025-03-31 kl  10 49 15

@vercel
Copy link

vercel bot commented Mar 27, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
unleash-docs ⬜️ Ignored (Inspect) Visit Preview Mar 31, 2025 9:49am

@github-actions
Copy link
Contributor

github-actions bot commented Mar 27, 2025

Dependency Review

✅ No vulnerabilities or license issues or OpenSSF Scorecard issues found.

OpenSSF Scorecard

PackageVersionScoreDetails

Scanned Files

@gastonfournier gastonfournier moved this from New to In Progress in Issues and PRs Mar 28, 2025
value,
type,
}).then(async () => {
await refetchTags();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Uneccesary await, not async function.


// For non-color tags, use the StyledTag approach
const isOverflowing = tagFullText.length > 30;
const displayText = isOverflowing
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe a test for the ... logic?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My reasoning here is that it this was the way it worked before, this is just moved to another place, and will be removed when the feature flag is removed.

sx={{ cursor: 'pointer' }}
onClick={() => onClick(tag)}
key={tag}
onClick={() => onClick(`${tag.type}:${tag.value}`)}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we keep constructing this type:value in so many places. Maybe we need a first class function for that?

@github-project-automation github-project-automation bot moved this from In Progress to Approved PRs in Issues and PRs Mar 31, 2025
@FredrikOseberg FredrikOseberg merged commit aa6c422 into main Mar 31, 2025
10 checks passed
@github-project-automation github-project-automation bot moved this from Approved PRs to Done in Issues and PRs Mar 31, 2025
@FredrikOseberg FredrikOseberg deleted the feat/tag-type-frontend-display branch March 31, 2025 09:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

3 participants