[WEB-2943] chore: issue reaction and code refactor (#6350)

* chore: issue reaction component updated

* chore: project store updated
This commit is contained in:
Anmol Singh Bhatia 2025-01-08 13:03:58 +05:30 committed by GitHub
parent c2d8703acf
commit 3691cef351
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 36 additions and 26 deletions

View file

@ -20,10 +20,11 @@ export type TIssueReaction = {
issueId: string;
currentUser: IUser;
disabled?: boolean;
className?: string;
};
export const IssueReaction: FC<TIssueReaction> = observer((props) => {
const { workspaceSlug, projectId, issueId, currentUser, disabled = false } = props;
const { workspaceSlug, projectId, issueId, currentUser, disabled = false, className = "" } = props;
// hooks
const {
reaction: { getReactionsByIssueId, reactionsByUser, getReactionById },
@ -92,7 +93,7 @@ export const IssueReaction: FC<TIssueReaction> = observer((props) => {
};
return (
<div className="relative mt-4 flex items-center gap-1.5">
<div className={cn("relative mt-4 flex items-center gap-1.5", className)}>
{!disabled && (
<ReactionSelector size="md" position="top" value={userReactions} onSelect={issueReactionOperations.react} />
)}

View file

@ -11,6 +11,8 @@ import { ProjectService, ProjectStateService, ProjectArchiveService } from "@/se
// store
import { CoreRootStore } from "../root.store";
type ProjectOverviewCollapsible = "links" | "attachments";
export interface IProjectStore {
// observables
isUpdatingProject: boolean;
@ -18,9 +20,6 @@ export interface IProjectStore {
projectMap: {
[projectId: string]: TProject; // projectId: project Info
};
projectEpicPropertiesMap: {
[projectId: string]: any;
};
// computed
filteredProjectIds: string[] | undefined;
workspaceProjectIds: string[] | undefined;
@ -32,9 +31,15 @@ export interface IProjectStore {
// actions
getProjectById: (projectId: string | undefined | null) => TProject | undefined;
getProjectIdentifierById: (projectId: string | undefined | null) => string;
getProjectEpicPropertiesById: (projectId: string | undefined | null) => any;
// collapsible
openCollapsibleSection: ProjectOverviewCollapsible[];
lastCollapsibleAction: ProjectOverviewCollapsible | null;
setOpenCollapsibleSection: (section: ProjectOverviewCollapsible[]) => void;
setLastCollapsibleAction: (section: ProjectOverviewCollapsible) => void;
toggleOpenCollapsibleSection: (section: ProjectOverviewCollapsible) => void;
// fetch actions
fetchProjectEpicProperties: (workspaceSlug: string, projectId: string) => Promise<any>;
fetchProjects: (workspaceSlug: string) => Promise<TProject[]>;
fetchProjectDetails: (workspaceSlug: string, projectId: string) => Promise<TProject>;
// favorites actions
@ -58,9 +63,9 @@ export class ProjectStore implements IProjectStore {
projectMap: {
[projectId: string]: TProject; // projectId: project Info
} = {};
projectEpicPropertiesMap: {
[projectId: string]: any;
} = {};
openCollapsibleSection: ProjectOverviewCollapsible[] = [];
lastCollapsibleAction: ProjectOverviewCollapsible | null = null;
// root store
rootStore: CoreRootStore;
// service
@ -76,6 +81,8 @@ export class ProjectStore implements IProjectStore {
isUpdatingProject: observable,
loader: observable.ref,
projectMap: observable,
openCollapsibleSection: observable.ref,
lastCollapsibleAction: observable.ref,
// computed
filteredProjectIds: computed,
workspaceProjectIds: computed,
@ -85,7 +92,6 @@ export class ProjectStore implements IProjectStore {
joinedProjectIds: computed,
favoriteProjectIds: computed,
// fetch actions
fetchProjectEpicProperties: action,
fetchProjects: action,
fetchProjectDetails: action,
// favorites actions
@ -96,6 +102,10 @@ export class ProjectStore implements IProjectStore {
// CRUD actions
createProject: action,
updateProject: action,
// collapsible actions
setOpenCollapsibleSection: action,
setLastCollapsibleAction: action,
toggleOpenCollapsibleSection: action,
});
// root store
this.rootStore = _rootStore;
@ -214,23 +224,22 @@ export class ProjectStore implements IProjectStore {
return projectIds;
}
fetchProjectEpicProperties = async (workspaceSlug: string, projectId: string) => {
try {
const response = await this.projectService.fetchProjectEpicProperties(workspaceSlug, projectId);
runInAction(() => {
set(this.projectEpicPropertiesMap, [projectId], response);
});
return response;
} catch (error) {
console.log("Failed to fetch epic properties from project store");
throw error;
}
setOpenCollapsibleSection = (section: ProjectOverviewCollapsible[]) => {
this.openCollapsibleSection = section;
if (this.lastCollapsibleAction) this.lastCollapsibleAction = null;
};
getProjectEpicPropertiesById = computedFn((projectId: string | undefined | null) => {
const projectEpicProperties = this.projectEpicPropertiesMap[projectId ?? ""];
return projectEpicProperties;
});
setLastCollapsibleAction = (section: ProjectOverviewCollapsible) => {
this.openCollapsibleSection = [section];
};
toggleOpenCollapsibleSection = (section: ProjectOverviewCollapsible) => {
if (this.openCollapsibleSection && this.openCollapsibleSection.includes(section)) {
this.openCollapsibleSection = this.openCollapsibleSection.filter((s) => s !== section);
} else {
this.openCollapsibleSection = [...this.openCollapsibleSection, section];
}
};
/**
* get Workspace projects using workspace slug