helpers removed in mobile

Vizzuality · Jan 17, 2024 · efdafc6 · efdafc6
1 parent 48fb80d
commit efdafc6
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 238 deletions.
diff --git a/src/containers/map/mobile/legend/index.tsx b/src/containers/map/mobile/legend/index.tsx
@@ -9,7 +9,6 @@ import { FaArrowDown, FaArrowUp } from 'react-icons/fa6';
 import { useRecoilState } from 'recoil';
 
 import { MAP_LEGENDS, WIDGETS } from 'containers/datasets';
-import Helper from 'containers/guide/helper';
 import { LAYERS } from 'containers/layers/constants';
 import WidgetWrapper from 'containers/widget';
 
@@ -101,8 +100,6 @@ const Legend = () => {
     [activeLayers, setActiveLayers]
   );
 
-  const HELPER_ID = activeLayers[0]?.id;
-
   const contentVariants = {
     open: { y: '0%', opacity: 1 },
     close: { y: '-200%', opacity: 0 },
@@ -178,22 +175,10 @@ const Legend = () => {
                             <div className="ml-2 flex items-center">
                               <Dialog>
                                 <DialogTrigger>
-                                  <Helper
-                                    className={{
-                                      button:
-                                        HELPER_ID === l.id
-                                          ? '-bottom-[11px] right-0 z-20'
-                                          : 'hidden',
-                                      tooltip: 'w-fit-content',
-                                    }}
-                                    tooltipPosition={{ top: 60, left: 0 }}
-                                    message="Info layer"
-                                  >
-                                    <Icon
-                                      icon={INFO_SVG}
-                                      className="mr-1.5 mt-1.5 h-[17px] w-[17px] fill-black/40"
-                                    />
-                                  </Helper>
+                                  <Icon
+                                    icon={INFO_SVG}
+                                    className="mr-1.5 mt-1.5 h-[17px] w-[17px] fill-black/40"
+                                  />
                                 </DialogTrigger>
 
                                 <DialogContent
@@ -216,19 +201,7 @@ const Legend = () => {
                               <Popover>
                                 <PopoverTrigger>
                                   <div aria-label="Opacity layer">
-                                    <Helper
-                                      className={{
-                                        button:
-                                          HELPER_ID === l.id
-                                            ? '-bottom-3.5 right-0 z-20'
-                                            : 'hidden',
-                                        tooltip: 'w-fit-content',
-                                      }}
-                                      tooltipPosition={{ top: 60, left: 0 }}
-                                      message="Set opacity layer"
-                                    >
-                                      <Icon icon={OPACITY_SVG} className="mr-0.5 h-6 w-6" />
-                                    </Helper>
+                                    <Icon icon={OPACITY_SVG} className="mr-0.5 h-6 w-6" />
                                   </div>
                                 </PopoverTrigger>
 
@@ -251,42 +224,22 @@ const Legend = () => {
                                 onClick={() => onChangeVisibility(l.id)}
                                 aria-label="Visibility layer"
                               >
-                                <Helper
-                                  className={{
-                                    button:
-                                      HELPER_ID === l.id ? '-bottom-3.5 -right-1 z-20' : 'hidden',
-                                    tooltip: 'w-fit-content',
-                                  }}
-                                  tooltipPosition={{ top: 60, left: 0 }}
-                                  message="Hide/show layer"
-                                >
-                                  <Icon
-                                    icon={visibility ? HIDE_SVG : SHOW_SVG}
-                                    className={cn({
-                                      'mx-px !fill-black/40': true,
-                                      'h-6 w-6': visibility,
-                                      'h-5 w-6': !visibility,
-                                    })}
-                                  />
-                                </Helper>
+                                <Icon
+                                  icon={visibility ? HIDE_SVG : SHOW_SVG}
+                                  className={cn({
+                                    'mx-px !fill-black/40': true,
+                                    'h-6 w-6': visibility,
+                                    'h-5 w-6': !visibility,
+                                  })}
+                                />
                               </button>
 
                               <button
                                 type="button"
                                 onClick={() => removeLayer(l.id)}
                                 aria-label="Remove layer"
                               >
-                                <Helper
-                                  className={{
-                                    button:
-                                      HELPER_ID === l.id ? '-bottom-3 -right-1 z-20' : 'hidden',
-                                    tooltip: 'w-fit-content',
-                                  }}
-                                  tooltipPosition={{ top: 60, left: 0 }}
-                                  message="Remove layer"
-                                >
-                                  <Icon icon={CLOSE_SVG} className="ml-0.5 h-5 w-5 stroke-2" />
-                                </Helper>
+                                <Icon icon={CLOSE_SVG} className="ml-0.5 h-5 w-5 stroke-2" />
                               </button>
                             </div>
                           </div>

diff --git a/src/containers/navigation/category/index.tsx b/src/containers/navigation/category/index.tsx
diff --git a/src/containers/navigation/mobile/language-selector/index.tsx b/src/containers/navigation/mobile/language-selector/index.tsx
@@ -1,7 +1,5 @@
 import { useCallback, useState, MouseEvent, useEffect } from 'react';
 
-import Helper from 'containers/guide/helper';
-
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -73,16 +71,6 @@ const LanguageSelector = () => {
               </button>
             </DropdownMenuItem>
           ))}
-          <div className="absolute right-0 z-[1000] h-10 w-10">
-            <Helper
-              className={{
-                button: 'top-1 right-[100px]',
-                tooltip: 'w-fit-content',
-              }}
-              tooltipPosition={{ top: -40, left: 260 }}
-              message="Choose your preferred language here. There is a choice between English, French and Spanish"
-            ></Helper>
-          </div>
         </DropdownMenuContent>
       </DropdownMenu>
     </div>