Merge branch 'main' into feature/infinite-scroll-page-loading-table

.eslintrc.json

@@ -28,6 +28,24 @@
         "linebreak-style": ["error", "unix"],
         "quotes": ["error", "single"],
         "semi": ["error", "never"],
+        "import/order": [
+          "error",
+          {
+            "groups": [
+              "builtin",
+              "external",
+              "internal",
+              "parent",
+              "sibling",
+              "index"
+            ],
+            "alphabetize": {
+              "order": "asc",
+              "caseInsensitive": true
+            },
+            "newlines-between": "never"
+          }
+        ],
         "comma-dangle": 0,
         "react/react-in-jsx-scope": 0,
         "@typescript-eslint/comma-dangle": 0,

.github/workflows/dependencies.yaml

@@ -32,7 +32,7 @@ jobs:
 
     steps:
       - name: Set up JDK 17
-        uses: actions/setup-java@6a0805fcefea3d4657a47ac4c165951e33482018 # v4.2.2
+        uses: actions/setup-java@2dfa2011c5b2a0f1489bf9e433881c92c1631f88 # v4.3.0
         with:
           distribution: 'temurin'
           java-version: '17'

CHANGELOG.md

@@ -1,14 +1,26 @@
 # Changelog
 
-## [3.5.1](https://github.com/eclipse-tractusx/portal-shared-components/compare/v3.5.0...v3.5.1) (2024-09-05)
+## [3.5.2](https://github.com/eclipse-tractusx/portal-shared-components/compare/v3.5.1...v3.5.2) (2024-09-13)
+
+### Bug Fixes
 
