Select roadmap modal fix

images-fix
Kamran Ahmed 1 year ago
parent 5edda5654c
commit b11da48f41
  1. 16
      src/components/CreateTeam/SelectRoadmapModal.tsx

@ -3,8 +3,8 @@ import { useKeydown } from '../../hooks/use-keydown';
import { useOutsideClick } from '../../hooks/use-outside-click'; import { useOutsideClick } from '../../hooks/use-outside-click';
import type { PageType } from '../CommandMenu/CommandMenu'; import type { PageType } from '../CommandMenu/CommandMenu';
import type { TeamResourceConfig } from './RoadmapSelector'; import type { TeamResourceConfig } from './RoadmapSelector';
import CloseIcon from '../../icons/close.svg';
import { SelectRoadmapModalItem } from './SelectRoadmapModalItem'; import { SelectRoadmapModalItem } from './SelectRoadmapModalItem';
import { XIcon } from 'lucide-react';
export type SelectRoadmapModalProps = { export type SelectRoadmapModalProps = {
teamId: string; teamId: string;
@ -60,11 +60,11 @@ export function SelectRoadmapModal(props: SelectRoadmapModalProps) {
setSearchResults(searchResults); setSearchResults(searchResults);
}, [searchText, allRoadmaps]); }, [searchText, allRoadmaps]);
const roleBasedRoadmaps = searchResults.filter((roadmap) => const roleBasedRoadmaps = searchResults.filter(
roadmap?.metadata?.tags?.includes('role-roadmap') (roadmap) => roadmap?.metadata?.tags?.includes('role-roadmap'),
); );
const skillBasedRoadmaps = searchResults.filter((roadmap) => const skillBasedRoadmaps = searchResults.filter(
roadmap?.metadata?.tags?.includes('skill-roadmap') (roadmap) => roadmap?.metadata?.tags?.includes('skill-roadmap'),
); );
return ( return (
@ -79,7 +79,7 @@ export function SelectRoadmapModal(props: SelectRoadmapModalProps) {
className="popup-close absolute right-2.5 top-3 ml-auto inline-flex items-center rounded-lg bg-transparent p-1.5 text-sm text-gray-400 hover:bg-gray-100 hover:text-gray-900" className="popup-close absolute right-2.5 top-3 ml-auto inline-flex items-center rounded-lg bg-transparent p-1.5 text-sm text-gray-400 hover:bg-gray-100 hover:text-gray-900"
onClick={onClose} onClick={onClose}
> >
<img alt={'close'} src={CloseIcon.src} className="h-4 w-4" /> <XIcon className="h-4 w-4" />
<span className="sr-only">Close modal</span> <span className="sr-only">Close modal</span>
</button> </button>
<input <input
@ -101,7 +101,7 @@ export function SelectRoadmapModal(props: SelectRoadmapModalProps) {
<div className="mb-5 flex flex-wrap items-center gap-2"> <div className="mb-5 flex flex-wrap items-center gap-2">
{roleBasedRoadmaps.map((roadmap) => { {roleBasedRoadmaps.map((roadmap) => {
const isSelected = !!teamResourceConfig?.find( const isSelected = !!teamResourceConfig?.find(
(r) => r.resourceId === roadmap.id (r) => r.resourceId === roadmap.id,
); );
return ( return (
@ -127,7 +127,7 @@ export function SelectRoadmapModal(props: SelectRoadmapModalProps) {
<div className="flex flex-wrap items-center gap-2"> <div className="flex flex-wrap items-center gap-2">
{skillBasedRoadmaps.map((roadmap) => { {skillBasedRoadmaps.map((roadmap) => {
const isSelected = !!teamResourceConfig.find( const isSelected = !!teamResourceConfig.find(
(r) => r.resourceId === roadmap.id (r) => r.resourceId === roadmap.id,
); );
return ( return (

Loading…
Cancel
Save