@ludo.ninja/components 1.0.7 → 1.0.9

package/dist/components/assetPage/figCaption/index.jsx

@@ -1,208 +1,506 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
 import React, { useMemo } from 'react';
+
 import Skeleton from 'react-loading-skeleton';
 import styled from 'styled-components';
+
 import { authCookies } from '@ludo.ninja/api';
 import { alertVariants } from '@ludo.ninja/ui/build/system/Alert/type';
 import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
 import { copyToClipboard } from '@ludo.ninja/utils';
+
 import { useUserStore } from '@/modules/user/store';
+
 import { useUiStore } from '@/store/ui';
+
 import useFetchDynamicAssetLikes from '@/api/server-assets/queries/useFetchDynamicAssetLikes';
+
 import { ScreenWidth, mediaQuery } from '@/styles/ScreenWidth';
 import { BlackColor, TextDarkGrayColor, TextGrayColor } from '@/styles/colors';
+
 import AssetLikes from '@/components/assetPage/assetLikes';
 import { MoreDropDown } from '@/components/assetPage/moreDropDown';
 import AddAssetToFavoriteList from '@/components/favoriteList/add/addAssetToFavoriteList';
 import AddAssetToGallery from '@/components/gallery/add/addAssetToGallery';
 // import MoreIcon from '@/public/creation/card/moreBtn.svg';
 import ShareDialog from '@/components/shareDialog';
+
 import IconWithButton from '@/system/Buttons/IconWithButton';
 import StyledLikes from '@/system/Cards/Styles/Likes';
+
 import { Flex } from '@system';
+
 import { getAdaptiveValueWithCheck4k } from '@/utils/adaptive/check4k';
 import { getAdaptiveScale } from '@/utils/adaptive/scale';
 import { useWindowDimensionsWithServerInitial } from '@/utils/screen';
+
 import GalleryIcon from '@/public/assetPage/favorite.svg';
 import FavoriteIcon from '@/public/assetPage/flag.svg';
 import ShareIcon from '@/public/assetPage/shareWithDots.svg';
