diff --git a/.storybook/mockData/generateMessageItems.tsx b/.storybook/mockData/generateMessageItems.tsx
index 0995607b9fc..1cbae6ff3f9 100644
--- a/.storybook/mockData/generateMessageItems.tsx
+++ b/.storybook/mockData/generateMessageItems.tsx
@@ -24,22 +24,6 @@ const informationMessageItems = (count) => {
));
};
-const successMessageItems = (count) => {
- if (!count) {
- return [];
- }
- return new Array(count).fill('').map((_, index) => (
-
- {LoremIpsum}
-
- ));
-};
-
const warningMessageItems = (count) => {
if (!count) {
return [];
@@ -75,6 +59,5 @@ const errorMessageItems = (count) => {
export const generateMessageItems = (numberOfMessageTypes) => [
...informationMessageItems(numberOfMessageTypes.information),
...warningMessageItems(numberOfMessageTypes.warning),
- ...successMessageItems(numberOfMessageTypes.success),
...errorMessageItems(numberOfMessageTypes.error)
];
diff --git a/packages/main/src/components/MessageView/MessageView.stories.tsx b/packages/main/src/components/MessageView/MessageView.stories.tsx
index 196ad5fcec3..18f43be6a4d 100644
--- a/packages/main/src/components/MessageView/MessageView.stories.tsx
+++ b/packages/main/src/components/MessageView/MessageView.stories.tsx
@@ -13,7 +13,6 @@ import type {
import { Bar } from '../../webComponents/Bar/index.js';
import { Button } from '../../webComponents/Button/index.js';
import { Dialog as OriginalDialog } from '../../webComponents/Dialog';
-import { Link } from '../../webComponents/Link/index.js';
import { ResponsivePopover as OriginalResponsivePopover } from '../../webComponents/ResponsivePopover';
import { Title } from '../../webComponents/Title/index.js';
import { FlexBox } from '../FlexBox/index.js';
@@ -60,16 +59,6 @@ const meta = {
>
First Error Message Description.
,
-
- This is a success message! You can even use{' '}
- links here.
- ,
{
+interface Types {
+ icon: string;
+ i18nLabel: { key: string; defaultText: string };
+}
+
+const getTypes = (type: MessageViewButtonProptypes['type']): Types => {
switch (type) {
case ValueState.Error:
- return errorIcon;
+ return { icon: errorIcon, i18nLabel: ERROR_TYPE };
case ValueState.Success:
- return sysEnter2Icon;
+ return { icon: sysEnter2Icon, i18nLabel: WARNING_TYPE };
case ValueState.Warning:
- return alertIcon;
+ return { icon: alertIcon, i18nLabel: INFORMATION_TYPE };
default:
- return informationIcon;
+ return { icon: informationIcon, i18nLabel: SUCCESS_TYPE };
}
};
@@ -45,13 +51,23 @@ const getIcon = (type) => {
* The `MessageViewButton` can be used for opening a `Popover` containing the `MessageView` component. It should always reflect the message `type` with the highest severity.
*/
const MessageViewButton = forwardRef((props, ref) => {
- const { type = ValueState.Error, counter, className, ...rest } = props;
+ const { type = ValueState.Error, counter, className, tooltip, accessibleName, ...rest } = props;
useStylesheet(styleData, MessageViewButton.displayName);
const classes = clsx(classNames.btn, className);
- const icon = getIcon(type);
+ const { icon, i18nLabel } = getTypes(type);
+ const i18nBundle = useI18nBundle('@ui5/webcomponents-react');
+ const label = i18nBundle.getText(i18nLabel);
return (
-