+- **carousel:** handle infinite scroll with a single child element ([6a3a2aa](https://github.com/eclipse-tractusx/portal-shared-components/commit/6a3a2aab4a9ad6b3c09d90dc7bbf02cd2d63b73b))
+- Fix 401 Unauthorized Error on App Image Click in App Details ([3d52a38](https://github.com/eclipse-tractusx/portal-shared-components/commit/3d52a385fb2fdff3a99b0412b38233b40b686da6))
+- **new toggle switch:** default text removed and ui issue fixed ([625ce3d](https://github.com/eclipse-tractusx/portal-shared-components/commit/625ce3daae808087d789edee39afed63d08ed6f9))
+- **new toggle switch:** default text removed and ui issue fixed on hard reload ([2f0bd8f](https://github.com/eclipse-tractusx/portal-shared-components/commit/2f0bd8f922d54cd712a6d2fe99b57d26072ead9f))
+- Remove redundant else & changelog entry ([7bc47bd](https://github.com/eclipse-tractusx/portal-shared-components/commit/7bc47bdd3d65cbb155d319b711a4ada9eea401b2))
+- remove version bump and changelog messages ([115dc7a](https://github.com/eclipse-tractusx/portal-shared-components/commit/115dc7a0826c2e41cb83ab819037de8c785d1534))
+- Resolve App details image duplications ([f39c355](https://github.com/eclipse-tractusx/portal-shared-components/commit/f39c35596fcc535d3a7627bb91985a6a46e10969))
+- update useEffect dependency, handleChange ([aac007d](https://github.com/eclipse-tractusx/portal-shared-components/commit/aac007de32aa1ab58f6e3914e4cb92e006239a33))
+
+## [3.5.1](https://github.com/eclipse-tractusx/portal-shared-components/compare/v3.5.0...v3.5.1) (2024-09-05)
 
 ### Bug Fixes
 
-* **chor:** pretty ([b8c5264](https://github.com/eclipse-tractusx/portal-shared-components/commit/b8c5264ec5d442bd8d06459b7347e5591c1d8c7b))
-* **chor:** update version number ([3f03f0e](https://github.com/eclipse-tractusx/portal-shared-components/commit/3f03f0e8a01dcce597e6916fd8c882f630d5a490))
-* **table:** add new props to support multiple buttons in table component ([e0e7271](https://github.com/eclipse-tractusx/portal-shared-components/commit/e0e72713bc00523dcb11e0810c97ab702c6b87af))
-* **table:** support buttons props ([9ea1295](https://github.com/eclipse-tractusx/portal-shared-components/commit/9ea12951b17a737332b25018e10d78517cba499f))
+- **chor:** pretty ([b8c5264](https://github.com/eclipse-tractusx/portal-shared-components/commit/b8c5264ec5d442bd8d06459b7347e5591c1d8c7b))
+- **chor:** update version number ([3f03f0e](https://github.com/eclipse-tractusx/portal-shared-components/commit/3f03f0e8a01dcce597e6916fd8c882f630d5a490))
+- **table:** add new props to support multiple buttons in table component ([e0e7271](https://github.com/eclipse-tractusx/portal-shared-components/commit/e0e72713bc00523dcb11e0810c97ab702c6b87af))
+- **table:** support buttons props ([9ea1295](https://github.com/eclipse-tractusx/portal-shared-components/commit/9ea12951b17a737332b25018e10d78517cba499f))
 
 ## [3.5.0](https://github.com/eclipse-tractusx/portal-shared-components/compare/v3.4.0...v3.5.0) (2024-09-03)
 
@@ -39,6 +51,8 @@
 - **chor:** update deoendency file ([bb45f76](https://github.com/eclipse-tractusx/portal-shared-components/commit/bb45f761102e442fd727b10f5a1d0362a0f124cf))
 - **chro:** update the package version ([506dc70](https://github.com/eclipse-tractusx/portal-shared-components/commit/506dc709a28e19cbfc2dd6ea38f3af60ed3ef74c))
 
+- **ImageGallery:** Fix 401 Unauthorized error when clicking on App Images ([#291](https://github.com/eclipse-tractusx/portal-shared-components/issues/291))
+
 ## [3.3.0](https://github.com/eclipse-tractusx/portal-shared-components/compare/v3.2.0...v3.3.0) (2024-08-23)
 
 ### Features

DEPENDENCIES

@@ -527,7 +527,7 @@ npm/npmjs/-/pkg-dir/3.0.0, MIT, approved, clearlydefined
 npm/npmjs/-/pkg-dir/4.2.0, MIT, approved, clearlydefined
 npm/npmjs/-/polished/4.3.1, MIT AND (BSD-2-Clause AND BSD-3-Clause AND ISC AND MIT) AND BSD-3-Clause AND OFL-1.1, approved, #14008
 npm/npmjs/-/possible-typed-array-names/1.0.0, MIT, approved, clearlydefined
-npm/npmjs/-/postcss/8.4.41, MIT, approved, #3545
+npm/npmjs/-/postcss/8.4.45, MIT, approved, #3545
 npm/npmjs/-/prelude-ls/1.2.1, MIT, approved, clearlydefined
 npm/npmjs/-/prettier/3.3.3, MIT AND BSD-2-Clause AND ISC AND MPL-1.0, approved, #15480
 npm/npmjs/-/pretty-format/27.5.1, 0BSD AND Apache-2.0 AND BSD-2-Clause AND MIT, approved, #1948
@@ -726,7 +726,7 @@ npm/npmjs/-/validator/13.11.0, MIT, approved, clearlydefined
 npm/npmjs/-/vary/1.1.2, MIT, approved, clearlydefined
 npm/npmjs/-/vite-plugin-dts/3.7.3, MIT, approved, #14014
 npm/npmjs/-/vite-plugin-lib-inject-css/2.0.1, MIT, approved, #14016
-npm/npmjs/-/vite/5.4.2, MIT AND (ISC AND MIT) AND (Apache-2.0 AND BSD-2-Clause AND BlueOak-1.0.0 AND CC0-1.0 AND ISC AND MIT) AND (BSD-3-Clause AND MIT) AND ISC AND (BSD-2-Clause AND BSD-3-Clause), approved, #15844
+npm/npmjs/-/vite/5.4.3, MIT AND (ISC AND MIT) AND (Apache-2.0 AND BSD-2-Clause AND BlueOak-1.0.0 AND CC0-1.0 AND ISC AND MIT) AND (BSD-3-Clause AND MIT) AND ISC AND (BSD-2-Clause AND BSD-3-Clause), approved, #15844
 npm/npmjs/-/void-elements/3.1.0, MIT, approved, clearlydefined
 npm/npmjs/-/vue-template-compiler/2.7.16, 0BSD AND MIT AND MIT, approved, #3476
 npm/npmjs/-/vue-tsc/1.8.27, MIT, approved, clearlydefined

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@catena-x/portal-shared-components",
-  "version": "3.5.1",
+  "version": "3.5.2",
   "description": "Catena-X Portal Shared Components",
   "author": "Catena-X Contributors",
   "license": "Apache-2.0",

src/components/basic/Alert/Alert.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { Alert as Component } from '.'
 
 export default {

src/components/basic/BaseImage/BaseImage.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { BaseImage as Component } from '.'
 
 export default {

src/components/basic/BaseImage/index.tsx

@@ -18,8 +18,8 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { Box } from '@mui/material'
 import { Buffer } from 'buffer'
+import { Box } from '@mui/material'
 
 interface BaseImageProps {
   image: string

src/components/basic/Breadcrumb/Breadcrumb.stories.tsx

@@ -20,7 +20,6 @@
 
 import { Link, Typography } from '@mui/material'
 import { type ComponentStory } from '@storybook/react'
-
 import { Breadcrumb as Component } from '.'
 
 export default {

src/components/basic/Button/BackButton.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import type { ComponentStory } from '@storybook/react'
-
 import { BackButton as Component } from './BackButton'
 
 export default {

src/components/basic/Button/BackButton.tsx

@@ -18,8 +18,8 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { Button } from '.'
 import ArrowBackIcon from '@mui/icons-material/ArrowBack'
+import { Button } from '.'
 
 export interface BackButtonProps {
   backButtonLabel?: string

src/components/basic/Button/Button.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import type { Meta, StoryObj } from '@storybook/react'
-
 import { Button } from '.'
 
 const meta: Meta<typeof Button> = {

src/components/basic/Button/LoadMoreButton.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { LoadMoreButton as Component } from './LoadMoreButton'
 
 export default {

src/components/basic/Button/LoadMoreButton.tsx

@@ -18,9 +18,9 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
+import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline'
 import { type ButtonProps as MuiButtonProps } from '@mui/material/Button/Button'
 import { Button } from '.'
-import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline'
 
 export interface LoadMoreButtonProps
   extends Omit<MuiButtonProps, 'color' | 'variant' | 'size'> {

src/components/basic/Button/ScrollToTopButton.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { ScrollToTopButton as Component } from './ScrollToTopButton'
 
 export default {

src/components/basic/Button/ScrollToTopButton.tsx

@@ -17,9 +17,9 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { IconButton } from '../IconButton'
 import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'
 import { useMediaQuery } from '@mui/material'
+import { IconButton } from '../IconButton'
 
 export interface ScrollToTopButtonProps {
   onButtonClick: React.MouseEventHandler

src/components/basic/Carousel/Carousel.stories.tsx

@@ -19,9 +19,9 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-import { Carousel as Component } from '.'
-import { theme } from '../../../theme'
 import uniqueId from 'lodash/uniqueId'
+import { theme } from '../../../theme'
+import { Carousel as Component } from '.'
 
 export default {
   title: 'Carousel',

src/components/basic/Carousel/CarouselBox.stories.tsx

@@ -19,9 +19,9 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-import { CarouselBox as Component } from './CarouselBox'
-import { theme } from '../../../theme'
 import uniqueId from 'lodash/uniqueId'
+import { theme } from '../../../theme'
+import { CarouselBox as Component } from './CarouselBox'
 
 export default {
   title: 'Carousel',

src/components/basic/Carousel/CarouselBox.tsx

@@ -18,15 +18,15 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import React, { useState, Children, useEffect } from 'react'
-import Slider from 'react-slick'
-import ArrowForwardIcon from '@mui/icons-material/ArrowForward'
 import ArrowBackIcon from '@mui/icons-material/ArrowBack'
-import { IconButton } from '../IconButton'
+import ArrowForwardIcon from '@mui/icons-material/ArrowForward'
 import { Box } from '@mui/material'
 import uniqueId from 'lodash/uniqueId'
-import { Typography } from '../Typography'
+import React, { useState, Children, useEffect } from 'react'
+import Slider from 'react-slick'
 import { theme } from '../../../theme'
+import { IconButton } from '../IconButton'
+import { Typography } from '../Typography'
 import 'slick-carousel/slick/slick.css'
 import 'slick-carousel/slick/slick-theme.css'
 

src/components/basic/Carousel/index.tsx

@@ -18,14 +18,14 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { useState, Children, useEffect, useCallback } from 'react'
-import Slider from 'react-slick'
-import ArrowForwardIcon from '@mui/icons-material/ArrowForward'
 import ArrowBackIcon from '@mui/icons-material/ArrowBack'
-import { IconButton } from '../IconButton'
+import ArrowForwardIcon from '@mui/icons-material/ArrowForward'
 import { Box } from '@mui/material'
-import { theme } from '../../../theme'
 import uniqueId from 'lodash/uniqueId'
+import { useState, Children, useEffect, useCallback } from 'react'
+import Slider from 'react-slick'
+import { theme } from '../../../theme'
+import { IconButton } from '../IconButton'
 import 'slick-carousel/slick/slick.css'
 import 'slick-carousel/slick/slick-theme.css'
 import { type CarouselNavArrows } from './CarouselBox'
@@ -75,7 +75,7 @@ export const Carousel = ({
 }: CarouselProps) => {
   const [showArrows, setShowArrows] = useState(false)
   const onMouseEnter = () => {
-    setShowArrows(true)
+    setShowArrows(arrayChildren.length > 1)
   }
   const onMouseLeave = () => {
     setShowArrows(false)
@@ -155,7 +155,9 @@ export const Carousel = ({
 
   const settings = {
     dots,
-    infinite,
+    // @ref https://github.com/akiran/react-slick/issues/2093#issuecomment-1705213915
+    // Prevents broken UI by defaulting infinite scroll to false when only a single child element is present.
+    infinite: infinite && arrayChildren.length > 1,
     slidesToShow: responsiveSlides,
     slidesToScroll: responsiveSlides,
     swipeToSlide: false,

src/components/basic/CategoryDivider/CategoryDivider.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { CategoryDivider as Component } from '.'
 
 export default {

src/components/basic/Checkbox/Checkbox.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { Checkbox as Component } from '.'
 
 export default {

src/components/basic/Chip/DraggableChip.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { DraggableChip as Component } from './DraggableChip'
 
 export default {

src/components/basic/Chip/DraggableChip.tsx

@@ -18,8 +18,8 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { Box, type BoxProps, useTheme } from '@mui/material'
 import OpenWithIcon from '@mui/icons-material/OpenWith'
+import { Box, type BoxProps, useTheme } from '@mui/material'
 
 interface DraggableChipProps extends BoxProps {
   isSelected?: boolean

src/components/basic/Chip/TransitionChip.tsx

@@ -18,9 +18,9 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import MuiChip, { type ChipProps } from '@mui/material/Chip'
 import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'
 import HighlightOffIcon from '@mui/icons-material/HighlightOff'
+import MuiChip, { type ChipProps } from '@mui/material/Chip'
 import { useState } from 'react'
 import { theme } from '../../../theme'
 

src/components/basic/Chip/index.tsx

@@ -18,12 +18,12 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import MuiChip, { type ChipProps } from '@mui/material/Chip'
+import AutorenewIcon from '@mui/icons-material/Autorenew'
 import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'
 import HighlightOffIcon from '@mui/icons-material/HighlightOff'
-import { theme } from '../../../theme'
-import AutorenewIcon from '@mui/icons-material/Autorenew'
+import MuiChip, { type ChipProps } from '@mui/material/Chip'
 import React from 'react'
+import { theme } from '../../../theme'
 
 interface ChipCustomProps extends ChipProps {
   type?: 'decline' | 'confirm' | 'plain' | 'delete' | 'progress'

src/components/basic/CircularProgress/circularProgress.stories.tsx

@@ -19,7 +19,6 @@
  ********************************************************************************/
 
 import { type ComponentStory } from '@storybook/react'
-
 import { CircularProgress as Component } from '.'
 
 export default {

src/components/basic/CustomAccordion/CustomAccordion.stories.tsx

@@ -18,13 +18,13 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
+import HomeOutlinedIcon from '@mui/icons-material/HomeOutlined'
+import SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined'
 import { Box, Divider, Typography } from '@mui/material'
 import { type ComponentStory } from '@storybook/react'
-import { CustomAccordion as Component } from '.'
 import { Table } from '../StaticTable/StaticTable.stories'
 import { type CustomAccordionProps } from './Item'
-import HomeOutlinedIcon from '@mui/icons-material/HomeOutlined'
-import SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined'
+import { CustomAccordion as Component } from '.'
 
 export default {
   title: 'CustomAccordion',

src/components/basic/CustomAccordion/Item.tsx

@@ -18,12 +18,12 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import React from 'react'
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
+import { AccordionActions, Box, Button, Typography } from '@mui/material'
 import Accordion, { type AccordionProps } from '@mui/material/Accordion'
-import AccordionSummary from '@mui/material/AccordionSummary'
 import AccordionDetails from '@mui/material/AccordionDetails'
-import { AccordionActions, Box, Button, Typography } from '@mui/material'
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
+import AccordionSummary from '@mui/material/AccordionSummary'
+import React from 'react'
 
 export interface CustomAccordionProps extends AccordionProps {
   expanded: boolean | undefined

src/components/basic/Datepicker/Datepicker.stories.tsx

@@ -18,9 +18,8 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
-import { type ComponentStory } from '@storybook/react'
 import { Box } from '@mui/material'
-
+import { type ComponentStory } from '@storybook/react'
 import { Datepicker as Component, type DateType } from '.'
 
 export default {