Abdul 1087 avatar nft deselect (#1100)

* Use renovate for dependency updates (#1054)

1. Disable dependabot for normal dependency updates. Note the dependabot PRs will need to be manually closed, and the "security" dependabot PRs will continue.

2. Use renovateapp instead.

The renovate configuration included here is based on that from ads-serve, and:

a. waits for updates to have been published for 4 days before raising a PR - this both reduces churn and also avoids the 3 day period where npm-published entries can be "unpublished"
b. combines all minor and patch updates into a single PR

* removed as *[bot] is not accepted by AWS (#1055)

Signed-off-by: Ahmed Kamal <[email protected]>

* Update all non-major dependencies (#1057)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Pin dependencies (#1056)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update all non-major dependencies (#1063)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update Node.js to v18.16.1 (#1059)

* first mockup on dev2

* remove cluttered talk, add request payload

* change permission name from BAT-gating to balance as per spec sheet

* Renovate/all minor patch (#1062)

* Use renovate for dependency updates (#1054)

1. Disable dependabot for normal dependency updates. Note the dependabot PRs will need to be manually closed, and the "security" dependabot PRs will continue.

2. Use renovateapp instead.

The renovate configuration included here is based on that from ads-serve, and:

a. waits for updates to have been published for 4 days before raising a PR - this both reduces churn and also avoids the 3 day period where npm-published entries can be "unpublished"
b. combines all minor and patch updates into a single PR

* removed as *[bot] is not accepted by AWS (#1055)

Signed-off-by: Ahmed Kamal <[email protected]>

* Update all non-major dependencies

---------

Signed-off-by: Ahmed Kamal <[email protected]>
Co-authored-by: Graham Tackley <[email protected]>
Co-authored-by: Ahmed Kamal <[email protected]>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update Node.js to v18.16.1

---------

Signed-off-by: Ahmed Kamal <[email protected]>
Co-authored-by: David Suh <[email protected]>
Co-authored-by: David Suh <[email protected]>
Co-authored-by: Marshall T. Rose <[email protected]>
Co-authored-by: Graham Tackley <[email protected]>
Co-authored-by: Ahmed Kamal <[email protected]>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Revert "Update Node.js to v18.16.1 (#1059)"

This reverts commit 0dc1969.

* this is what should have happened (#1070)

* Update dependency react-i18next to v13 (#1060)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Address word-wrap audit warning (#1073)

Addresses: GHSA-j8xg-fqg3-53r7

* reduce impact of web3 dependencies on non-web3 users (#1066)

* dynamically loading ethers library

* syncing package-lock.json with main

* Pin dependency optionator to 0.9.3 (#1074)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Duplicate Fix For Update jest monorepo to v29 (major)  (#1082)

* testing changes by renovate

* testing changes by renovate

* Pin dependency jest-environment-jsdom to 29.5.0 (#1083)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update all non-major dependencies (#1080)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Marshall T. Rose <[email protected]>

* Update dependency i18next to v23.2.6 (#1084)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Update all non-major dependencies (#1085)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* Fix for Inability to Deselect Avatar NFT without Selecting Another

* Fix for Inability to Deselect Avatar NFT without Selecting Another

---------

Signed-off-by: Ahmed Kamal <[email protected]>
Co-authored-by: Graham Tackley <[email protected]>
Co-authored-by: Ahmed Kamal <[email protected]>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: David Suh <[email protected]>
Co-authored-by: David Suh <[email protected]>
Co-authored-by: Marshall T. Rose <[email protected]>

package.json

@@ -60,4 +60,4 @@
     "react-dom": "18.2.0",
     "react-i18next": "13.0.1"
   }
-}
+}

src/components/web3/OptionalSettings.tsx

@@ -6,6 +6,7 @@ import { SelectableImageList } from "./SelectableImageList";
 import { SelectablePoapList } from "./SelectablePoapList";
 import { SelectableNFTCollectionList } from "./SelectableNFTCollectionList";
 import { PermissionTypeSelector } from "./PermissionTypeSelector";
+import noNftImage from "../../images/no-nft-image.png";
 
 interface Props {
   startCall: boolean;
@@ -57,6 +58,14 @@ export const OptionalSettings: React.FC<Props> = ({
   const nftItems = nfts.map((n: NFT) => ({ ...n, imageUrl: n.image_url }));
   const selectedNftIdx = nfts.findIndex((n) => n.image_url === nft);
   const { t } = useTranslation();
+  const onToggle = (idx: number) => {
+    const imageUrl = nfts[idx].image_url;
+    if (nft === imageUrl) {
+      setNft(noNftImage);
+    } else {
+      setNft(imageUrl);
+    }
+  };
 
   return (
     <div css={{ maxWidth: "563px", margin: "0 auto 0" }}>
@@ -72,7 +81,7 @@ export const OptionalSettings: React.FC<Props> = ({
           selectedIdxs={
             typeof selectedNftIdx === "number" ? [selectedNftIdx] : []
           }
-          onToggleSelection={(idx) => setNft(nfts[idx].image_url)}
+          onToggleSelection={onToggle}
         />
       </ExapandablePanel>