-var ImageDetails = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-top: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n    margin-top: 16px;\n  }\n\n  @media (max-width: 767px) {\n    margin-top: 24px;\n    align-items: center;\n    width: 100%;\n    margin-right: 0;\n  }\n\n  h5:hover {\n    color: ", ";\n  }\n\n  ", " {\n    margin-right: 20px;\n    cursor: pointer;\n  }\n\n  .icon.liked {\n    path {\n      fill: #f94c66;\n    }\n  }\n\n  .shareIconStyle {\n    path {\n      stroke: none;\n      fill: ", ";\n    }\n\n    :hover {\n      path {\n        fill: ", ";\n      }\n    }\n  }\n\n  ", " {\n    margin-top: ", ";\n    width: ", ";\n\n    ", " {\n      margin-right: ", ";\n    }\n  }\n"], ["\n  margin-top: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n    margin-top: 16px;\n  }\n\n  @media (max-width: 767px) {\n    margin-top: 24px;\n    align-items: center;\n    width: 100%;\n    margin-right: 0;\n  }\n\n  h5:hover {\n    color: ", ";\n  }\n\n  ", " {\n    margin-right: 20px;\n    cursor: pointer;\n  }\n\n  .icon.liked {\n    path {\n      fill: #f94c66;\n    }\n  }\n\n  .shareIconStyle {\n    path {\n      stroke: none;\n      fill: ", ";\n    }\n\n    :hover {\n      path {\n        fill: ", ";\n      }\n    }\n  }\n\n  ", " {\n    margin-top: ", ";\n    width: ", ";\n\n    ", " {\n      margin-right: ", ";\n    }\n  }\n"])), mediaQuery.desktop, BlackColor, StyledLikes, TextDarkGrayColor, TextGrayColor, mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(510), StyledLikes, adaptiveValueCalc(20));
-var SIconResizeWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(16));
+
+var __makeTemplateObject =
+  (this && this.__makeTemplateObject) ||
+  function (cooked, raw) {
+    if (Object.defineProperty) {
+      Object.defineProperty(cooked, 'raw', { value: raw });
+    } else {
+      cooked.raw = raw;
+    }
+    return cooked;
+  };
+var __awaiter =
+  (this && this.__awaiter) ||
+  function (thisArg, _arguments, P, generator) {
+    function adopt(value) {
+      return value instanceof P
+        ? value
+        : new P(function (resolve) {
+            resolve(value);
+          });
+    }
+    return new (P || (P = Promise))(function (resolve, reject) {
+      function fulfilled(value) {
+        try {
+          step(generator.next(value));
+        } catch (e) {
+          reject(e);
+        }
+      }
+      function rejected(value) {
+        try {
+          step(generator['throw'](value));
+        } catch (e) {
+          reject(e);
+        }
+      }
+      function step(result) {
+        result.done
+          ? resolve(result.value)
+          : adopt(result.value).then(fulfilled, rejected);
+      }
+      step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+  };
+var __generator =
+  (this && this.__generator) ||
+  function (thisArg, body) {
+    var _ = {
+        label: 0,
+        sent: function () {
+          if (t[0] & 1) throw t[1];
+          return t[1];
+        },
+        trys: [],
+        ops: [],
+      },
+      f,
+      y,
+      t,
+      g;
+    return (
+      (g = { next: verb(0), throw: verb(1), return: verb(2) }),
+      typeof Symbol === 'function' &&
+        (g[Symbol.iterator] = function () {
+          return this;
+        }),
+      g
+    );
+    function verb(n) {
+      return function (v) {
+        return step([n, v]);
+      };
+    }
+    function step(op) {
+      if (f) throw new TypeError('Generator is already executing.');
+      while ((g && ((g = 0), op[0] && (_ = 0)), _))
+        try {
+          if (
+            ((f = 1),
+            y &&
+              (t =
+                op[0] & 2
+                  ? y['return']
+                  : op[0]
+                  ? y['throw'] || ((t = y['return']) && t.call(y), 0)
+                  : y.next) &&
+              !(t = t.call(y, op[1])).done)
+          )
+            return t;
+          if (((y = 0), t)) op = [op[0] & 2, t.value];
+          switch (op[0]) {
+            case 0:
+            case 1:
+              t = op;
+              break;
+            case 4:
+              _.label++;
+              return { value: op[1], done: false };
+            case 5:
+              _.label++;
+              y = op[1];
+              op = [0];
+              continue;
+            case 7:
+              op = _.ops.pop();
+              _.trys.pop();
+              continue;
+            default:
+              if (
+                !((t = _.trys), (t = t.length > 0 && t[t.length - 1])) &&
+                (op[0] === 6 || op[0] === 2)
+              ) {
+                _ = 0;
+                continue;
+              }
+              if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
+                _.label = op[1];
+                break;
+              }
+              if (op[0] === 6 && _.label < t[1]) {
+                _.label = t[1];
+                t = op;
+                break;
+              }
+              if (t && _.label < t[2]) {
+                _.label = t[2];
+                _.ops.push(op);
+                break;
+              }
+              if (t[2]) _.ops.pop();
+              _.trys.pop();
+              continue;
+          }
+          op = body.call(thisArg, _);
+        } catch (e) {
+          op = [6, e];
+          y = 0;
+        } finally {
+          f = t = 0;
+        }
+      if (op[0] & 5) throw op[1];
+      return { value: op[0] ? op[1] : void 0, done: true };
+    }
+  };
+
+var ImageDetails = styled.div(
+  templateObject_1 ||
+    (templateObject_1 = __makeTemplateObject(
+      [
+        '\n  margin-top: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 510px;\n\n  ',
+        ' {\n    width: 335px;\n    margin-top: 16px;\n  }\n\n  @media (max-width: 767px) {\n    margin-top: 24px;\n    align-items: center;\n    width: 100%;\n    margin-right: 0;\n  }\n\n  h5:hover {\n    color: ',
+        ';\n  }\n\n  ',
+        ' {\n    margin-right: 20px;\n    cursor: pointer;\n  }\n\n  .icon.liked {\n    path {\n      fill: #f94c66;\n    }\n  }\n\n  .shareIconStyle {\n    path {\n      stroke: none;\n      fill: ',
+        ';\n    }\n\n    :hover {\n      path {\n        fill: ',
+        ';\n      }\n    }\n  }\n\n  ',
+        ' {\n    margin-top: ',
+        ';\n    width: ',
+        ';\n\n    ',
+        ' {\n      margin-right: ',
+        ';\n    }\n  }\n',
+      ],
+      [
+        '\n  margin-top: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 510px;\n\n  ',
+        ' {\n    width: 335px;\n    margin-top: 16px;\n  }\n\n  @media (max-width: 767px) {\n    margin-top: 24px;\n    align-items: center;\n    width: 100%;\n    margin-right: 0;\n  }\n\n  h5:hover {\n    color: ',
+        ';\n  }\n\n  ',
+        ' {\n    margin-right: 20px;\n    cursor: pointer;\n  }\n\n  .icon.liked {\n    path {\n      fill: #f94c66;\n    }\n  }\n\n  .shareIconStyle {\n    path {\n      stroke: none;\n      fill: ',
+        ';\n    }\n\n    :hover {\n      path {\n        fill: ',
+        ';\n      }\n    }\n  }\n\n  ',
+        ' {\n    margin-top: ',
+        ';\n    width: ',
+        ';\n\n    ',
+        ' {\n      margin-right: ',
+        ';\n    }\n  }\n',
+      ]
+    )),
+  mediaQuery.desktop,
+  BlackColor,
+  StyledLikes,
+  TextDarkGrayColor,
+  TextGrayColor,
+  mediaQuery.minWidthFourK,
+  adaptiveValueCalc(16),
+  adaptiveValueCalc(510),
+  StyledLikes,
+  adaptiveValueCalc(20)
+);
+var SIconResizeWrapper = styled.div(
+  templateObject_2 ||
+    (templateObject_2 = __makeTemplateObject(
+      [
+        '\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ',
+        ' {\n    width: ',
+        ';\n    height: ',
+        ';\n  }\n',
+      ],
+      [
+        '\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ',
+        ' {\n    width: ',
+        ';\n    height: ',
+        ';\n  }\n',
+      ]
+    )),
+  mediaQuery.minWidthFourK,
+  adaptiveValueCalc(16),
+  adaptiveValueCalc(16)
+);
 export var Figcaption = function (_a) {
-    var _b;
-    var asset = _a.asset;
-    var isSignedIn = useUserStore(function (state) { return state.isSignedIn; });
-    var getUser = useUserStore(function (state) { return state.user; });
-    var _c = useFetchDynamicAssetLikes({
-        assetId: (asset === null || asset === void 0 ? void 0 : asset.getAssetId()) || '',
-    }), likesByUser = _c.likesByUser, isLikedByUser = _c.isLikedByUser, loading = _c.loading;
-    var url = typeof window !== 'undefined'
-        ? window.location.origin + window.location.pathname
-        : null;
-    var _d = useUiStore(function (state) { return ({
+  var _b;
+  var asset = _a.asset;
+  var isSignedIn = useUserStore(function (state) {
+    return state.isSignedIn;
+  });
+  var getUser = useUserStore(function (state) {
+    return state.user;
+  });
+  var _c = useFetchDynamicAssetLikes({
+      assetId:
+        (asset === null || asset === void 0 ? void 0 : asset.getAssetId()) ||
+        '',
+    }),
+    likesByUser = _c.likesByUser,
+    isLikedByUser = _c.isLikedByUser,
+    loading = _c.loading;
+  var url =
+    typeof window !== 'undefined'
+      ? window.location.origin + window.location.pathname
+      : null;
+  var _d = useUiStore(function (state) {
+      return {
         openModal: state.openModal,
         closeModal: state.closeModal,
         openAlert: state.openAlert,
         openModalSidebarPortal: state.openModalSidebarPortal,
-    }); }), openModal = _d.openModal, closeModal = _d.closeModal, openModalSidebarPortal = _d.openModalSidebarPortal, openAlert = _d.openAlert;
-    var userId = authCookies.getCookies().userId;
-    var _e = useWindowDimensionsWithServerInitial(), windowDimensions = _e.windowDimensions, isMobile = _e.isMobile;
-    var currentDimensions = (windowDimensions === null || windowDimensions === void 0 ? void 0 : windowDimensions.windowWidth) || 1440;
-    // const isCreator = useMemo(
-    //   () =>
-    //     Boolean(
-    //       asset?.getCreatorsProfiles() &&
-    //         asset
-    //           ?.getCreatorsProfiles()
-    //           .filter((item: schema.IProfile) => item?.userId === userId)
-    //     ),
-    //   [asset?.getCreatorsProfiles()]
-    // );
-    var isOwner = useMemo(function () {
-        return (asset === null || asset === void 0 ? void 0 : asset.getOwnersProfiles().filter(function (item) { return (item === null || item === void 0 ? void 0 : item.userId) === userId; }).length) !== 0;
-    }, [asset === null || asset === void 0 ? void 0 : asset.getOwnersProfiles()]);
-    var onShareBtnClick = function () {
-        var title = (asset === null || asset === void 0 ? void 0 : asset.getName()) || undefined;
-        openModal(<ShareDialog link={url} onHide={closeModal} params={{
-                telegram: {
-                    title: title,
-                },
-                whatsapp: {
-                    title: title,
-                },
-                twitter: {
-                    title: title,
-                    hashtags: ['ludo', 'nft'],
-                },
-                reddit: {
-                    title: title,
-                },
-                facebook: {
-                    quote: title,
-                    hashtag: '#ludo',
-                },
-            }}/>);
-    };
-    var onAddFavoriteClick = function () {
-        return openModalSidebarPortal(<AddAssetToFavoriteList ids={[asset === null || asset === void 0 ? void 0 : asset.getAssetId()]}/>);
-    };
-    var onAddGalleryClick = function () {
-        return openModalSidebarPortal(<AddAssetToGallery ids={[asset === null || asset === void 0 ? void 0 : asset.getAssetId()]}/>);
-    };
-    return (<ImageDetails>
+      };
+    }),
+    openModal = _d.openModal,
+    closeModal = _d.closeModal,
+    openModalSidebarPortal = _d.openModalSidebarPortal,
+    openAlert = _d.openAlert;
+  var userId = authCookies.getCookies().userId;
+  var _e = useWindowDimensionsWithServerInitial(),
+    windowDimensions = _e.windowDimensions,
+    isMobile = _e.isMobile;
+  var currentDimensions =
+    (windowDimensions === null || windowDimensions === void 0
+      ? void 0
+      : windowDimensions.windowWidth) || 1440;
+  // const isCreator = useMemo(
+  //   () =>
+  //     Boolean(
+  //       asset?.getCreatorsProfiles() &&
+  //         asset
+  //           ?.getCreatorsProfiles()
+  //           .filter((item: schema.IProfile) => item?.userId === userId)
+  //     ),
+  //   [asset?.getCreatorsProfiles()]
+  // );
+  var isOwner = useMemo(
+    function () {
+      return (
+        (asset === null || asset === void 0
+          ? void 0
+          : asset.getOwnersProfiles().filter(function (item) {
+              return (
+                (item === null || item === void 0 ? void 0 : item.userId) ===
+                userId
+              );
+            }).length) !== 0
+      );
+    },
+    [asset === null || asset === void 0 ? void 0 : asset.getOwnersProfiles()]
+  );
+  var onShareBtnClick = function () {
+    var title =
+      (asset === null || asset === void 0 ? void 0 : asset.getName()) ||
+      undefined;
+    openModal(
+      <ShareDialog
+        link={url}
+        onHide={closeModal}
+        params={{
+          telegram: {
+            title: title,
+          },
+          whatsapp: {
+            title: title,
+          },
+          twitter: {
+            title: title,
+            hashtags: ['ludo', 'nft'],
+          },
+          reddit: {
+            title: title,
+          },
+          facebook: {
+            quote: title,
+            hashtag: '#ludo',
+          },
+        }}
+      />
+    );
+  };
+  var onAddFavoriteClick = function () {
+    return openModalSidebarPortal(
+      <AddAssetToFavoriteList
+        ids={[asset === null || asset === void 0 ? void 0 : asset.getAssetId()]}
+      />
+    );
+  };
+  var onAddGalleryClick = function () {
+    return openModalSidebarPortal(
+      <AddAssetToGallery
+        ids={[asset === null || asset === void 0 ? void 0 : asset.getAssetId()]}
+      />
+    );
+  };
+  return (
+    <ImageDetails>
       <Flex alignItems="center">
-        {loading ? (<Skeleton style={{
-                borderRadius: "".concat(getAdaptiveValueWithCheck4k({
-                    windowDimensions: windowDimensions,
-                    currentSize: 3,
-                }), "px"),
-                marginRight: "".concat(getAdaptiveValueWithCheck4k({
-                    windowDimensions: windowDimensions,
-                    currentSize: 16.8,
-                }), "px"),
-            }} height="100%" width={"".concat(getAdaptiveValueWithCheck4k({
+        {loading ? (
+          <Skeleton
+            style={{
+              borderRadius: ''.concat(
+                getAdaptiveValueWithCheck4k({
+                  windowDimensions: windowDimensions,
+                  currentSize: 3,
+                }),
+                'px'
+              ),
+              marginRight: ''.concat(
+                getAdaptiveValueWithCheck4k({
+                  windowDimensions: windowDimensions,
+                  currentSize: 16.8,
+                }),
+                'px'
+              ),
+            }}
+            height="100%"
+            width={''.concat(
+              getAdaptiveValueWithCheck4k({
                 windowDimensions: windowDimensions,
                 currentSize: 30,
-            }), "px")}/>) : (<AssetLikes assetId={(asset === null || asset === void 0 ? void 0 : asset.getAssetId()) || ''} isLikedByUser={isLikedByUser} likesByUser={likesByUser}/>)}
+              }),
+              'px'
+            )}
+          />
+        ) : (
+          <AssetLikes
+            assetId={
+              (asset === null || asset === void 0
+                ? void 0
+                : asset.getAssetId()) || ''
+            }
+            isLikedByUser={isLikedByUser}
+            likesByUser={likesByUser}
+          />
+        )}
 
-        {isSignedIn && (<>
-            {(((asset === null || asset === void 0 ? void 0 : asset.getCreatorsAddresses()) &&
-                ((_b = asset === null || asset === void 0 ? void 0 : asset.getCreatorsAddresses()) === null || _b === void 0 ? void 0 : _b[0]) === (getUser === null || getUser === void 0 ? void 0 : getUser.wallets[0])) ||
-                isOwner) && (<IconWithButton variant={'figcaption'} text={currentDimensions > ScreenWidth.DESKTOP
+        {isSignedIn && (
+          <>
+            {(((asset === null || asset === void 0
+              ? void 0
+              : asset.getCreatorsAddresses()) &&
+              ((_b =
+                asset === null || asset === void 0
+                  ? void 0
+                  : asset.getCreatorsAddresses()) === null || _b === void 0
+                ? void 0
+                : _b[0]) ===
+                (getUser === null || getUser === void 0
+                  ? void 0
+                  : getUser.wallets[0])) ||
+              isOwner) && (
+              <IconWithButton
+                variant={'figcaption'}
+                text={
+                  currentDimensions > ScreenWidth.DESKTOP
                     ? 'Add to Gallery'
-                    : '+ Gallery'} onClick={onAddGalleryClick}>
+                    : '+ Gallery'
+                }
+                onClick={onAddGalleryClick}
+              >
                 <SIconResizeWrapper>
-                  <GalleryIcon style={getAdaptiveScale({
-                    windowDimensions: windowDimensions,
-                    currentSize: 1,
-                })}/>
+                  <GalleryIcon
+                    style={getAdaptiveScale({
+                      windowDimensions: windowDimensions,
+                      currentSize: 1,
+                    })}
+                  />
                 </SIconResizeWrapper>
-              </IconWithButton>)}
-            <IconWithButton variant={'figcaption'} text={currentDimensions > ScreenWidth.DESKTOP
-                ? 'Add to Favourite list'
-                : '+Fave list'} onClick={onAddFavoriteClick}>
+              </IconWithButton>
+            )}
+            <IconWithButton
+              variant={'figcaption'}
+              text={
+                currentDimensions > ScreenWidth.DESKTOP
+                  ? 'Add to Favourite list'
+                  : '+Fave list'
+              }
+              onClick={onAddFavoriteClick}
+            >
               <SIconResizeWrapper>
-                <FavoriteIcon style={getAdaptiveScale({ windowDimensions: windowDimensions, currentSize: 1 })}/>
+                <FavoriteIcon
+                  style={getAdaptiveScale({
+                    windowDimensions: windowDimensions,
+                    currentSize: 1,
+                  })}
+                />
               </SIconResizeWrapper>
             </IconWithButton>
-          </>)}
+          </>
+        )}
       </Flex>
       <Flex>
-        {!isMobile && (<IconWithButton variant={'share'} text={''} onClick={onShareBtnClick}>
+        {!isMobile && (
+          <IconWithButton variant={'share'} text={''} onClick={onShareBtnClick}>
             <SIconResizeWrapper>
-              <ShareIcon className="shareIconStyle" style={getAdaptiveScale({ windowDimensions: windowDimensions, currentSize: 1 })}/>
+              <ShareIcon
+                className="shareIconStyle"
+                style={getAdaptiveScale({
+                  windowDimensions: windowDimensions,
+                  currentSize: 1,
+                })}
+              />
             </SIconResizeWrapper>
-          </IconWithButton>)}
+          </IconWithButton>
+        )}
 
-        <MoreDropDown items={[
+        <MoreDropDown
+          items={[
             // {
             //   id: 'make',
             //   title: 'Make profile picture',
             // },
             {
-                id: 'copy',
-                title: 'Copy link',
-                onClick: function () {
-                    return __awaiter(this, void 0, void 0, function () {
-                        return __generator(this, function (_a) {
-                            switch (_a.label) {
-                                case 0: return [4 /*yield*/, copyToClipboard(window.location.href)];
-                                case 1:
-                                    _a.sent();
-                                    openAlert({
-                                        type: alertVariants.copied,
-                                    });
-                                    return [2 /*return*/];
-                            }
+              id: 'copy',
+              title: 'Copy link',
+              onClick: function () {
+                return __awaiter(this, void 0, void 0, function () {
+                  return __generator(this, function (_a) {
+                    switch (_a.label) {
+                      case 0:
+                        return [
+                          4 /*yield*/,
+                          copyToClipboard(window.location.href),
+                        ];
+                      case 1:
+                        _a.sent();
+                        openAlert({
+                          type: alertVariants.copied,
                         });
-                    });
-                },
+                        return [2 /*return*/];
+                    }
+                  });
+                });
+              },
             },
             // {
             //   id: 'Hide',
             //   title: 'Hide'
             // }
-        ]}/>
+          ]}
+        />
       </Flex>
-    </ImageDetails>);
+    </ImageDetails>
+  );
 };
 var templateObject_1, templateObject_2;