diff --git a/web/components/issues/attachment/attachment-detail.tsx b/web/components/issues/attachment/attachment-detail.tsx index bd07f6a44..0d345a619 100644 --- a/web/components/issues/attachment/attachment-detail.tsx +++ b/web/components/issues/attachment/attachment-detail.tsx @@ -38,7 +38,6 @@ export const IssueAttachmentsDetail: FC = (props) => { const attachment = attachmentId && getAttachmentById(attachmentId); if (!attachment) return <>; - return ( <> = observer((props) => { const [isLoading, setIsLoading] = useState(false); const onDrop = useCallback((acceptedFiles: File[]) => { - if (!acceptedFiles[0] || !workspaceSlug) return; + const currentFile: File = acceptedFiles[0]; + if (!currentFile || !workspaceSlug) return; + const uploadedFile: File = new File([currentFile], generateFileName(currentFile.name), { type: currentFile.type }); const formData = new FormData(); - formData.append("asset", acceptedFiles[0]); + formData.append("asset", uploadedFile); formData.append( "attributes", JSON.stringify({ - name: acceptedFiles[0].name, - size: acceptedFiles[0].size, + name: uploadedFile.name, + size: uploadedFile.size, }) ); setIsLoading(true); diff --git a/web/components/profile/sidebar.tsx b/web/components/profile/sidebar.tsx index ebe41308b..a701a058d 100644 --- a/web/components/profile/sidebar.tsx +++ b/web/components/profile/sidebar.tsx @@ -60,7 +60,7 @@ export const ProfileSidebar = observer(() => { ]; return ( -
+
{userProjectsData ? ( <>
diff --git a/web/helpers/attachment.helper.ts b/web/helpers/attachment.helper.ts index 67e989063..1f9f4f5a3 100644 --- a/web/helpers/attachment.helper.ts +++ b/web/helpers/attachment.helper.ts @@ -1,3 +1,14 @@ +export const generateFileName = (fileName: string) => { + const date = new Date(); + const timestamp = date.getTime(); + + const _fileName = getFileName(fileName); + const nameWithoutExtension = _fileName.length > 80 ? _fileName.substring(0, 80) : _fileName; + const extension = getFileExtension(fileName); + + return `${nameWithoutExtension}-${timestamp}.${extension}`; +}; + export const getFileExtension = (filename: string) => filename.slice(((filename.lastIndexOf(".") - 1) >>> 0) + 2); export const getFileName = (fileName: string) => { diff --git a/web/store/issue/issue-details/attachment.store.ts b/web/store/issue/issue-details/attachment.store.ts index c21c2ac1d..4550e7fda 100644 --- a/web/store/issue/issue-details/attachment.store.ts +++ b/web/store/issue/issue-details/attachment.store.ts @@ -1,5 +1,9 @@ import { action, computed, makeObservable, observable, runInAction } from "mobx"; import set from "lodash/set"; +import update from "lodash/update"; +import concat from "lodash/concat"; +import uniq from "lodash/uniq"; +import pull from "lodash/pull"; // services import { IssueAttachmentService } from "services/issue"; // types @@ -83,10 +87,13 @@ export class IssueAttachmentStore implements IIssueAttachmentStore { try { const response = await this.issueAttachmentService.getIssueAttachment(workspaceSlug, projectId, issueId); - runInAction(() => { - this.attachments[issueId] = response.map((attachment) => attachment.id); - response.forEach((attachment) => set(this.attachmentMap, attachment.id, attachment)); - }); + if (response && response.length > 0) { + const _attachmentIds = response.map((attachment) => attachment.id); + runInAction(() => { + update(this.attachments, [issueId], (attachmentIds = []) => uniq(concat(attachmentIds, _attachmentIds))); + response.forEach((attachment) => set(this.attachmentMap, attachment.id, attachment)); + }); + } return response; } catch (error) { @@ -98,10 +105,11 @@ export class IssueAttachmentStore implements IIssueAttachmentStore { try { const response = await this.issueAttachmentService.uploadIssueAttachment(workspaceSlug, projectId, issueId, data); - runInAction(() => { - this.attachments[issueId].push(response.id); - set(this.attachmentMap, response.id, response); - }); + if (response && response.id) + runInAction(() => { + update(this.attachments, [issueId], (attachmentIds = []) => uniq(concat(attachmentIds, [response.id]))); + set(this.attachmentMap, response.id, response); + }); return response; } catch (error) { @@ -118,12 +126,13 @@ export class IssueAttachmentStore implements IIssueAttachmentStore { attachmentId ); - const reactionIndex = this.attachments[issueId].findIndex((_comment) => _comment === attachmentId); - if (reactionIndex >= 0) - runInAction(() => { - this.attachments[issueId].splice(reactionIndex, 1); - delete this.attachmentMap[attachmentId]; + runInAction(() => { + update(this.attachments, [issueId], (attachmentIds = []) => { + if (attachmentIds.includes(attachmentId)) pull(attachmentIds, attachmentId); + return attachmentIds; }); + delete this.attachmentMap[attachmentId]; + }); return response; } catch (error) {