fix: Replace raw "in" operator checks with type guards in property-filter (#4304)

Author: Who-is-PS

src/property-filter/controller.ts

@@ -21,6 +21,7 @@ import {
   TokenGroup,
 } from './interfaces';
 import {
+  isInternalToken,
   matchFilteringProperty,
   matchOperator,
   matchOperatorPrefix,
@@ -46,7 +47,7 @@ export const getQueryActions = ({
 }) => {
   const setQuery = (query: InternalQuery) => {
     function transformToken(token: InternalToken | InternalTokenGroup): Token | TokenGroup {
-      if ('operator' in token) {
+      if (isInternalToken(token)) {
         return matchTokenValue(token, filteringOptions);
       }
       return { ...token, tokens: token.tokens.map(transformToken) };

src/property-filter/filter-options.ts

@@ -27,7 +27,8 @@ export function filterOptions(
 }
 
 function isGroup(optionOrGroup: AutosuggestProps.Option): optionOrGroup is AutosuggestProps.OptionGroup {
-  return 'options' in optionOrGroup;
+  const key: keyof AutosuggestProps.OptionGroup = 'options';
+  return key in optionOrGroup;
 }
 
 function matchSingleOption(option: OptionDefinition, searchText: string): boolean {

src/property-filter/internal.tsx

@@ -161,7 +161,11 @@ const PropertyFilterInternal = React.forwardRef(
         tokenOrGroup: Token | TokenGroup,
         standaloneIndex?: number
       ): InternalToken | InternalTokenGroup {
-        return 'operation' in tokenOrGroup
+        const isTokenGroup = (t: Token | TokenGroup): t is TokenGroup => {
+          const key: keyof TokenGroup = 'operation';
+          return key in t;
+        };
+        return isTokenGroup(tokenOrGroup)
           ? {
               operation: tokenOrGroup.operation,
               tokens: tokenOrGroup.tokens.map(token => transformToken(token)),

src/property-filter/token.tsx

@@ -23,7 +23,7 @@ import {
   LoadItemsDetail,
 } from './interfaces';
 import { TokenEditor } from './token-editor';
-import { tokenGroupToTokens } from './utils';
+import { isInternalToken, isInternalTokenGroup, tokenGroupToTokens } from './utils';
 
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
@@ -71,20 +71,24 @@ export const TokenButton = ({
 }: TokenProps) => {
   const tokenRef = useRef<FilteringTokenRef>(null);
 
-  const hasGroups = query.tokens.some(tokenOrGroup => 'operation' in tokenOrGroup);
+  const hasGroups = query.tokens.some(isInternalTokenGroup);
   const first = tokenIndex === 0;
 
   const tokenOrGroup = query.tokens[tokenIndex];
   const tokens = tokenGroupToTokens<InternalToken>([tokenOrGroup]).map(t => ({ ...t, standaloneIndex: undefined }));
   const operation = query.operation;
-  const groupOperation = 'operation' in tokenOrGroup ? tokenOrGroup.operation : operation === 'and' ? 'or' : 'and';
+  const groupOperation = isInternalTokenGroup(tokenOrGroup)
+    ? tokenOrGroup.operation
+    : operation === 'and'
+      ? 'or'
+      : 'and';
 
   const [tempTokens, setTempTokens] = useState<InternalToken[]>(tokens);
   const capturedTokenIndices = tempTokens.map(token => token.standaloneIndex).filter(index => index !== undefined);
   const tokensToCapture: InternalToken[] = [];
   for (let index = 0; index < query.tokens.length; index++) {
     const token = query.tokens[index];
-    if ('operator' in token && token !== tokenOrGroup && !capturedTokenIndices.includes(index)) {
+    if (isInternalToken(token) && token !== tokenOrGroup && !capturedTokenIndices.includes(index)) {
       tokensToCapture.push(token);
     }
   }

src/property-filter/utils.ts

@@ -6,9 +6,22 @@ import {
   InternalFilteringOption,
   InternalFilteringProperty,
   InternalToken,
+  InternalTokenGroup,
   Token,
 } from './interfaces';
 
+export function isInternalToken(tokenOrGroup: InternalToken | InternalTokenGroup): tokenOrGroup is InternalToken {
+  const key: keyof InternalToken = 'operator';
+  return key in tokenOrGroup;
+}
+
+export function isInternalTokenGroup(
+  tokenOrGroup: InternalToken | InternalTokenGroup
+): tokenOrGroup is InternalTokenGroup {
+  const key: keyof InternalTokenGroup = 'operation';
+  return key in tokenOrGroup;
+}
+
 // Finds the longest property the filtering text starts from.
 export function matchFilteringProperty(
   filteringProperties: readonly InternalFilteringProperty[],
@@ -137,17 +150,22 @@ interface AbstractTokenGroup<T extends AbstractToken> {
   tokens: readonly (T | AbstractTokenGroup<T>)[];
 }
 
+function isAbstractToken<T extends AbstractToken>(tokenOrGroup: T | AbstractTokenGroup<T>): tokenOrGroup is T {
+  const key: keyof AbstractToken = 'operator';
+  return key in tokenOrGroup;
+}
+
 /**
  * Transforms query token groups to tokens (only taking 1 level of nesting).
  */
 export function tokenGroupToTokens<T extends AbstractToken>(tokenGroups: readonly (T | AbstractTokenGroup<T>)[]): T[] {
   const tokens: T[] = [];
   for (const tokenOrGroup of tokenGroups) {
-    if ('operator' in tokenOrGroup) {
+    if (isAbstractToken(tokenOrGroup)) {
       tokens.push(tokenOrGroup);
     } else {
       for (const nestedTokenOrGroup of tokenOrGroup.tokens) {
-        if ('operator' in nestedTokenOrGroup) {
+        if (isAbstractToken(nestedTokenOrGroup)) {
           tokens.push(nestedTokenOrGroup);
         } else {
           // Ignore deeply nested tokens