From 367d1635083386b13e66b4d3436d682bfe41fe83 Mon Sep 17 00:00:00 2001 From: Edward Brunton <42774600+EdwardBrunton@users.noreply.github.com> Date: Fri, 27 Sep 2024 13:11:11 +0200 Subject: [PATCH 1/5] fix: Fix quick filter styling powerbi --- packages/power-bi/package.json | 2 +- .../components/QuickFilter/QuickFilter.tsx | 46 ++++++++++++++----- .../QuickFilter/quickFilter.styles.ts | 10 +++- .../expandedFilter/expandedFilter.styles.ts | 2 + packages/workspace-fusion/package.json | 2 +- 5 files changed, 47 insertions(+), 15 deletions(-) diff --git a/packages/power-bi/package.json b/packages/power-bi/package.json index eae697e1f..f75af994e 100644 --- a/packages/power-bi/package.json +++ b/packages/power-bi/package.json @@ -1,6 +1,6 @@ { "name": "@equinor/workspace-powerbi", - "version": "3.0.5", + "version": "3.0.6", "type": "module", "sideEffects": false, "license": "MIT", diff --git a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx index 1f5c45bd6..5d16cd437 100644 --- a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx +++ b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx @@ -1,4 +1,4 @@ -import { Chip } from '@equinor/eds-core-react'; +import { Button, Chip, Tooltip } from '@equinor/eds-core-react'; import { tokens } from '@equinor/eds-tokens'; import styled from 'styled-components'; @@ -9,7 +9,7 @@ import { ExpandedFilter } from '../expandedFilter/ExpandedFilter'; import { FilterController } from '../Filter/Filter'; import { PowerBiFilterGroup } from '../quickFilterGroup/QuickFilterGroup'; -import { StyledCompactFilterWrapper } from './quickFilter.styles'; +import { StyledButtonContent, StyledCompactFilterWrapper } from './quickFilter.styles'; interface PowerBIQuickFilterProps { controller: FilterController; @@ -82,11 +82,31 @@ export const PowerBIQuickFilter = ({ controller }: PowerBIQuickFilterProps): JSX - await resetFilter()} /> - -
setIsFilterExpanded(!isFilterExpanded)}> - {isFilterExpanded ? : } -
+ + + + @@ -101,14 +121,13 @@ const StyledFilterButtons = styled.div` `; const StyledQuickFilterWrapper = styled.div` - display: grid; + display: flex; width: 100%; justify-content: flex-start; - grid-template-columns: repeat(auto-fit, minmax(max-content, 50px)); - grid-template-rows: 1fr; gap: 10px; align-items: center; - overflow-x: hidden; + overflow-x: auto; + box-sizing: border-box; padding-left: 10px; padding-right: 10px; `; @@ -117,13 +136,16 @@ const FilterButtonContainer = styled.div` display: flex; align-items: center; height: 48px; - width: 96px; + width: fit-content; + gap: 10px; + padding: 0 10px; `; const FilterWrapper = styled.div` width: 100%; overflow-x: auto; overflow-y: hidden; + background-color: #f7f7f7; `; interface OtherFiltersAppliedInfoProps { diff --git a/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts b/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts index 325a51aed..765d6dbf5 100644 --- a/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts +++ b/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts @@ -2,10 +2,18 @@ import { tokens } from '@equinor/eds-tokens'; import styled from 'styled-components'; export const StyledCompactFilterWrapper = styled.div` - height: 50px; width: 100%; background-color: ${tokens.colors.ui.background__light.hex}; display: grid; grid-template-columns: 1fr auto; grid-template-rows: 1fr; `; + +export const StyledButtonContent = styled.div` + display: flex; + justify-content: space-between; + align-items: center; + width: 80px; + white-space: nowrap; +`; + diff --git a/packages/power-bi/src/lib/components/expandedFilter/expandedFilter.styles.ts b/packages/power-bi/src/lib/components/expandedFilter/expandedFilter.styles.ts index 52e63899c..c6fb6642f 100644 --- a/packages/power-bi/src/lib/components/expandedFilter/expandedFilter.styles.ts +++ b/packages/power-bi/src/lib/components/expandedFilter/expandedFilter.styles.ts @@ -16,6 +16,8 @@ export const StyledExpandedFilterWrapper = styled.div` height: 250px; overflow: hidden; border-bottom: 1px solid ${tokens.colors.ui.background__medium.hex}; + background-color: ${tokens.colors.ui.background__light.hex}; + margin-bottom: 10px; `; export const StyledSidebar = styled.div` diff --git a/packages/workspace-fusion/package.json b/packages/workspace-fusion/package.json index ea4072f3d..ccb8a69b6 100644 --- a/packages/workspace-fusion/package.json +++ b/packages/workspace-fusion/package.json @@ -1,6 +1,6 @@ { "name": "@equinor/workspace-fusion", - "version": "9.0.11", + "version": "9.0.12", "type": "module", "sideEffects": false, "license": "MIT", From 24a5db1e117a0821599fa02fc232fe15badd0bd2 Mon Sep 17 00:00:00 2001 From: Edward Brunton <42774600+EdwardBrunton@users.noreply.github.com> Date: Fri, 27 Sep 2024 13:12:53 +0200 Subject: [PATCH 2/5] fix version after merge --- packages/workspace-fusion/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/workspace-fusion/package.json b/packages/workspace-fusion/package.json index ccb8a69b6..a4d7da01a 100644 --- a/packages/workspace-fusion/package.json +++ b/packages/workspace-fusion/package.json @@ -1,6 +1,6 @@ { "name": "@equinor/workspace-fusion", - "version": "9.0.12", + "version": "9.0.13", "type": "module", "sideEffects": false, "license": "MIT", From 2afbf6e72f7a85ad71f8b6b9605fbd411cb0d847 Mon Sep 17 00:00:00 2001 From: EdwardBrunton Date: Fri, 27 Sep 2024 11:14:27 +0000 Subject: [PATCH 3/5] Prettified Code! --- .../src/lib/components/QuickFilter/quickFilter.styles.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts b/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts index 765d6dbf5..7d4351b93 100644 --- a/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts +++ b/packages/power-bi/src/lib/components/QuickFilter/quickFilter.styles.ts @@ -16,4 +16,3 @@ export const StyledButtonContent = styled.div` width: 80px; white-space: nowrap; `; - From 10e5a8d8e8ffe8bc9478ce371e3729ef17707926 Mon Sep 17 00:00:00 2001 From: Edward Brunton <42774600+EdwardBrunton@users.noreply.github.com> Date: Fri, 27 Sep 2024 13:17:30 +0200 Subject: [PATCH 4/5] Trigger Build From e9c3a197b1c1bb9c79d34373d04bba52900ffee3 Mon Sep 17 00:00:00 2001 From: Edward Brunton <42774600+EdwardBrunton@users.noreply.github.com> Date: Fri, 27 Sep 2024 13:46:33 +0200 Subject: [PATCH 5/5] feat: Update QuickFilter background color to use eds --- .../power-bi/src/lib/components/QuickFilter/QuickFilter.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx index 5d16cd437..20bcbea64 100644 --- a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx +++ b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx @@ -145,7 +145,7 @@ const FilterWrapper = styled.div` width: 100%; overflow-x: auto; overflow-y: hidden; - background-color: #f7f7f7; + background-color: ${tokens.colors.ui.background__light.hex}; `; interface OtherFiltersAppliedInfoProps {