style: replace inclusive/exclusive on DateFilterControl with </≤ (#10420)

* feat: improve filter control tooltips

* add styles

* break out utils into own file

* lint

* add tests

* styled component now working

* lint

* add license headers

* replace shallow with mount due to withTheme

Co-authored-by: Evan Rusackas <evan@preset.io>

superset-frontend/spec/javascripts/explore/components/DateFilterControl_spec.jsx

@@ -19,7 +19,7 @@
 /* eslint-disable no-unused-expressions */
 import React from 'react';
 import sinon from 'sinon';
-import { shallow } from 'enzyme';
+import { mount } from 'enzyme';
 import { Button, Label } from 'react-bootstrap';
 
 import DateFilterControl from 'src/explore/components/controls/DateFilterControl';
@@ -37,7 +37,7 @@ describe('DateFilterControl', () => {
   let wrapper;
 
   beforeEach(() => {
-    wrapper = shallow(<DateFilterControl {...defaultProps} />);
+    wrapper = mount(<DateFilterControl {...defaultProps} />);
   });
 
   it('renders a ControlHeader', () => {

superset-frontend/spec/javascripts/explore/utils_spec.jsx

@@ -25,6 +25,10 @@ import {
   getExploreLongUrl,
   shouldUseLegacyApi,
 } from 'src/explore/exploreUtils';
+import {
+  buildTimeRangeString,
+  formatTimeRange,
+} from 'src/explore/dateFilterUtils';
 import * as hostNamesConfig from 'src/utils/hostNamesConfig';
 import { getChartMetadataRegistry } from '@superset-ui/chart';
 
@@ -245,4 +249,38 @@ describe('exploreUtils', () => {
       expect(useLegacyApi).toBe(false);
     });
   });
+
+  describe('buildTimeRangeString', () => {
+    it('generates proper time range string', () => {
+      expect(
+        buildTimeRangeString('2010-07-30T00:00:00', '2020-07-30T00:00:00'),
+      ).toBe('2010-07-30T00:00:00 : 2020-07-30T00:00:00');
+      expect(buildTimeRangeString('', '2020-07-30T00:00:00')).toBe(
+        ' : 2020-07-30T00:00:00',
+      );
+      expect(buildTimeRangeString('', '')).toBe(' : ');
+    });
+  });
+
+  describe('formatTimeRange', () => {
+    it('generates a readable time range', () => {
+      expect(formatTimeRange('Last 7 days')).toBe('Last 7 days');
+      expect(formatTimeRange('No filter')).toBe('No filter');
+      expect(formatTimeRange('Yesterday : Tomorrow')).toBe(
+        'Yesterday < col < Tomorrow',
+      );
+      expect(
+        formatTimeRange('2010-07-30T00:00:00 : 2020-07-30T00:00:00', [
+          'inclusive',
+          'exclusive',
+        ]),
+      ).toBe('2010-07-30 ≤ col < 2020-07-30');
+      expect(
+        formatTimeRange('2010-07-30T01:00:00 : ', ['exclusive', 'inclusive']),
+      ).toBe('2010-07-30T01:00:00 < col ≤ ∞');
+      expect(formatTimeRange(' : 2020-07-30T00:00:00')).toBe(
+        '-∞ < col < 2020-07-30',
+      );
+    });
+  });
 });