From d2bd1eda6f0dae7e79c04146868e8a45b24e8115 Mon Sep 17 00:00:00 2001
From: Leonardo <leomilho@gmail.com>
Date: Tue, 11 Jun 2024 09:39:42 +0200
Subject: [PATCH] Revert "fix: popover trigger used outside popover"
This reverts commit b3fa44e308a456df97b58e3f8fb6ba026536f823.
---
apps/web/src/components/navbar/navbar.tsx | 2 +-
.../shared/lib/components/dropdowns/index.tsx | 30 +++++++------------
.../panel/querysidepanel/queryMLDialog.tsx | 1 +
.../logicpill/QueryLogicPill.tsx | 1 -
libs/shared/lib/vis/components/bar.tsx | 2 +-
5 files changed, 13 insertions(+), 23 deletions(-)
diff --git a/apps/web/src/components/navbar/navbar.tsx b/apps/web/src/components/navbar/navbar.tsx
index c8554d064..d6c6923a7 100644
--- a/apps/web/src/components/navbar/navbar.tsx
+++ b/apps/web/src/components/navbar/navbar.tsx
@@ -13,7 +13,7 @@ import logo_white from './gp-logo-white.svg';
import logo from './gp-logo.svg';
import { useAuthorizationCache, useAuth } from '@graphpolaris/shared/lib/data-access';
import DatabaseSelector from './DatabaseManagement/dbConnectionSelector';
-import { DropdownItem } from '@graphpolaris/shared/lib/components/dropdowns';
+import { DropdownItem, DropdownItemContainer } from '@graphpolaris/shared/lib/components/dropdowns';
import GpLogo from './gp-logo';
import { Popover, PopoverContent, PopoverTrigger } from '@graphpolaris/shared/lib/components/layout/Popover';
diff --git a/libs/shared/lib/components/dropdowns/index.tsx b/libs/shared/lib/components/dropdowns/index.tsx
index cc2171f84..7a56352d3 100644
--- a/libs/shared/lib/components/dropdowns/index.tsx
+++ b/libs/shared/lib/components/dropdowns/index.tsx
@@ -12,11 +12,10 @@ type DropdownTriggerProps = {
disabled?: boolean;
variant?: 'primary' | 'ghost' | 'outline';
className?: string;
- popover?: boolean;
onClick?: () => void;
};
-export function DropdownTrigger({ title, size, disabled, variant, className, onClick, popover = true }: DropdownTriggerProps) {
+export function DropdownTrigger({ title, size, disabled, variant, className, onClick }: DropdownTriggerProps) {
const paddingClass = size === 'xs' ? 'py-0' : size === 'sm' ? 'px-1 py-1' : size === 'md' ? 'px-2 py-1' : 'px-4 py-2';
const textSizeClass = size === 'xs' ? 'text-xs' : size === 'sm' ? 'text-sm' : size === 'md' ? 'text-base' : 'text-lg';
@@ -26,25 +25,16 @@ export function DropdownTrigger({ title, size, disabled, variant, className, onC
: variant === 'ghost'
? 'bg-transparent shadow-none'
: 'border rounded bg-transparent';
-
- const inner = (
- <div
- className={`inline-flex w-full truncate justify-between items-center gap-x-1.5 ${variantClass} ${textSizeClass} ${paddingClass} text-secondary-900 shadow-sm hover:bg-secondary-50 disabled:bg-secondary-100 disabled:cursor-not-allowed disabled:text-secondary-400 pl-1 truncate${className ? ` ${className}` : ''}`}
- >
- <span className={`text-${size}`}>{title}</span>
- <Icon component={<ArrowDropDown />} size={16} />
- </div>
+ return (
+ <PopoverTrigger onClick={onClick}>
+ <div
+ className={`inline-flex w-full truncate justify-between items-center gap-x-1.5 ${variantClass} ${textSizeClass} ${paddingClass} text-secondary-900 shadow-sm hover:bg-secondary-50 disabled:bg-secondary-100 disabled:cursor-not-allowed disabled:text-secondary-400 pl-1 truncate${className ? ` ${className}` : ''}`}
+ >
+ <span className={`text-${size}`}>{title}</span>
+ <Icon component={<ArrowDropDown />} size={16} />
+ </div>
+ </PopoverTrigger>
);
-
- if (popover) {
- return <PopoverTrigger onClick={onClick}>{inner}</PopoverTrigger>;
- } else
- return (
- <button className="w-full" onClick={onClick}>
- {' '}
- {inner}
- </button>
- );
}
type DropdownItemContainerProps = {
diff --git a/libs/shared/lib/querybuilder/panel/querysidepanel/queryMLDialog.tsx b/libs/shared/lib/querybuilder/panel/querysidepanel/queryMLDialog.tsx
index 8fd52cdd7..213807e6b 100644
--- a/libs/shared/lib/querybuilder/panel/querysidepanel/queryMLDialog.tsx
+++ b/libs/shared/lib/querybuilder/panel/querysidepanel/queryMLDialog.tsx
@@ -8,6 +8,7 @@ import {
} from '@graphpolaris/shared/lib/data-access/store/mlSlice';
import { FormDiv, FormCard, FormBody, FormTitle, FormHBar } from '@graphpolaris/shared/lib/components/forms';
import { Input } from '@graphpolaris/shared/lib/components/inputs';
+import { PopoverTrigger } from '@graphpolaris/shared/lib/components/layout/Popover';
export const QueryMLDialog = () => {
const dispatch = useAppDispatch();
diff --git a/libs/shared/lib/querybuilder/pills/customFlowPills/logicpill/QueryLogicPill.tsx b/libs/shared/lib/querybuilder/pills/customFlowPills/logicpill/QueryLogicPill.tsx
index 79cdea0e8..09a9e534b 100644
--- a/libs/shared/lib/querybuilder/pills/customFlowPills/logicpill/QueryLogicPill.tsx
+++ b/libs/shared/lib/querybuilder/pills/customFlowPills/logicpill/QueryLogicPill.tsx
@@ -74,7 +74,6 @@ export function QueryLogicPill(node: SchemaReactflowLogicNode) {
<div className={`py-1 h-fit border-[1px] border-secondary-200 ${data.selected ? 'bg-secondary-400' : 'bg-secondary-100'}`}>
{/* <div className="m-1 mx-2 text-left">{output.name}</div> */}
<DropdownTrigger
- popover={false}
title={output.name}
variant="ghost"
size="xs"
diff --git a/libs/shared/lib/vis/components/bar.tsx b/libs/shared/lib/vis/components/bar.tsx
index fa1c79de7..fe25a8bc0 100644
--- a/libs/shared/lib/vis/components/bar.tsx
+++ b/libs/shared/lib/vis/components/bar.tsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Button, DropdownItem } from '../../components';
+import { Button, DropdownTrigger, DropdownItemContainer, DropdownItem, Icon, DropdownContainer } from '../../components';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../components/tooltip';
import { Add, Close, Fullscreen } from '@mui/icons-material';
import { ControlContainer } from '../../components/controls';
--
GitLab