From 2148e161677ddfd9af1fbc971dd044331b185a94 Mon Sep 17 00:00:00 2001 From: kmcfaul <45077788+kmcfaul@users.noreply.github.com> Date: Wed, 28 Feb 2024 16:27:56 -0500 Subject: [PATCH] chore(DashboardWrapper,DashboardHeader): fix for table imports (#10114) --- .github/workflows/promote.yml | 2 +- .github/workflows/release.yml | 46 ++-- packages/react-core/src/demos/index.ts | 2 - packages/react-core/src/index.ts | 1 - .../react-table/src/demos/DashboardHeader.tsx | 198 +++++++++++++++++ .../src/demos/DashboardWrapper.tsx | 199 ++++++++++++++++++ packages/react-table/src/demos/Table.md | 32 ++- .../src/demos/assets/avatarImg.svg | 18 ++ .../react-table/src/demos/assets/index.d.ts | 4 + .../react-table/src/demos/assets/pf-logo.svg | 28 +++ .../src/demos/examples/TableBulkSelect.tsx | 2 +- .../demos/examples/TableColumnManagement.tsx | 2 +- .../src/demos/examples/TableCompact.tsx | 2 +- .../demos/examples/TableCompoundExpansion.tsx | 2 +- .../demos/examples/TableEmptyStateDefault.tsx | 2 +- .../demos/examples/TableEmptyStateError.tsx | 2 +- .../demos/examples/TableEmptyStateLoading.tsx | 2 +- .../demos/examples/TableExpandCollapseAll.tsx | 2 +- .../examples/TableSortableResponsive.tsx | 2 +- .../examples/TableStaticBottomPagination.tsx | 2 +- .../demos/examples/TableStickyFirstColumn.tsx | 2 +- .../src/demos/examples/TableStickyHeader.tsx | 2 +- packages/react-table/src/demos/index.ts | 2 + 23 files changed, 513 insertions(+), 43 deletions(-) delete mode 100644 packages/react-core/src/demos/index.ts create mode 100644 packages/react-table/src/demos/DashboardHeader.tsx create mode 100644 packages/react-table/src/demos/DashboardWrapper.tsx create mode 100644 packages/react-table/src/demos/assets/avatarImg.svg create mode 100644 packages/react-table/src/demos/assets/index.d.ts create mode 100644 packages/react-table/src/demos/assets/pf-logo.svg diff --git a/.github/workflows/promote.yml b/.github/workflows/promote.yml index ed75b7ed813..8386cc2a3ad 100644 --- a/.github/workflows/promote.yml +++ b/.github/workflows/promote.yml @@ -23,6 +23,6 @@ jobs: - name: Install deps run: yarn install --frozen-lockfile - name: Build dist - run: yarn build && yarn build:umd && yarn clean:exports + run: yarn build && yarn build:umd - name: Deploy to NPM and Github run: .github/promote.sh diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 074954e5150..4ee8a21051c 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -26,9 +26,9 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' @@ -70,9 +70,9 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' @@ -110,9 +110,9 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' @@ -159,9 +159,9 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' @@ -219,9 +219,9 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' @@ -275,9 +275,9 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' @@ -319,7 +319,7 @@ jobs: - uses: actions/checkout@v2 with: token: ${{ secrets.GH_TOKEN_REDALLEN }} # needs to be an admin token to get around branch protection - fetch-depth: "0" + fetch-depth: '0' - run: git fetch --depth=1 origin +refs/tags/*:refs/tags/* - uses: actions/setup-node@v1 with: @@ -329,14 +329,14 @@ jobs: name: Cache npm deps with: path: | - node_modules - **/node_modules - ~/.cache/Cypress + node_modules + **/node_modules + ~/.cache/Cypress key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }} - run: yarn install --frozen-lockfile if: steps.yarn-cache.outputs.cache-hit != 'true' - name: Build dist - run: yarn build && yarn build:umd && yarn clean:exports + run: yarn build && yarn build:umd if: steps.dist.outputs.cache-hit != 'true' - name: Deploy to NPM and Github run: .github/release.sh diff --git a/packages/react-core/src/demos/index.ts b/packages/react-core/src/demos/index.ts deleted file mode 100644 index e10143716db..00000000000 --- a/packages/react-core/src/demos/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './DashboardHeader'; -export * from './DashboardWrapper'; diff --git a/packages/react-core/src/index.ts b/packages/react-core/src/index.ts index e3a0874b4c1..ee4d9c1c752 100644 --- a/packages/react-core/src/index.ts +++ b/packages/react-core/src/index.ts @@ -1,5 +1,4 @@ export * from './components'; -export * from './demos'; export * from './layouts'; export * from './helpers'; export * from './styles'; diff --git a/packages/react-table/src/demos/DashboardHeader.tsx b/packages/react-table/src/demos/DashboardHeader.tsx new file mode 100644 index 00000000000..646d0ca3054 --- /dev/null +++ b/packages/react-table/src/demos/DashboardHeader.tsx @@ -0,0 +1,198 @@ +import React, { useState } from 'react'; +import { + Avatar, + Brand, + Button, + ButtonVariant, + Divider, + Dropdown, + DropdownGroup, + DropdownItem, + DropdownList, + Masthead, + MastheadToggle, + MastheadMain, + MastheadBrand, + MastheadContent, + MenuToggle, + Toolbar, + ToolbarContent, + ToolbarGroup, + ToolbarItem, + PageToggleButton +} from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; +import CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon'; +import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon'; +import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; +import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon'; +import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; +import imgAvatar from '@patternfly/react-table/src/demos/assets/avatarImg.svg'; +import pfLogo from '@patternfly/react-table/src/demos/assets/pf-logo.svg'; + +interface DashboardHeaderProps { + /** Render custom notification badge */ + notificationBadge?: React.ReactNode; +} + +export const DashboardHeader: React.FC = ({ notificationBadge }) => { + const [isDropdownOpen, setIsDropdownOpen] = useState(false); + const [isKebabDropdownOpen, setIsKebabDropdownOpen] = useState(false); + const [isFullKebabDropdownOpen, setIsFullKebabDropdownOpen] = useState(false); + + const kebabDropdownItems = ( + <> + + Settings + + + Help + + + ); + + const userDropdownItems = ( + <> + My profile + User management + Logout + + ); + + const onDropdownToggle = () => { + setIsDropdownOpen(!isDropdownOpen); + }; + + const onDropdownSelect = () => { + setIsDropdownOpen(false); + }; + + const onKebabDropdownToggle = () => { + setIsKebabDropdownOpen(!isKebabDropdownOpen); + }; + + const onKebabDropdownSelect = () => { + setIsKebabDropdownOpen(false); + }; + + const onFullKebabToggle = () => { + setIsFullKebabDropdownOpen(!isFullKebabDropdownOpen); + }; + + const onFullKebabSelect = () => { + setIsFullKebabDropdownOpen(false); + }; + + return ( + + + + + + + + + + + + + + + + {notificationBadge ?? ( + +