split old planning data into separate section

app/src/frontend/building/data-components/planning-data-entry.tsx

@@ -4,7 +4,7 @@ import InfoBox from '../../components/info-box';
 import CheckboxDataEntry from '../data-components/checkbox-data-entry';
 
 interface PlanningDataOfficialDataEntryProps {
-    value: {
+    shownData: {
       uprn: string;
       building_id: number;
       description?: string;
@@ -15,6 +15,7 @@ interface PlanningDataOfficialDataEntryProps {
       data_source: string;
       data_source_link?: string;
   }[];
+    allEntryCount: number,
 }
 
 const {useState} = React;
@@ -60,8 +61,9 @@ const LinkIfAvailable = (link) => {
 }
 
 const PlanningDataOfficialDataEntry: React.FC<PlanningDataOfficialDataEntryProps> = (props) => {
-    const data = props.value || [];
+    const data = props.shownData || [];
     if(data.length == 0) {
+      if (props.allEntryCount == 0) {
         return (<Fragment>
                   <InfoBox type='success'>
                   <i>No live planning data available currently for this building polygon via the Planning London DataHub.</i>
@@ -69,6 +71,15 @@ const PlanningDataOfficialDataEntry: React.FC<PlanningDataOfficialDataEntryProps
                   <Disclaimer />
                   </InfoBox>
                 </Fragment>);
+    } else {
+      return (<Fragment>
+                <InfoBox type='success'>
+                <i>No live planning data for this date range, but this building has associated planning data now shown here.</i>
+                <br/>
+                <Disclaimer />
+                </InfoBox>
+              </Fragment>);
+    }
   }
   return <>{data.map((item) => (
         <Fragment>

app/src/frontend/building/data-containers/planning.tsx

@@ -20,6 +20,32 @@ import { CategoryViewProps } from './category-view-props';
 import { Category } from '../../config/categories-config';
 
 const currentYear = new Date().getFullYear();
+const currentTimestamp = new Date().valueOf();
+const milisecondsInYear = 1000 * 60 * 60 * 24 * 365;
+
+// TODO: there is already "parseDate" in helpers
+function parseDate(isoUtcDate: string): Date {
+    const [year, month, day] = isoUtcDate.match(/^(\d{4})-(\d\d)-(\d\d)$/)
+        .splice(1)
+        .map(x => parseInt(x, 10));
+    return new Date(Date.UTC(year, month-1, day));
+}
+
+function isArchived(item) {
+    const decisionDate = item.decision_date;
+    console.warn(decisionDate)
+    if(decisionDate != null) {
+        if ((currentTimestamp - parseDate(decisionDate).valueOf()) > milisecondsInYear) {
+            return true;
+        }
+    }
+    if(item.registered_with_local_authority_date != null) {
+        if ((currentTimestamp - parseDate(item.registered_with_local_authority_date).valueOf()) > milisecondsInYear) {
+            return true;
+        }
+    }
+    return false;
+}
 
 const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
     const communityLinkUrl = `/${props.mode}/${Category.Community}/${props.building.building_id}`;
@@ -30,7 +56,14 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
             This section is under development as part of the project CLPV Tool. For more details and progress <a href="https://github.com/colouring-cities/manual/wiki/G.-Data-capture-methods">read here</a>.
         </InfoBox>
         <PlanningDataOfficialDataEntry  
-            value={props.building.planning_data}
+            shownData={props.building.planning_data ? props.building.planning_data.filter(item => isArchived(item) == false) : []}
+            allEntryCount={props.building.planning_data ? props.building.planning_data.length : 0}
+        />
+        </DataEntryGroup>
+        <DataEntryGroup name="Older planning data" collapsed={true} >
+        <PlanningDataOfficialDataEntry  
+            shownData={props.building.planning_data ? props.building.planning_data.filter(item => isArchived(item)) : []}
+            allEntryCount={props.building.planning_data ? props.building.planning_data.length : 0}
         />
         </DataEntryGroup>
         <DataEntryGroup name="Crowdsourced planning application data" collapsed={false} >

app/src/tiles/dataDefinition.ts

@@ -137,7 +137,7 @@ const LAYER_QUERIES = {
             community_public_ownership IS NOT NULL
     `,
     planning_applications_status: `SELECT 
-        buildings.geometry_id, building_properties.uprn, building_properties.building_id, planning_data.status AS status, planning_data.uprn
+        buildings.geometry_id, building_properties.uprn, building_properties.building_id, planning_data.status AS status, planning_data.uprn, planning_data.decision_date, planning_data.registered_with_local_authority_date
         FROM building_properties
         INNER JOIN planning_data ON building_properties.uprn = planning_data.uprn
         INNER JOIN buildings ON building_properties.building_id = buildings.building_id`,