diff --git a/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.styled.jsx b/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.styled.tsx
similarity index 94%
rename from frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.styled.jsx
rename to frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.styled.tsx
index 4d10462a85db7afa31e433a4290830c19cbb3fbf..e1c7f99ab3d0891013661bdd88104cc959438d4d 100644
--- a/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.styled.jsx
+++ b/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.styled.tsx
@@ -44,6 +44,6 @@ Toggle.propTypes = {
   onClick: PropTypes.func.isRequired,
 };
 
-export function Toggle({ onClick }) {
+export function Toggle({ onClick }: { onClick: () => void }) {
   return <ToggleButton onClick={onClick}>{t`More options`}</ToggleButton>;
 }
diff --git a/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.jsx b/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.tsx
similarity index 69%
rename from frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.jsx
rename to frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.tsx
index 0b7593e173e31d4df8a3d7da7b7f4215872c4688..bda38ef51e50126737305234dde17948246f5d0b 100644
--- a/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.jsx
+++ b/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.tsx
@@ -1,38 +1,43 @@
-import React from "react";
-import { PropTypes } from "prop-types";
+import React, { Key } from "react";
 import _ from "underscore";
 import { t } from "ttag";
 
 import { useToggle } from "metabase/hooks/use-toggle";
 import Filter from "metabase-lib/lib/queries/structured/Filter";
+import { RadioOption } from "metabase/core/components/Radio/Radio";
 
 import { Container, Toggle, FilterRadio } from "./BooleanPicker.styled";
 
-BooleanPicker.propTypes = {
-  className: PropTypes.string,
-  filter: PropTypes.instanceOf(Filter),
-  onFilterChange: PropTypes.func.isRequired,
-};
-
-const OPTIONS = [
+const OPTIONS: RadioOption<boolean>[] = [
   { name: t`true`, value: true },
   { name: t`false`, value: false },
 ];
-const EXPANDED_OPTIONS = [
+
+const EXPANDED_OPTIONS: RadioOption<string | boolean | any>[] = [
   { name: t`true`, value: true },
   { name: t`false`, value: false },
   { name: t`empty`, value: "is-null" },
   { name: t`not empty`, value: "not-null" },
 ];
 
-function BooleanPicker({ className, filter, onFilterChange }) {
+interface BooleanPickerProps {
+  className?: string;
+  filter: Filter;
+  onFilterChange: (filter: Filter) => void;
+}
+
+function BooleanPicker({
+  className,
+  filter,
+  onFilterChange,
+}: BooleanPickerProps) {
   const value = getValue(filter);
   const [isExpanded, { toggle }] = useToggle(!_.isBoolean(value));
 
-  const updateFilter = value => {
+  const updateFilter = (value: Key) => {
     if (_.isBoolean(value)) {
       onFilterChange(filter.setOperator("=").setArguments([value]));
-    } else {
+    } else if (typeof value === "string") {
       onFilterChange(filter.setOperator(value));
     }
   };
@@ -51,7 +56,7 @@ function BooleanPicker({ className, filter, onFilterChange }) {
   );
 }
 
-function getValue(filter) {
+function getValue(filter: Filter) {
   const operatorName = filter.operatorName();
   if (operatorName === "=") {
     const [value] = filter.arguments();
diff --git a/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.unit.spec.js b/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.unit.spec.tsx
similarity index 97%
rename from frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.unit.spec.js
rename to frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.unit.spec.tsx
index d5be9e50f485ab7e83fb1a28b86a76e308f4c1ac..c125e09a1f2397e82d56ce6e4b4e23593e67becc 100644
--- a/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.unit.spec.js
+++ b/frontend/src/metabase/query_builder/components/filters/pickers/BooleanPicker/BooleanPicker.unit.spec.tsx
@@ -1,3 +1,5 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-nocheck
 import React from "react";
 import { render, screen } from "@testing-library/react";