How to use the @commercetools-frontend/constants.NOTIFICATION_DOMAINS.SIDE function in @commercetools-frontend/constants

beforeEach(() => {
        mocked(useSelector).mockClear();
        mocked(useSelector).mockReturnValue([
          {
            id: 1,
            domain: NOTIFICATION_DOMAINS.SIDE,
            kind: NOTIFICATION_KINDS_SIDE.error,
            text: 'Something went wrong',
          },
        ]);
        rendered = renderComponent(
          
        );
      });
      it('should render the GenericNotification notification component', async () => {

it('should dispatch notification when component renders, then remove the notification when component is removed', async () => {
    rendered = render(
      
        
      
    );
    await waitForElement(() => rendered.getByText('Open'));
    fireEvent.click(rendered.getByText('Open'));

    await wait(() => {
      expect(showNotification).toHaveBeenCalledWith(
        expect.objectContaining({
          domain: NOTIFICATION_DOMAINS.SIDE,
          kind: NOTIFICATION_KINDS_SIDE.success,
          text: 'foo',
        }),
        undefined

await wait(() => {
      expect(showNotification).toHaveBeenCalledWith(
        expect.objectContaining({
          domain: NOTIFICATION_DOMAINS.SIDE,
          kind: NOTIFICATION_KINDS_SIDE.success,
          text: 'foo',
        }),
        undefined
      );
      expect(dismiss).not.toHaveBeenCalled();
    });

beforeEach(() => {
        mocked(useSelector).mockClear();
        mocked(useSelector).mockReturnValue([
          {
            id: 1,
            domain: NOTIFICATION_DOMAINS.SIDE,
            kind: NOTIFICATION_KINDS_SIDE.error,
            text: 'Something went wrong',
          },
        ]);
        rendered = renderComponent(
          
        );
      });
      it('should render the GenericNotification notification component', async () => {

const createTestProps = (
  props: Partial = {}
) => ({
  children: ,
  domain: NOTIFICATION_DOMAINS.SIDE,
  type: NOTIFICATION_KINDS_SIDE.warning,
  onCloseClick: jest.fn(),
  ...props,
});

const NotificationsList = (props: Props) => {
  switch (props.domain) {
    case NOTIFICATION_DOMAINS.GLOBAL:
      return ;
    case NOTIFICATION_DOMAINS.PAGE:
      return ;
    case NOTIFICATION_DOMAINS.SIDE:
      return ;
    default:
      return null;
  }
};
NotificationsList.displayName = 'NotificationsList';

const getStylesForContent = (props: StyleProps) => {
  const fontColor =
    props.domain === NOTIFICATION_DOMAINS.SIDE
      ? customProperties.colorSolid
      : customProperties.colorSurface;
  return css`
    flex-basis: 100%;
    flex-grow: 1;
    padding: 0 ${customProperties.spacingS};
    margin: 0;
    font-size: ${props.domain === NOTIFICATION_DOMAINS.SIDE
      ? '0.929rem'
      : 'inherit'};

    color: ${fontColor};

    p,
    a {
      color: ${fontColor};
    }
    ul {
      padding: 0;
      margin: 0;
      list-style: none;
    }
  `;
};

width: 100%;
    z-index: 10000;
  `;

  switch (props.domain) {
    case NOTIFICATION_DOMAINS.GLOBAL:
      return css`
        ${baseStyles};
        text-align: center;
        width: 100% !important;
      `;
    case NOTIFICATION_DOMAINS.PAGE:
      return css`
        ${baseStyles};
      `;
    case NOTIFICATION_DOMAINS.SIDE:
      return css`
        ${baseStyles};
        position: absolute;
        text-align: left;
        height: 0;
        overflow: visible;
      `;
    default:
      return css``;
  }
};

const getStylesForContent = (props: StyleProps) => {
  const fontColor =
    props.domain === NOTIFICATION_DOMAINS.SIDE
      ? customProperties.colorSolid
      : customProperties.colorSurface;
  return css`
    flex-basis: 100%;
    flex-grow: 1;
    padding: 0 ${customProperties.spacingS};
    margin: 0;
    font-size: ${props.domain === NOTIFICATION_DOMAINS.SIDE
      ? '0.929rem'
      : 'inherit'};

    color: ${fontColor};

    p,
    a {
      color: ${fontColor};

const Notification = (props: Props) => {
  const intl = useIntl();
  return (
    <div>
      <div>{props.children}</div>
      {props.onCloseClick ? (
        <div>
          }
            size="medium"
          /&gt;
        </div>
      ) : null}
      {props.domain === NOTIFICATION_DOMAINS.SIDE ? (
        <div>
          
        </div>
      ) : null}
    </div>
  );
};
Notification.displayName = 'Notification';