awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-08 14:28:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #602 from piyushchhabra/fix/project-list-scroll

Browse Source 
fix(ui): fixed scroll on project list selection
This commit is contained in:
vmatsiiako
2023-05-26 23:13:07 -07:00
committed by GitHub
parent 8e5db3ee2f bfbe2f2dcf
commit 3d3b416da2
2 changed files with 12 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/v2/Select/Select.tsx
+7 -3
View File
@@ -1,6 +1,6 @@
import { forwardRef, ReactNode } from 'react'; import { forwardRef, ReactNode } from 'react';
import { IconProp } from '@fortawesome/fontawesome-svg-core'; import { IconProp } from '@fortawesome/fontawesome-svg-core';
import { faCaretDown, faCheck, faChevronUp } from '@fortawesome/free-solid-svg-icons'; import { faCaretDown, faCaretUp,faCheck } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import * as SelectPrimitive from '@radix-ui/react-select'; import * as SelectPrimitive from '@radix-ui/react-select';
import { twMerge } from 'tailwind-merge'; import { twMerge } from 'tailwind-merge';
@@ -63,7 +63,9 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
style={{ width: 'var(--radix-select-trigger-width)' }} style={{ width: 'var(--radix-select-trigger-width)' }}
> >
<SelectPrimitive.ScrollUpButton> <SelectPrimitive.ScrollUpButton>
<FontAwesomeIcon icon={faChevronUp} size="sm" /> <div className="flex items-center justify-center">
<FontAwesomeIcon icon={faCaretUp} size="sm" />
</div>
</SelectPrimitive.ScrollUpButton> </SelectPrimitive.ScrollUpButton>
<SelectPrimitive.Viewport className="p-1"> <SelectPrimitive.Viewport className="p-1">
{isLoading ? ( {isLoading ? (
@@ -76,7 +78,9 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
)} )}
</SelectPrimitive.Viewport> </SelectPrimitive.Viewport>
<SelectPrimitive.ScrollDownButton> <SelectPrimitive.ScrollDownButton>
<FontAwesomeIcon icon={faCaretDown} size="xs" /> <div className="flex items-center justify-center">
<FontAwesomeIcon icon={faCaretDown} size="sm" />
</div>
</SelectPrimitive.ScrollDownButton> </SelectPrimitive.ScrollDownButton>
</SelectPrimitive.Content> </SelectPrimitive.Content>
</SelectPrimitive.Portal> </SelectPrimitive.Portal>
frontend/src/layouts/AppLayout/AppLayout.tsx
+5 -3
View File
@@ -261,9 +261,10 @@ export const AppLayout = ({ children }: LayoutProps) => {
router.push(`/dashboard/${value}`); router.push(`/dashboard/${value}`);
}} }}
position="popper" position="popper"
dropdownContainerClassName="text-bunker-200 bg-mineshaft-800 border border-mineshaft-600 z-50" dropdownContainerClassName="text-bunker-200 bg-mineshaft-800 border border-mineshaft-600 z-50 max-h-96 border-gray-700"
> >
{workspaces <div className='h-full no-scrollbar no-scrollbar::-webkit-scrollbar'>
{workspaces
.filter((ws) => ws.organization === currentOrg?._id) .filter((ws) => ws.organization === currentOrg?._id)
.map(({ _id, name }) => ( .map(({ _id, name }) => (
<SelectItem <SelectItem
@@ -274,7 +275,8 @@ export const AppLayout = ({ children }: LayoutProps) => {
{name} {name}
</SelectItem> </SelectItem>
))} ))}
{/* <hr className="mt-1 mb-1 h-px border-0 bg-gray-700" /> */} </div>
<hr className="mt-1 mb-1 h-px border-0 bg-gray-700" />
<div className="w-full"> <div className="w-full">
<Button <Button
className="w-full bg-mineshaft-700 py-2 text-bunker-200" className="w-full bg-mineshaft-700 py-2 text-bunker-200"