fix: kanban layout UI (#3023)

* fix: quick add placement

* fix: assignee avatar size in kanban header

* fix: issue detail sidebar scroll

* fix: extra margin around links

* formatting
This commit is contained in:
Lakhan Baheti 2023-12-07 18:13:54 +05:30 committed by GitHub
parent 196e994519
commit e2e91f4aae
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 20 deletions

View File

@ -109,8 +109,8 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
)} )}
<div <div
className={`min-h-[150px] ${ className={`${
verticalAlignPosition(_list) ? `w-[0px] overflow-hidden` : `w-full transition-all` verticalAlignPosition(_list) ? `min-h-[150px] w-[0px] overflow-hidden` : `w-full transition-all`
}`} }`}
> >
<Droppable droppableId={`${getValueFromObject(_list, listKey) as string}__${sub_group_id}`}> <Droppable droppableId={`${getValueFromObject(_list, listKey) as string}__${sub_group_id}`}>
@ -122,7 +122,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
{...provided.droppableProps} {...provided.droppableProps}
ref={provided.innerRef} ref={provided.innerRef}
> >
{issues ? ( {issues && !verticalAlignPosition(_list) ? (
<KanbanIssueBlocksList <KanbanIssueBlocksList
sub_group_id={sub_group_id} sub_group_id={sub_group_id}
columnId={getValueFromObject(_list, listKey) as string} columnId={getValueFromObject(_list, listKey) as string}

View File

@ -22,7 +22,7 @@ export interface IAssigneesHeader {
addIssuesToView?: (issueIds: string[]) => Promise<IIssue>; addIssuesToView?: (issueIds: string[]) => Promise<IIssue>;
} }
export const Icon = ({ user }: any) => <Avatar name={user.display_name} src={user.avatar} size="base" />; export const Icon = ({ user }: any) => <Avatar name={user.display_name} src={user.avatar} size="md" />;
export const AssigneesHeader: FC<IAssigneesHeader> = observer((props) => { export const AssigneesHeader: FC<IAssigneesHeader> = observer((props) => {
const { const {

View File

@ -638,7 +638,7 @@ export const IssueDetailsSidebar: React.FC<Props> = observer((props) => {
</div> </div>
)} )}
{(fieldsToShow.includes("all") || fieldsToShow.includes("link")) && ( {(fieldsToShow.includes("all") || fieldsToShow.includes("link")) && (
<div className={`min-h-[116px] py-1 text-xs ${uneditable ? "opacity-60" : ""}`}> <div className={`py-1 text-xs ${uneditable ? "opacity-60" : ""}`}>
<div className="flex items-center justify-between gap-2"> <div className="flex items-center justify-between gap-2">
<h4>Links</h4> <h4>Links</h4>
{isAllowed && ( {isAllowed && (
@ -654,21 +654,23 @@ export const IssueDetailsSidebar: React.FC<Props> = observer((props) => {
</button> </button>
)} )}
</div> </div>
<div className="mt-2 space-y-2"> {issueDetail?.issue_link && issueDetail.issue_link.length > 0 && (
{issueDetail?.issue_link && issueDetail.issue_link.length > 0 ? ( <div className="mt-2 space-y-2">
<LinksList {
links={issueDetail.issue_link} <LinksList
handleDeleteLink={handleDeleteLink} links={issueDetail.issue_link}
handleEditLink={handleEditLink} handleDeleteLink={handleDeleteLink}
userAuth={{ handleEditLink={handleEditLink}
isGuest: currentProjectRole === 5, userAuth={{
isViewer: currentProjectRole === 10, isGuest: currentProjectRole === 5,
isMember: currentProjectRole === 15, isViewer: currentProjectRole === 10,
isOwner: currentProjectRole === 20, isMember: currentProjectRole === 15,
}} isOwner: currentProjectRole === 20,
/> }}
) : null} />
</div> }
</div>
)}
</div> </div>
)} )}
</div> </div>