diff --git a/web/src/components/DateTimePicker.tsx b/web/src/components/DateTimePicker.tsx
index 9178946a1..1b2768ba4 100644
--- a/web/src/components/DateTimePicker.tsx
+++ b/web/src/components/DateTimePicker.tsx
@@ -1,8 +1,15 @@
 import React, {useState} from 'react';
 import {DatePicker, TimePicker} from '@patternfly/react-core';
-import PropTypes from 'prop-types';
 
-export default function DateTimePicker(props) {
+interface DateTimePickerProps {
+  id?: string;
+  value: Date | null;
+  setValue: React.Dispatch<React.SetStateAction<Date | null>>;
+  futureDatesOnly?: boolean;
+  initialDate?: Date;
+}
+
+export default function DateTimePicker(props: DateTimePickerProps) {
   const {id, value, setValue, futureDatesOnly, initialDate} = props;
   const userLocale = navigator.language;
   const date = value ?? initialDate;
@@ -65,11 +72,3 @@ export default function DateTimePicker(props) {
     </span>
   );
 }
-
-DateTimePicker.propTypes = {
-  id: PropTypes.string,
-  value: PropTypes.instanceOf(Date),
-  setValue: PropTypes.func.isRequired,
-  futureDatesOnly: PropTypes.bool,
-  initialDate: PropTypes.instanceOf(Date),
-};
diff --git a/web/src/components/SystemStatusBanner.tsx b/web/src/components/SystemStatusBanner.tsx
index d8bea01ee..18b261235 100644
--- a/web/src/components/SystemStatusBanner.tsx
+++ b/web/src/components/SystemStatusBanner.tsx
@@ -1,10 +1,15 @@
+import React from 'react';
 import {Banner, Flex, FlexItem} from '@patternfly/react-core';
 import {ExclamationTriangleIcon} from '@patternfly/react-icons';
 import {useQuayState} from 'src/hooks/UseQuayState';
 import {useQuayConfig} from 'src/hooks/UseQuayConfig';
-import PropTypes from 'prop-types';
 
-const BannerContent = ({icon, children}) => (
+interface BannerContentProps {
+  icon: React.ReactNode;
+  children: React.ReactNode;
+}
+
+const BannerContent: React.FC<BannerContentProps> = ({icon, children}) => (
   <Flex
     spaceItems={{default: 'spaceItemsSm'}}
     justifyContent={{default: 'justifyContentCenter'}}
@@ -15,11 +20,6 @@ const BannerContent = ({icon, children}) => (
   </Flex>
 );
 
-BannerContent.propTypes = {
-  icon: PropTypes.node.isRequired,
-  children: PropTypes.node.isRequired,
-};
-
 export default function SystemStatusBanner() {
   const {inReadOnlyMode, inAccountRecoveryMode} = useQuayState();
   const config = useQuayConfig();