Prevent choosing a date before site was added in datepicker (#477)

Fixes #446

CHANGELOG.md

@@ -27,6 +27,7 @@ All notable changes to this project will be documented in this file.
 - Going back in history now correctly resets the period filter plausible/analytics#408
 - Fix URL decoding in query parameters plausible/analytics#416
 - Fix overly-sticky date in query parameters plausible/analytics/#439
+- Prevent picking dates before site insertion plausible/analtics#446
 
 ### Security
 - Do not run the plausible Docker container as root plausible/analytics#362

assets/js/dashboard/datepicker.js

@@ -214,7 +214,9 @@ class DatePicker extends React.Component {
         </div>
       )
     } else if (this.state.mode === 'calendar') {
-      return <Flatpickr options={{mode: 'range', maxDate: 'today', showMonths: 1, static: true, animate: false}} ref={calendar => this.calendar = calendar} className="invisible" onChange={this.setCustomDate.bind(this)} />
+      const insertionDate = new Date(this.props.site.insertedAt);
+      const dayBeforeCreation = insertionDate - 86400000;
+      return <Flatpickr options={{mode: 'range', maxDate: 'today', minDate: dayBeforeCreation, showMonths: 1, static: true, animate: false}} ref={calendar => this.calendar = calendar} className="invisible" onChange={this.setCustomDate.bind(this)} />
     }
   }
 

assets/js/dashboard/mount.js

@@ -11,7 +11,8 @@ if (container) {
   const site = {
     domain: container.dataset.domain,
     offset: container.dataset.offset,
-    hasGoals: container.dataset.hasGoals === 'true'
+    hasGoals: container.dataset.hasGoals === 'true',
+    insertedAt: container.dataset.insertedAt
   }
 
   const loggedIn = container.dataset.loggedIn === 'true'

lib/plausible_web/templates/stats/stats.html.eex

@@ -5,7 +5,7 @@
     </div>
   <% end %>
   <div class="pt-6"></div>
-  <div id="stats-react-container" data-domain="<%= @site.domain %>" data-offset="<%= Timex.Timezone.total_offset(Timex.Timezone.get(@site.timezone)) %>" data-has-goals="<%= @has_goals %>" data-logged-in="<%= !!@conn.assigns[:current_user] %>"></div>
+  <div id="stats-react-container" data-domain="<%= @site.domain %>" data-offset="<%= Timex.Timezone.total_offset(Timex.Timezone.get(@site.timezone)) %>" data-has-goals="<%= @has_goals %>" data-logged-in="<%= !!@conn.assigns[:current_user] %>" data-inserted-at="<%= @site.inserted_at %>"></div>
   <div id="modal_root"></div>
   <%= if !@conn.assigns[:current_user] && @conn.assigns[:demo] do %>
     <div class="bg-gray-50">