From 95380a9844c1ff4e5f40e22888046dcc64ed0b2f Mon Sep 17 00:00:00 2001
From: Chris Walsh <christianywalsh@gmail.com>
Date: Sat, 4 Dec 2021 15:32:25 -0800
Subject: [PATCH] Disable all-time filter as default date range

---
 components/common/DateFilter.js         | 23 ++++++++++++++++++++---
 components/settings/DateRangeSetting.js |  8 +++++++-
 2 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/components/common/DateFilter.js b/components/common/DateFilter.js
index d6888f2f..e084d48a 100644
--- a/components/common/DateFilter.js
+++ b/components/common/DateFilter.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useMemo, useState } from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
 import { FormattedMessage } from 'react-intl';
@@ -60,7 +60,15 @@ const filterOptions = [
   },
 ];
 
-function DateFilter({ value, startDate, endDate, onChange, className, websiteId = null }) {
+function DateFilter({
+  value,
+  startDate,
+  endDate,
+  onChange,
+  className,
+  websiteId = null,
+  disableOptions = [],
+}) {
   const { locale } = useLocale();
   const [showPicker, setShowPicker] = useState(false);
   const createdAt = useSelector(state => state.websites[websiteId]?.createdAt);
@@ -71,6 +79,15 @@ function DateFilter({ value, startDate, endDate, onChange, className, websiteId
       value
     );
 
+  const filteredOptions = useMemo(() => {
+    const clone = [...filterOptions];
+    for (const option of disableOptions) {
+      const index = clone.findIndex(a => a.value == option);
+      if (index >= 0) clone.splice(index, 1);
+    }
+    return clone;
+  }, [disableOptions]);
+
   function handleChange(value) {
     if (value === 'custom') {
       setShowPicker(true);
@@ -89,7 +106,7 @@ function DateFilter({ value, startDate, endDate, onChange, className, websiteId
       <DropDown
         className={className}
         value={displayValue}
-        options={filterOptions}
+        options={filteredOptions}
         onChange={handleChange}
       />
       {showPicker && (
diff --git a/components/settings/DateRangeSetting.js b/components/settings/DateRangeSetting.js
index 87cd3545..cb665ae0 100644
--- a/components/settings/DateRangeSetting.js
+++ b/components/settings/DateRangeSetting.js
@@ -19,7 +19,13 @@ export default function DateRangeSetting() {
 
   return (
     <>
-      <DateFilter value={value} startDate={startDate} endDate={endDate} onChange={setDateRange} />
+      <DateFilter
+        value={value}
+        startDate={startDate}
+        endDate={endDate}
+        onChange={setDateRange}
+        disableOptions={['all']}
+      />
       <Button className={styles.button} size="small" onClick={handleReset}>
         <FormattedMessage id="label.reset" defaultMessage="Reset" />
       </Button>