Merge pull request #38 from glazec/master

add local storage support

Author: adrianmcli

src/app/containers/Contracts.ts

@@ -20,16 +20,30 @@ export function useContracts() {
 
   const shiftDown = () => {
     setSelectedIdx((prev) =>
-      prev === null || prev === contracts.length - 1 ? prev : prev + 1,
+      prev === null || prev === contracts.length - 1 ? prev : prev + 1
     );
   };
 
-  const addContract = (contract: Contract) =>
+  const addContract = (contract: Contract) => {
+    var newContracts;
     setContracts((prevContracts) => {
-      const newContracts = [...prevContracts, contract];
-      return newContracts.sort((a, b) => a.name.localeCompare(b.name));
+      newContracts = [...prevContracts, contract].sort((a, b) =>
+        a.name.localeCompare(b.name)
+      );
+      return newContracts;
     });
+    localStorage.setItem("contracts", JSON.stringify(newContracts));
+  };
 
+  const overwriteContract = (contracts: Contract[]) => {
+    var newContracts;
+    setContracts(() => {
+      newContracts = [...contracts].sort((a, b) =>
+        a.name.localeCompare(b.name)
+      );
+      return newContracts;
+    });
+  };
   const removeContractByIdx = (idx: number) => {
     setSelectedIdx(null);
     setContracts((prevContracts) => prevContracts.filter((x, i) => idx !== i));
@@ -84,7 +98,7 @@ export function useContracts() {
 
   const removeByPath = (path: string) => {
     setContracts((prevContracts) =>
-      prevContracts.filter((c) => c.path !== path),
+      prevContracts.filter((c) => c.path !== path)
     );
   };
 
@@ -94,6 +108,7 @@ export function useContracts() {
     removeContractByIdx,
     addByAbi,
     addByArtifact,
+    overwriteContract,
     upsertByPath,
     removeByPath,
     selectedIdx,

src/app/features/main/Main.tsx

@@ -1,4 +1,5 @@
 import React from "react";
+import { useEffect } from "react";
 import styled from "styled-components";
 import { Fieldset, Panel } from "react95";
 
@@ -39,8 +40,17 @@ const FooterPanel = styled(Panel)`
 `;
 
 const Main = () => {
-  const { selectedContract: contract } = Contracts.useContainer();
-  useQueryStringContract()
+  const { selectedContract: contract, overwriteContract } =
+    Contracts.useContainer();
+  useQueryStringContract();
+  if (localStorage.getItem("contracts")) {
+    useEffect(() => {
+      let result = localStorage.getItem("contracts");
+      result = `{"data":${result}}`;
+      let jsonResult = JSON.parse(result).data;
+      overwriteContract(jsonResult);
+    }, [contract]);
+  }
 
   return (
     <Container>