Skip to content

feat: strengthen environment tag color display (dms-ui) #841

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
LordofAvernus merged 6 commits into from
Jun 22, 2026
Merged

feat: strengthen environment tag color display (dms-ui) #841

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
010011a
feat: strengthen environment tag color display (#2983)
LordofAvernus Jun 17, 2026
3065270
fix: keep color picker popup above dropdown (#2983)
LordofAvernus Jun 18, 2026
ce77b68
test: fix dms-ui ci snapshots (#2983)
LordofAvernus Jun 18, 2026
f33a9f5
feat: polish environment tag color editor and selector UX (#2983)
LordofAvernus Jun 22, 2026
ebd2336
style: fix prettier formatting for CI checker (#2983)
LordofAvernus Jun 22, 2026
6069324
test: update jest snapshots and fix PushRuleConfiguration CI (#2983)
LordofAvernus Jun 22, 2026
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
4 changes: 2 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"checker": "concurrently \"pnpm ts-check\" \"pnpm eslint\" \"pnpm stylelint\" \"pnpm prettier:c\"",
"test": "sh ./scripts/jest/run.sh",
"test:c": "sh ./scripts/jest/run-coverage.sh",
"test:ci": "sh ./scripts/jest/run-ci.sh 1 1 && node ./scripts/jest/merge-report-json.js",
"test:ci": "sh ./scripts/jest/run-ci.sh 1 1 && SHARD_COUNT=1 node ./scripts/jest/merge-report-json.js",
"test:clean": "jest --clearCache",
"icon:g": "pnpm --filter @actiontech/icons icon:g",
"icon:docs:g": "pnpm --filter @actiontech/icons docs:g",
Expand Down Expand Up @@ -149,4 +149,4 @@
"@babel/core": "^7.22.0",
"@ant-design/cssinjs": "1.17.0"
}
}
}
4 changes: 2 additions & 2 deletions packages/base/src/__snapshots__/App.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -229,7 +229,7 @@ exports[`App render App when "checkPageAction" is false 1`] = `
</div>
</div>
<div
class="ant-select ant-select-lg ant-select-borderless basic-select-wrapper custom-select-namespace custom-project-selector css-1jmxnk5 ant-select-single ant-select-show-arrow"
class="ant-select ant-select-lg ant-select-borderless basic-select-wrapper custom-select-namespace custom-project-selector css-8xciap ant-select-single ant-select-show-arrow"
searchinputref="[object Object]"
>
<div
Expand Down Expand Up @@ -1442,7 +1442,7 @@ exports[`App render App when token is existed 1`] = `
</div>
</div>
<div
class="ant-select ant-select-lg ant-select-borderless basic-select-wrapper custom-select-namespace custom-project-selector css-1jmxnk5 ant-select-single ant-select-show-arrow"
class="ant-select ant-select-lg ant-select-borderless basic-select-wrapper custom-select-namespace custom-project-selector css-8xciap ant-select-single ant-select-show-arrow"
searchinputref="[object Object]"
>
<div
Expand Down
276 changes: 262 additions & 14 deletions packages/base/src/hooks/useDbService/__snapshots__/index.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,77 @@ exports[`useDbService should render options when use generateDbServiceIDSelectOp
/>,
"options": [
{
"label": "test (127.0.0.1:3306)",
"label": <span
className="db-service-option-label"
style={
{
"alignItems": "center",
"display": "inline-flex",
"maxWidth": "none",
}
}
>
<Memo(EnvironmentTag)
color="#F5222D"
ellipsis={false}
name="PROD"
size="small"
style={
{
"flexShrink": 0,
"marginRight": 6,
}
}
/>
<span
style={
{
"whiteSpace": "nowrap",
}
}
>
test (127.0.0.1:3306)
</span>
</span>,
"text": "test (127.0.0.1:3306)",
"title": "test (127.0.0.1:3306)",
"value": "123123",
},
{
"label": "test2 (localhost:3306)",
"label": <span
className="db-service-option-label"
style={
{
"alignItems": "center",
"display": "inline-flex",
"maxWidth": "none",
}
}
>
<Memo(EnvironmentTag)
color="#52C41A"
ellipsis={false}
name="TEST"
size="small"
style={
{
"flexShrink": 0,
"marginRight": 6,
}
}
/>
<span
style={
{
"whiteSpace": "nowrap",
}
}
>
test2 (localhost:3306)
</span>
</span>,
"text": "test2 (localhost:3306)",
"title": "test2 (localhost:3306)",
"value": "300123",
},
],
Expand Down Expand Up @@ -57,7 +123,27 @@ exports[`useDbService should render options when use generateDbServiceIDSelectOp
class="ant-select-selection-item"
title="test (127.0.0.1:3306)"
>
test (127.0.0.1:3306)
<span
class="db-service-option-label"
style="display: inline-flex; align-items: center; max-width: none;"
>
<span
class="css-cf91id"
color="#F5222D"
style="margin-right: 6px; flex-shrink: 0;"
>
<span
class="environment-tag-name"
>
PROD
</span>
</span>
<span
style="white-space: nowrap;"
>
test (127.0.0.1:3306)
</span>
</span>
</span>
</div>
<span
Expand Down Expand Up @@ -127,7 +213,27 @@ exports[`useDbService should render options when use generateDbServiceIDSelectOp
class="ant-select-selection-item"
title="test (127.0.0.1:3306)"
>
test (127.0.0.1:3306)
<span
class="db-service-option-label"
style="display: inline-flex; align-items: center; max-width: none;"
>
<span
class="css-cf91id"
color="#F5222D"
style="margin-right: 6px; flex-shrink: 0;"
>
<span
class="environment-tag-name"
>
PROD
</span>
</span>
<span
style="white-space: nowrap;"
>
test (127.0.0.1:3306)
</span>
</span>
</span>
</div>
<span
Expand Down Expand Up @@ -175,15 +281,13 @@ exports[`useDbService should render options when use generateDbServiceIDSelectOp
role="presentation"
/>
<div
aria-label="test (127.0.0.1:3306)"
aria-selected="true"
id="rc_select_TEST_OR_SSR_list_1"
role="option"
>
123123
</div>
<div
aria-label="test2 (localhost:3306)"
aria-selected="false"
id="rc_select_TEST_OR_SSR_list_2"
role="option"
Expand Down Expand Up @@ -230,7 +334,27 @@ exports[`useDbService should render options when use generateDbServiceIDSelectOp
<div
class="ant-select-item-option-content"
>
test (127.0.0.1:3306)
<span
class="db-service-option-label"
style="display: inline-flex; align-items: center; max-width: none;"
>
<span
class="css-cf91id"
color="#F5222D"
style="margin-right: 6px; flex-shrink: 0;"
>
<span
class="environment-tag-name"
>
PROD
</span>
</span>
<span
style="white-space: nowrap;"
>
test (127.0.0.1:3306)
</span>
</span>
</div>
<span
aria-hidden="true"
Expand All @@ -248,7 +372,27 @@ exports[`useDbService should render options when use generateDbServiceIDSelectOp
<div
class="ant-select-item-option-content"
>
test2 (localhost:3306)
<span
class="db-service-option-label"
style="display: inline-flex; align-items: center; max-width: none;"
>
<span
class="css-1wvwrtw"
color="#52C41A"
style="margin-right: 6px; flex-shrink: 0;"
>
<span
class="environment-tag-name"
>
TEST
</span>
</span>
<span
style="white-space: nowrap;"
>
test2 (localhost:3306)
</span>
</span>
</div>
<span
aria-hidden="true"
Expand Down Expand Up @@ -276,11 +420,77 @@ exports[`useDbService should render options when use generateDbServiceSelectOpti
/>,
"options": [
{
"label": "test (127.0.0.1:3306)",
"label": <span
className="db-service-option-label"
style={
{
"alignItems": "center",
"display": "inline-flex",
"maxWidth": "none",
}
}
>
<Memo(EnvironmentTag)
color="#F5222D"
ellipsis={false}
name="PROD"
size="small"
style={
{
"flexShrink": 0,
"marginRight": 6,
}
}
/>
<span
style={
{
"whiteSpace": "nowrap",
}
}
>
test (127.0.0.1:3306)
</span>
</span>,
"text": "test (127.0.0.1:3306)",
"title": "test (127.0.0.1:3306)",
"value": "test",
},
{
"label": "test2 (localhost:3306)",
"label": <span
className="db-service-option-label"
style={
{
"alignItems": "center",
"display": "inline-flex",
"maxWidth": "none",
}
}
>
<Memo(EnvironmentTag)
color="#52C41A"
ellipsis={false}
name="TEST"
size="small"
style={
{
"flexShrink": 0,
"marginRight": 6,
}
}
/>
<span
style={
{
"whiteSpace": "nowrap",
}
}
>
test2 (localhost:3306)
</span>
</span>,
"text": "test2 (localhost:3306)",
"title": "test2 (localhost:3306)",
"value": "test2",
},
],
Expand Down Expand Up @@ -442,15 +652,13 @@ exports[`useDbService should render options when use generateDbServiceSelectOpti
role="presentation"
/>
<div
aria-label="test (127.0.0.1:3306)"
aria-selected="false"
id="rc_select_TEST_OR_SSR_list_1"
role="option"
>
test
</div>
<div
aria-label="test2 (localhost:3306)"
aria-selected="false"
id="rc_select_TEST_OR_SSR_list_2"
role="option"
Expand Down Expand Up @@ -497,7 +705,27 @@ exports[`useDbService should render options when use generateDbServiceSelectOpti
<div
class="ant-select-item-option-content"
>
test (127.0.0.1:3306)
<span
class="db-service-option-label"
style="display: inline-flex; align-items: center; max-width: none;"
>
<span
class="css-cf91id"
color="#F5222D"
style="margin-right: 6px; flex-shrink: 0;"
>
<span
class="environment-tag-name"
>
PROD
</span>
</span>
<span
style="white-space: nowrap;"
>
test (127.0.0.1:3306)
</span>
</span>
</div>
<span
aria-hidden="true"
Expand All @@ -515,7 +743,27 @@ exports[`useDbService should render options when use generateDbServiceSelectOpti
<div
class="ant-select-item-option-content"
>
test2 (localhost:3306)
<span
class="db-service-option-label"
style="display: inline-flex; align-items: center; max-width: none;"
>
<span
class="css-1wvwrtw"
color="#52C41A"
style="margin-right: 6px; flex-shrink: 0;"
>
<span
class="environment-tag-name"
>
TEST
</span>
</span>
<span
style="white-space: nowrap;"
>
test2 (localhost:3306)
</span>
</span>
</div>
<span
aria-hidden="true"
Expand Down
Loading
Loading