Merge branch 'master' into production

app/src/components/features/rules/RuleBuilder/actions/index.js

@@ -58,6 +58,7 @@ export const initiateBlankCurrentlySelectedRule = (
  pairs: [],
  ruleType: RULE_TYPE_TO_CREATE,
  status: GLOBAL_CONSTANTS.RULE_STATUS.INACTIVE,
+ schemaVersion: "3.0.0",
  ...extraRuleConfig,
  };
 

app/src/components/features/rules/RulePairs/Filters/actions/deleteObjectAtPath.js

@@ -8,7 +8,9 @@ const deleteObjectAtPath = (currentlySelectedRuleData, setCurrentlySelectedRule,
  if (typeof targetPath === "string") {
  setCurrentlySelectedRule(dispatch, omit(copyOfCurrentlySelectedRule, [`pairs[${pairIndex}].${targetPath}`]), true);
  } else {
- let arrayOfCompleteTargetPaths = targetPath.map((targetPath) => `pairs[${pairIndex}].${targetPath}`);
+ let arrayOfCompleteTargetPaths = targetPath.map(
+ (_targetPath) => `pairs[${pairIndex}].${getFilterObjectPath(_targetPath)}`
+ );
  setCurrentlySelectedRule(dispatch, omit(copyOfCurrentlySelectedRule, arrayOfCompleteTargetPaths), true);
  }
 };

app/src/components/features/rules/RulePairs/Filters/index.jsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useMemo } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import ReactSelect from "react-select";
-import { Button, Modal, Row, Col, Input, Typography, Dropdown, Menu } from "antd";
+import { Button, Modal, Row, Col, Input, Typography } from "antd";
 //UTILITIES
 import { getCurrentlySelectedRuleData } from "../../../../../store/selectors";
 //EXTERNALS
@@ -11,21 +11,22 @@ import APP_CONSTANTS from "config/constants";
 import deleteObjectAtPath from "./actions/deleteObjectAtPath";
 import getObjectValue from "./actions/getObjectValue";
 import { getReactSelectValue, setReactSelectValue } from "./actions/reactSelect";
-import { CloseCircleOutlined, DownOutlined } from "@ant-design/icons";
+import { CloseCircleOutlined } from "@ant-design/icons";
 import { isDesktopMode } from "utils/AppUtils";
 import {
  trackPageUrlFilterModifiedEvent,
  trackResourceTypeFilterModifiedEvent,
  trackRequestMethodFilterModifiedEvent,
  trackRequestPayloadKeyFilterModifiedEvent,
  trackRequestPayloadValueFilterModifiedEvent,
+ trackPageDomainsFilterModifiedEvent,
 } from "modules/analytics/events/common/rules/filters";
 import { setCurrentlySelectedRule } from "../../RuleBuilder/actions";
 import { ResponseRuleResourceType } from "types/rules";
 import { debounce, snakeCase } from "lodash";
 import { actions } from "store";
 
-const { Text, Link } = Typography;
+const { Link } = Typography;
 
 const debouncedTrackPayloadKeyModifiedEvent = debounce(trackRequestPayloadKeyFilterModifiedEvent, 500);
 
@@ -55,21 +56,6 @@ const REQUEST_METHOD_OPTIONS = [
  { label: "HEAD", value: "HEAD" },
 ];
 
