From 32c7c5f5e90bc36247bfc8cbd7528170adc91cd0 Mon Sep 17 00:00:00 2001
From: lublagg <lvblagg@gmail.com>
Date: Mon, 29 Jan 2024 17:47:19 -0500
Subject: [PATCH 1/2] Save + get interactive state.

---
 src/components/App.tsx  | 37 ++++++++++++++++++++++++++++++++++++-
 src/hooks/use-state.tsx | 14 +++++++++++---
 2 files changed, 47 insertions(+), 4 deletions(-)

diff --git a/src/components/App.tsx b/src/components/App.tsx
index 7517c92..7a79403 100755
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -14,6 +14,8 @@ import { composeURL, formatData } from "../utils/noaaApiHelper";
 import { StationDSName } from "../constants";
 import { geoLocSearch } from "../utils/geonameSearch";
 import { DataReturnWarning } from "./data-return-warning";
+import { IState } from "../types";
+import dayjs from "dayjs";
 
 import "./App.scss";
 
@@ -33,7 +35,40 @@ export const App = () => {
   const weatherStations = getWeatherStations();
 
   useEffect(() => {
-    initializePlugin({pluginName: kPluginName, version: kVersion, dimensions: kInitialDimensions});
+
+    const init = async () => {
+      const newState = await initializePlugin({pluginName: kPluginName, version: kVersion, dimensions: kInitialDimensions}) as IState;
+      console.log("newState", newState);
+
+      // plugins in new documents return an empty object for the interactive state
+      // so ignore the new state and keep the default starting state in that case
+      if (Object.keys(newState || {}).length > 0) {
+        setState((draft) => {
+          draft.location = newState.location;
+          draft.selectedFrequency = newState.selectedFrequency;
+          draft.units = newState.units;
+          draft.timezone = newState.timezone;
+          draft.weatherStation = newState.weatherStation;
+          draft.weatherStationDistance = newState.weatherStationDistance;
+          draft.zoomMap = newState.zoomMap;
+          draft.frequencies = newState.frequencies;
+          draft.didUserSelectDate = newState.didUserSelectDate;
+          draft.isMapOpen = newState.isMapOpen;
+
+          // to-do: convert end date and start date strings to Date objects
+          const startDateStr = newState.startDate;
+          const endDateStr = newState.endDate;
+          if (startDateStr) {
+            draft.startDate = dayjs(startDateStr).toDate();
+          }
+          if (endDateStr) {
+            draft.endDate = dayjs(endDateStr).toDate();
+          }
+        });
+      }
+    };
+
+    init();
 
 
     const stationSelectionHandler = async(req: any) =>{
diff --git a/src/hooks/use-state.tsx b/src/hooks/use-state.tsx
index 23927bc..a19ee92 100644
--- a/src/hooks/use-state.tsx
+++ b/src/hooks/use-state.tsx
@@ -1,6 +1,7 @@
-import { createContext, useContext } from "react";
+import { createContext, useContext, useEffect } from "react";
 import { Updater, useImmer } from "use-immer";
 import { IState, DefaultState } from "../types";
+import { codapInterface } from "@concord-consortium/codap-plugin-api";
 
 export interface IStateContext {
   state: IState;
@@ -10,10 +11,17 @@ export interface IStateContext {
 export const useStateContextInAppContainerOnly = (): IStateContext => {
   const [state, setState] = useImmer<IState>(DefaultState);
 
-  return { state, setState };
+  useEffect(() => {
+    codapInterface.updateInteractiveState(state);
+  }, [state]);
+
+
+  return {
+    state,
+    setState
+  };
 };
 
 // note: the "setState: () => undefined" is fine as it is overridden in the AppContainer.Provider tag
 export const StateContext = createContext<IStateContext>({state: DefaultState, setState: () => undefined});
-
 export const useStateContext = () => useContext(StateContext);

From beb31f8e7e5292754c7821b23d3d292ae90aecd2 Mon Sep 17 00:00:00 2001
From: lublagg <lvblagg@gmail.com>
Date: Mon, 29 Jan 2024 17:49:56 -0500
Subject: [PATCH 2/2] Remove console.log

---
 src/components/App.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/components/App.tsx b/src/components/App.tsx
index 7a79403..3e3c5f6 100755
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -38,8 +38,6 @@ export const App = () => {
 
     const init = async () => {
       const newState = await initializePlugin({pluginName: kPluginName, version: kVersion, dimensions: kInitialDimensions}) as IState;
-      console.log("newState", newState);
-
       // plugins in new documents return an empty object for the interactive state
       // so ignore the new state and keep the default starting state in that case
       if (Object.keys(newState || {}).length > 0) {
@@ -55,7 +53,6 @@ export const App = () => {
           draft.didUserSelectDate = newState.didUserSelectDate;
           draft.isMapOpen = newState.isMapOpen;
 
-          // to-do: convert end date and start date strings to Date objects
           const startDateStr = newState.startDate;
           const endDateStr = newState.endDate;
           if (startDateStr) {