diff --git a/web/src/components/core/EmptyState.jsx b/web/src/components/core/EmptyState.tsx
similarity index 77%
rename from web/src/components/core/EmptyState.jsx
rename to web/src/components/core/EmptyState.tsx
index 056ca56e8a..49451b9c1f 100644
--- a/web/src/components/core/EmptyState.jsx
+++ b/web/src/components/core/EmptyState.tsx
@@ -20,8 +20,6 @@
  * find current contact information at www.suse.com.
  */
 
-// @ts-check
-
 import React from "react";
 import {
   EmptyState,
@@ -30,14 +28,21 @@ import {
   Stack,
   EmptyStateFooter,
   EmptyStateActions,
+  EmptyStateProps,
+  EmptyStateHeaderProps,
 } from "@patternfly/react-core";
 import { Icon } from "~/components/layout";
+import { IconProps } from "../layout/Icon";
 
-/**
- * @typedef {import("~/components/layout/Icon").IconName} IconName
- * @typedef {import("@patternfly/react-core").EmptyStateProps} EmptyStateProps
- * @typedef {import("@patternfly/react-core").EmptyStateHeaderProps} EmptyStateHeaderProps
- */
+type EmptyStateWrapperProps = {
+  title: string;
+  icon: IconProps["name"];
+  color?: string;
+  headingLevel?: EmptyStateHeaderProps["headingLevel"];
+  noPadding?: boolean;
+  actions?: React.ReactNode;
+  children?: React.ReactNode;
+};
 
 /**
  * Convenient wrapper for easing the use of PF/EmptyState component
@@ -46,15 +51,6 @@ import { Icon } from "~/components/layout";
  * directly when dealing with a very specific UI use case and more freedom is
  * needed.
  *
- * @param {object} props
- * @param {string} props.title
- * @param {IconName} props.icon
- * @param {string} [props.color="color-100"]
- * @param {EmptyStateHeaderProps["headingLevel"]} [props.headingLevel="h4"]
- * @param {boolean} [props.noPadding=false]
- * @param {React.ReactNode} [props.actions]
- * @param {React.ReactNode} [props.children]
- * @param {EmptyStateProps} [props.rest]
  * @todo write documentation
  */
 export default function EmptyStateWrapper({
@@ -66,7 +62,7 @@ export default function EmptyStateWrapper({
   actions,
   children,
   ...rest
-}) {
+}: Partial<EmptyStateProps> & EmptyStateWrapperProps) {
   // @ts-ignore
   if (noPadding) rest.className = [rest.className, "no-padding"].join(" ").trim();
 
diff --git a/web/src/components/layout/Icon.tsx b/web/src/components/layout/Icon.tsx
index acab440e37..6612381b44 100644
--- a/web/src/components/layout/Icon.tsx
+++ b/web/src/components/layout/Icon.tsx
@@ -152,7 +152,7 @@ const icons = {
 
 const PREDEFINED_SIZES = ["xxxs", "xxs", "xs", "s", "m", "l", "xl", "xxl", "xxxl"];
 
-type IconProps = React.SVGAttributes<SVGElement> & {
+export type IconProps = React.SVGAttributes<SVGElement> & {
   /** Name of the desired icon */
   name: keyof typeof icons;
   /** Size used for both, width and height.It can be a CSS unit or one of PREDEFINED_SIZES */
diff --git a/web/src/components/storage/zfcp/ZFCPPage.tsx b/web/src/components/storage/zfcp/ZFCPPage.tsx
index 8eea02ee79..5eeaa53ba8 100644
--- a/web/src/components/storage/zfcp/ZFCPPage.tsx
+++ b/web/src/components/storage/zfcp/ZFCPPage.tsx
@@ -84,7 +84,6 @@ const NoDisksFound = () => {
     <EmptyState
       title={_("No zFCP disks found.")}
       icon="warning"
-      // @ts-expect-error: core/EmptyState props are not well defined
       variant="sm"
       actions={
         activeController && (