-const generatePlaceholderText = (operator) => {
- switch (operator) {
- case GLOBAL_CONSTANTS.RULE_OPERATORS.EQUALS:
- return "e.g. http://www.example.com";
- case GLOBAL_CONSTANTS.RULE_OPERATORS.CONTAINS:
- return "e.g. facebook";
- case GLOBAL_CONSTANTS.RULE_OPERATORS.WILDCARD_MATCHES:
- return "e.g. *://*.mydomain.com/*";
- case GLOBAL_CONSTANTS.RULE_OPERATORS.MATCHES:
- return "e.g. /example-([0-9]+)/ig";
- default:
- return "Select a condition first";
- }
-};
-
 const Filters = (props) => {
  const { pairIndex } = props;
 
@@ -95,25 +81,6 @@ const Filters = (props) => {
  const isPayloadUrlFilterCompatible = !isResponseRule && !isRequestRule && !isDesktopMode();
  const isResourceTypeFilterCompatible = !isResponseRule && !isRequestRule && !isDesktopMode(); // this partially works on desktop
 
- const getCurrentPageURLOperatorText = () => {
- switch (
- getObjectValue(currentlySelectedRuleData, pairIndex, APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_URL_OPERATOR)
- ) {
- case GLOBAL_CONSTANTS.RULE_OPERATORS.WILDCARD_MATCHES:
- return "Wildcard";
- case GLOBAL_CONSTANTS.RULE_OPERATORS.MATCHES:
- return "RegEx";
- case "":
- return "Select";
- default:
- return getObjectValue(
- currentlySelectedRuleData,
- pairIndex,
- APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_URL_OPERATOR
- );
- }
- };
-
  const clearRequestPayload = (value) => {
  if (value === "") {
  deleteObjectAtPath(
@@ -133,7 +100,12 @@ const Filters = (props) => {
  deleteObjectAtPath(
  currentlySelectedRuleData,
  setCurrentlySelectedRule,
- `source.filters.${filterToClear}`,
+ filterToClear === GLOBAL_CONSTANTS.RULE_SOURCE_FILTER_TYPES.PAGE_DOMAINS
+ ? [
+ `source.filters.${filterToClear}`,
+ `source.filters.${GLOBAL_CONSTANTS.RULE_SOURCE_FILTER_TYPES.PAGE_URL}`,
+ ]
+ : `source.filters.${filterToClear}`,
  pairIndex,
  dispatch
  );
@@ -149,6 +121,10 @@ const Filters = (props) => {
  LOG_ANALYTICS.PAGE_URL_MODIFIED = () => {
  trackPageUrlFilterModifiedEvent(currentlySelectedRuleData.ruleType);
  };
+
+ LOG_ANALYTICS.PAGE_DOMAINS_MODIFIED = () => {
+ trackPageDomainsFilterModifiedEvent(currentlySelectedRuleData.ruleType);
+ };
  LOG_ANALYTICS.RESOURCE_TYPE_MODIFIED = () => {
  trackResourceTypeFilterModifiedEvent(currentlySelectedRuleData.ruleType);
  };
@@ -168,20 +144,6 @@ const Filters = (props) => {
  );
  };
 
- const updateSourceOperator = useCallback(
- (operator) => {
- dispatch(
- actions.updateRulePairAtGivenPath({
- pairIndex,
- updates: {
- [APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_URL_OPERATOR]: operator,
- },
- })
- );
- },
- [dispatch, pairIndex]
- );
-
  const updateSourceRequestPayload = useCallback(
  (event, path) => {
  dispatch(
@@ -196,25 +158,6 @@ const Filters = (props) => {
  [dispatch, pairIndex]
  );
 
- const urlOperatorOptions = (
- <Menu>
- <Menu.Item key={1}>
- <span onClick={(e) => updateSourceOperator(GLOBAL_CONSTANTS.RULE_OPERATORS.EQUALS)}>Equals</span>
- </Menu.Item>
- <Menu.Item key={2}>
- <span onClick={(e) => updateSourceOperator(GLOBAL_CONSTANTS.RULE_OPERATORS.CONTAINS)}>Contains</span>
- </Menu.Item>
- <Menu.Item key={3}>
- <span onClick={(e) => updateSourceOperator(GLOBAL_CONSTANTS.RULE_OPERATORS.MATCHES)}>Matches (RegEx)</span>
- </Menu.Item>
- <Menu.Item key={4}>
- <span onClick={(e) => updateSourceOperator(GLOBAL_CONSTANTS.RULE_OPERATORS.WILDCARD_MATCHES)}>
- Matches (Wildcard)
- </span>
- </Menu.Item>
- </Menu>
- );
-
  const renderRequestPayloadInput = () => {
  return isRequestPayloadFilterCompatible ? (
  <Row
@@ -350,49 +293,39 @@ const Filters = (props) => {
  alignItems: "center",
  }}
  >
- <Col span={3}>
- <span>Page URL</span>
- </Col>
- <Col span={6} align="center">
- <Dropdown overlay={urlOperatorOptions} disabled={props.isInputDisabled}>
- <Text
- strong
- className="ant-dropdown-link cursor-pointer capitalize uppercase"
- onClick={(e) => {
- e.preventDefault();
- LOG_ANALYTICS.PAGE_URL_MODIFIED(e);
- }}
- >
- {getCurrentPageURLOperatorText()} <DownOutlined />
- </Text>
- </Dropdown>
- </Col>
- <Col span={12}>
- <Input
- placeholder={generatePlaceholderText(
- getObjectValue(
+ <>
+ <Col span={5}>
+ <span>Page Domain</span>
+ </Col>
+ <Col span={17}>
+ <Input
+ placeholder={"mydomain.com"}
+ name="description"
+ type="text"
+ value={getObjectValue(
  currentlySelectedRuleData,
  pairIndex,
- APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_URL_OPERATOR
- )
- )}
- name="description"
- type="text"
- value={getObjectValue(
- currentlySelectedRuleData,
- pairIndex,
- APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_URL_VALUE
- )}
- onChange={(e) => {
- e?.preventDefault?.();
- updateSourceRequestPayload(e, APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_URL_VALUE);
- LOG_ANALYTICS.PAGE_URL_MODIFIED();
- }}
- disabled={getCurrentPageURLOperatorText() === "Select" ? true : props.isInputDisabled}
- />
- </Col>
- <Col align="right" span={3}>
- {renderClearFilterIcon(GLOBAL_CONSTANTS.RULE_SOURCE_FILTER_TYPES.PAGE_URL)}
+ APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_DOMAINS
+ )}
+ onChange={(e) => {
+ e?.preventDefault?.();
+ dispatch(
+ actions.updateRulePairAtGivenPath({
+ pairIndex,
+ updates: {
+ [APP_CONSTANTS.PATH_FROM_PAIR.SOURCE_PAGE_DOMAINS]: [e.target.value],
+ },
+ })
+ );
+ LOG_ANALYTICS.PAGE_DOMAINS_MODIFIED();
+ }}
+ disabled={props.isInputDisabled}
+ />
+ </Col>
+ </>
+
+ <Col align="right" span={2}>
+ {renderClearFilterIcon(GLOBAL_CONSTANTS.RULE_SOURCE_FILTER_TYPES.PAGE_DOMAINS)}
  </Col>
  </Row>
  ) : null;

app/src/components/features/rules/RulePairs/Pairs/Rows/RowsMarkup/RequestSourceRow/index.js

@@ -70,8 +70,12 @@ const RequestSourceRow = ({ rowIndex, pair, pairIndex, ruleDetails, isInputDisab
  (pairIndex) => {
  const copyOfCurrentlySelectedRule = JSON.parse(JSON.stringify(currentlySelectedRuleData));
  return isSourceFilterFormatUpgraded(pairIndex, copyOfCurrentlySelectedRule)
- ? Object.keys(currentlySelectedRuleData.pairs[pairIndex].source.filters[0] || {}).length
- : Object.keys(currentlySelectedRuleData.pairs[pairIndex].source.filters || {}).length;
+ ? Object.keys(currentlySelectedRuleData.pairs[pairIndex].source.filters[0] || {}).filter(
+ (key) => key !== GLOBAL_CONSTANTS.RULE_SOURCE_FILTER_TYPES.PAGE_URL
+ ).length
+ : Object.keys(currentlySelectedRuleData.pairs[pairIndex].source.filters || {}).filter(
+ (key) => key !== GLOBAL_CONSTANTS.RULE_SOURCE_FILTER_TYPES.PAGE_URL
+ ).length.length;
  },
  [currentlySelectedRuleData, isSourceFilterFormatUpgraded]
  );
@@ -88,11 +92,6 @@ const RequestSourceRow = ({ rowIndex, pair, pairIndex, ruleDetails, isInputDisab
  title: "Host",
  ruleKey: GLOBAL_CONSTANTS.RULE_KEYS.HOST,
  },
- {
- id: 3,
- title: "Path",
- ruleKey: GLOBAL_CONSTANTS.RULE_KEYS.PATH,
- },
  ],
  []
  );
@@ -126,23 +125,25 @@ const RequestSourceRow = ({ rowIndex, pair, pairIndex, ruleDetails, isInputDisab
  const renderSourceKeys = useMemo(() => {
  return (
  <Menu>
- {sourceKeys.map(({ id, title, ruleKey }) => (
- <Menu.Item
- key={id}
- onClick={(event) => {
- dispatch(
- actions.updateRulePairAtGivenPath({
- pairIndex,
- updates: {
- [APP_CONSTANTS.PATH_FROM_PAIR.RULE_KEYS]: ruleKey,
- },
- })
- );
- }}
- >
- {title}
- </Menu.Item>
- ))}
+ {sourceKeys.map(({ id, title, ruleKey }) => {
+ return (
+ <Menu.Item
+ key={id}
+ onClick={(event) => {
+ dispatch(
+ actions.updateRulePairAtGivenPath({
+ pairIndex,
+ updates: {
+ [APP_CONSTANTS.PATH_FROM_PAIR.RULE_KEYS]: ruleKey,
+ },
+ })
+ );
+ }}
+ >
+ {title}
+ </Menu.Item>
+ );
+ })}
  </Menu>
  );
  }, [dispatch, sourceKeys, pairIndex]);

app/src/components/mode-specific/desktop/InterceptTraffic/WebTraffic/TrafficTableV2/utils/index.ts

@@ -114,8 +114,8 @@ export const createResponseMock = (ruleParams: {
  responseRulePair.source.operator = GLOBAL_CONSTANTS.RULE_OPERATORS.EQUALS;
  } else if (ruleParams.urlMatcher === GLOBAL_CONSTANTS.RULE_KEYS.PATH) {
  responseRulePair.source.value = ruleParams.requestDetails.path;
- responseRulePair.source.key = ruleParams.urlMatcher;
- responseRulePair.source.operator = GLOBAL_CONSTANTS.RULE_OPERATORS.EQUALS;
+ responseRulePair.source.key = GLOBAL_CONSTANTS.RULE_KEYS.URL;
+ responseRulePair.source.operator = GLOBAL_CONSTANTS.RULE_OPERATORS.CONTAINS;
  } else if (ruleParams.urlMatcher === "path_query") {
  const urlObject = new URL(ruleParams.requestUrl);
  responseRulePair.source.value = urlObject.pathname + urlObject.search;

app/src/config/constants/index.js

@@ -139,6 +139,7 @@ APP_CONSTANTS.PATH_FROM_PAIR = {
  SOURCE_REQUEST_PAYLOAD_KEY: "source.filters.requestPayload.key",
  SOURCE_REQUEST_PAYLOAD_OPERATOR: "source.filters.requestPayload.operator",
  SOURCE_REQUEST_PAYLOAD_VALUE: "source.filters.requestPayload.value",
+ SOURCE_PAGE_DOMAINS: "source.filters.pageDomains",
 };
 
 APP_CONSTANTS.GA_EVENTS = GA_EVENTS;

app/src/config/constants/sub/paths.js

@@ -687,6 +687,10 @@ PATHS.EXTENSION_INSTALLED = {};
 PATHS.EXTENSION_INSTALLED.RELATIVE = "/extension-installed";
 PATHS.EXTENSION_INSTALLED.ABSOLUTE = joinPaths(PATHS.LANDING, PATHS.EXTENSION_INSTALLED.RELATIVE);
 
+PATHS.EXTENSION_UPDATED = {};
+PATHS.EXTENSION_UPDATED.RELATIVE = "/extension-updated";
+PATHS.EXTENSION_UPDATED.ABSOLUTE = joinPaths(PATHS.LANDING, PATHS.EXTENSION_UPDATED.RELATIVE);
+
 // Mock Server V2
 PATHS.MOCK_SERVER_V2 = {};
 PATHS.MOCK_SERVER_V2.INDEX = "apis";

app/src/features/rules/analytics/constants.ts

@@ -16,3 +16,7 @@ export const RULES = {
  RULES_SELECTED: "rules_selected",
  RULES_LIST_LOADED: "rules_list_loaded",
 };
+
+export const MIGRATION_NOTIFICATION_SHOWN = "migration_notification_shown";
+export const MIGRATION_NOTIFICATION_CLICKED = "migration_notification_clicked";
+export const MIGRATION_NOTIFICATION_CLOSED = "migration_notification_closed";

app/src/features/rules/analytics/index.ts

@@ -1,5 +1,11 @@
 import { trackEvent } from "modules/analytics";
-import { GROUPS, RULES } from "./constants";
+import {
+ GROUPS,
+ MIGRATION_NOTIFICATION_CLICKED,
+ MIGRATION_NOTIFICATION_CLOSED,
+ MIGRATION_NOTIFICATION_SHOWN,
+ RULES,
+} from "./constants";
 
 // groups
 export const trackGroupStatusToggled = (enabled: boolean) => {
@@ -77,3 +83,18 @@ export const trackRulesListLoaded = (
  const params = { num_rules, num_active_rules, num_active_premium_rules, num_groups };
  trackEvent(RULES.RULES_LIST_LOADED, params);
 };
+
+export const trackMigrationNotificationShown = () => {
+ const params = {};
+ trackEvent(MIGRATION_NOTIFICATION_SHOWN, params);
+};
+
+export const trackMigrationNotificationClicked = () => {
+ const params = {};
+ trackEvent(MIGRATION_NOTIFICATION_CLICKED, params);
+};
+
+export const trackMigrationNotificationClosed = () => {
+ const params = {};
+ trackEvent(MIGRATION_NOTIFICATION_CLOSED, params);
+};