fix: make custom search select handle undefined options (#1094)

* fix: make search select handle undefined options

* fix: kanban y-scroll
This commit is contained in:
Aaryan Khandelwal 2023-05-20 16:00:41 +05:30 committed by GitHub
parent 012486df11
commit 9ccc35d181
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 179 additions and 180 deletions

View File

@ -152,7 +152,7 @@ export const AnalyticsSidebar: React.FC<Props> = ({
return (
<div key={project.id}>
<h5 className="text-sm flex items-center gap-1">
<div className="text-sm flex items-center gap-1">
{project.emoji ? (
<span className="grid h-6 w-6 flex-shrink-0 place-items-center">
{String.fromCodePoint(parseInt(project.emoji))}
@ -171,8 +171,13 @@ export const AnalyticsSidebar: React.FC<Props> = ({
{project?.name.charAt(0)}
</span>
)}
<span className="break-all">{project.name}</span>
<h5 className="break-all">
{project.name}
<span className="text-brand-secondary text-xs ml-1">
({project.identifier})
</span>
</h5>
</div>
<div className="mt-4 space-y-3 pl-2">
<div className="flex items-center justify-between gap-2 text-xs">
<div className="flex items-center gap-2">

View File

@ -99,7 +99,7 @@ export const SingleBoard: React.FC<Props> = ({
</div>
</>
)}
<div className="pt-3">
<div className="pt-3 overflow-y-auto">
{groupedByIssues?.[groupTitle].map((issue, index) => (
<Draggable
key={issue.id}

View File

@ -23,12 +23,13 @@ type Props = {
export const GithubImportData: FC<Props> = ({ handleStepChange, integration, control, watch }) => {
const { projects } = useProjects();
const options =
projects.map((project) => ({
const options = projects
? projects.map((project) => ({
value: project.id,
query: project.name,
content: <p>{truncateText(project.name, 25)}</p>,
})) ?? [];
}))
: undefined;
return (
<div className="mt-6">

View File

@ -44,8 +44,7 @@ export const SingleUserSelect: React.FC<Props> = ({ collaborator, index, users,
workspaceSlug ? () => workspaceService.workspaceMembers(workspaceSlug.toString()) : null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.email,
query:
(member.member.first_name && member.member.first_name !== ""
@ -61,7 +60,7 @@ export const SingleUserSelect: React.FC<Props> = ({ collaborator, index, users,
: member.member.email}
</div>
),
})) ?? [];
}));
return (
<div className="grid grid-cols-3 items-center gap-2 rounded-md bg-brand-surface-2 px-2 py-3">

View File

@ -32,8 +32,7 @@ export const JiraImportUsers: FC = () => {
const { workspaceMembers: members } = useWorkspaceMembers(workspaceSlug?.toString());
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.email,
query:
(member.member.first_name && member.member.first_name !== ""
@ -49,7 +48,7 @@ export const JiraImportUsers: FC = () => {
: member.member.email}
</div>
),
})) ?? [];
}));
return (
<div className="h-full w-full space-y-10 divide-y-2 divide-brand-base overflow-y-auto">

View File

@ -29,8 +29,7 @@ export const IssueAssigneeSelect: React.FC<Props> = ({ projectId, value = [], on
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -48,7 +47,7 @@ export const IssueAssigneeSelect: React.FC<Props> = ({ projectId, value = [], on
} ${member.member.last_name ?? ""}`}
</div>
),
})) ?? [];
}));
return (
<CustomSearchSelect

View File

@ -33,8 +33,7 @@ export const SidebarAssigneeSelect: React.FC<Props> = ({ value, onChange, userAu
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -52,7 +51,7 @@ export const SidebarAssigneeSelect: React.FC<Props> = ({ value, onChange, userAu
} ${member.member.last_name ?? ""}`}
</div>
),
})) ?? [];
}));
const isNotAllowed = userAuth.isGuest || userAuth.isViewer;

View File

@ -43,8 +43,7 @@ export const ViewAssigneeSelect: React.FC<Props> = ({
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -62,7 +61,7 @@ export const ViewAssigneeSelect: React.FC<Props> = ({
} ${member.member.last_name ?? ""}`}
</div>
),
})) ?? [];
}));
return (
<CustomSearchSelect

View File

@ -30,8 +30,7 @@ export const ModuleLeadSelect: React.FC<Props> = ({ value, onChange }) => {
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -47,7 +46,7 @@ export const ModuleLeadSelect: React.FC<Props> = ({ value, onChange }) => {
: member.member.email}
</div>
),
})) ?? [];
}));
const selectedOption = members?.find((m) => m.member.id === value)?.member;

View File

@ -28,8 +28,7 @@ export const ModuleMembersSelect: React.FC<Props> = ({ value, onChange }) => {
? () => projectServices.projectMembers(workspaceSlug as string, projectId as string)
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -45,7 +44,7 @@ export const ModuleMembersSelect: React.FC<Props> = ({ value, onChange }) => {
: member.member.email}
</div>
),
})) ?? [];
}));
return (
<CustomSearchSelect

View File

@ -31,8 +31,7 @@ export const SidebarLeadSelect: React.FC<Props> = ({ value, onChange }) => {
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -48,7 +47,7 @@ export const SidebarLeadSelect: React.FC<Props> = ({ value, onChange }) => {
: member.member.email}
</div>
),
})) ?? [];
}));
const selectedOption = members?.find((m) => m.member.id === value)?.member;

View File

@ -29,8 +29,7 @@ export const SidebarMembersSelect: React.FC<Props> = ({ value, onChange }) => {
: null
);
const options =
members?.map((member) => ({
const options = members?.map((member) => ({
value: member.member.id,
query:
(member.member.first_name && member.member.first_name !== ""
@ -46,7 +45,7 @@ export const SidebarMembersSelect: React.FC<Props> = ({ value, onChange }) => {
: member.member.email}
</div>
),
})) ?? [];
}));
return (
<div className="flex items-center justify-start gap-1">

View File

@ -9,11 +9,13 @@ import { CheckIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline";
type CustomSearchSelectProps = {
value: any;
onChange: any;
options: {
options:
| {
value: any;
query: string;
content: JSX.Element;
}[];
}[]
| undefined;
label?: string | JSX.Element;
textAlignment?: "left" | "center" | "right";
height?: "sm" | "md" | "rg" | "lg";

View File

@ -89,7 +89,7 @@ export const cosineSimilarity = (a: string, b: string) => {
};
export const generateRandomColor = (string: string): string => {
if (!string) return "var(--color-accent)";
if (!string) return "rgb(var(--color-accent))";
string = `${string}`;