feat: add steps to configure store

js/packages/web/.env

@@ -0,0 +1 @@
+REACT_APP_STORE_OWNER_ADDRESS_ADDRESS=

js/packages/web/.env.production

@@ -1 +1 @@
-GENERATE_SOURCEMAP = false
+GENERATE_SOURCEMAP=false

js/packages/web/craco.config.js

@@ -3,7 +3,6 @@ const CracoAlias = require('craco-alias');
 const CracoBabelLoader = require('craco-babel-loader');
 const path = require('path');
 const fs = require('fs');
-
 //console.log('qualified', pnp.resolveRequest('@babel/preset-typescript'), path.resolve(__dirname, '/') + 'src/');
 
 // Handle relative paths to sibling packages

js/packages/web/src/contexts/meta.tsx

@@ -207,7 +207,7 @@ export function MetaProvider({ children = null as any }) {
         auctions: {},
         vaults: {},
         payoutTickets: {},
-        store: {},
+        store: undefined,
         whitelistedCreatorsByCreator: {},
         bidderMetadataByAuctionAndBidder: {},
         bidderPotsByAuctionAndBidder: {},
@@ -295,7 +295,9 @@ export function MetaProvider({ children = null as any }) {
       setAuctionManagersByAuction(tempCache.auctionManagersByAuction);
       setBidRedemptions(tempCache.bidRedemptions);
       setPayoutTickets(tempCache.payoutTickets);
-      setStore(tempCache.store as any);
+      if (tempCache.store) {
+        setStore(tempCache.store as any);
+      }
       setWhitelistedCreatorsByCreator(tempCache.whitelistedCreatorsByCreator);
       setIsLoading(false);
 

js/packages/web/src/views/admin/index.tsx

@@ -117,11 +117,16 @@ function InnerAdminView({
   connection: Connection;
   wallet: WalletAdapter;
 }) {
-  const [newStore, setNewStore] = useState(new Store(store.info));
+  const [newStore, setNewStore] = useState(store && store.info && new Store(store.info));
   const [updatedCreators, setUpdatedCreators] = useState<
     Record<string, WhitelistedCreator>
   >({});
 
+
+  if (!store || !newStore) {
+    return <p>Store is not defined</p>;
+  }
+
   const uniqueCreators = Object.values(whitelistedCreatorsByCreator).reduce(
     (acc: Record<string, WhitelistedCreator>, e) => {
       acc[e.info.address.toBase58()] = e.info;

js/packages/web/src/views/home/index.tsx

@@ -11,7 +11,7 @@ import { Link, useHistory } from 'react-router-dom';
 import { CardLoader } from '../../components/MyLoader';
 import { useMeta } from '../../contexts';
 import BN from 'bn.js';
-import { useConnection, useWallet } from '@oyster/common';
+import { programIds, useConnection, useWallet } from '@oyster/common';
 import { saveAdmin } from '../../actions/saveAdmin';
 import { WhitelistedCreator } from '../../models/metaplex';
 
@@ -22,6 +22,7 @@ export const HomeView = () => {
   const auctions = useAuctions(AuctionViewState.Live);
   const auctionsEnded = useAuctions(AuctionViewState.Ended);
   const { isLoading, store } = useMeta();
+  const [isInitalizingStore, setIsInitalizingStore] = useState(false);
   const connection = useConnection();
   const history = useHistory();
   const { wallet, connect } = useWallet();
@@ -93,21 +94,27 @@ export const HomeView = () => {
     </Masonry>
   );
 
+  const CURRENT_STORE = programIds().store;
+
   return (
     <Layout style={{ margin: 0, marginTop: 30, alignItems: 'center' }}>
-      {!store && <>
-        {!wallet?.publicKey && <p>Store has not been configure please <Button type="primary" className="app-btn" onClick={connect}>Connect</Button> Wallet and follow instructions to configure store.</p>}
-        {wallet?.publicKey && <>
-          <p>Initializing store will allow you to control </p>
-          <Button className="app-btn" onClick={async () => {
+      {!store && !isLoading && <>
+        {!CURRENT_STORE && <p>Store has not been configured please set <em>REACT_APP_STORE_OWNER_ADDRESS_ADDRESS</em> to admin wallet inside <em>packages/web/.env</em> and restart yarn</p>}
+        {CURRENT_STORE && !wallet?.publicKey && <p><Button type="primary" className="app-btn" onClick={connect}>Connect</Button> to configure store.</p>}
+        {CURRENT_STORE && wallet?.publicKey && <>
+          <p>Initializing store will allow you to control list of creators.</p>
+
+          <Button className="app-btn" type="primary" loading={isInitalizingStore} disabled={!CURRENT_STORE} onClick={async () => {
             if(!wallet?.publicKey) {
               return;
             }
 
-            // await saveAdmin(connection, wallet, false, [new WhitelistedCreator({
-            //   address: wallet?.publicKey,
-            //   activated: true,
-            // })]);
+            setIsInitalizingStore(true);
+
+            await saveAdmin(connection, wallet, false, [new WhitelistedCreator({
+              address: wallet?.publicKey,
+              activated: true,
+            })]);
 
             history.push('/admin');