병합 요청 차이점 프론트엔드 개요

flowchart TB classDef code font-family: monospace; A["diffs~~app.vue"] descVirtualScroller(["가상 스크롤러"]) codeForFiles[["v-for(diffFiles)"]] B["diffs~~diff_file.vue"] C["diffs~~diff_file_header.vue"] D["diffs~~diff_stats.vue"] E["diffs~~diff_content.vue"] boolFileIsText{텍스트 파일인가?} boolOnlyWhitespace{공백만 있는가?} boolNotDiffable{비교할 수 없는 파일인가?} boolNoPreview{미리보기가 없는가?} descShowChanges(["'변경 사항 표시' 버튼을 보여줌"]) %% 텍스트 변경 사항이 없을 때 dirDiffViewer>"vue_shared~~diff_viewer"] F["./viewers/not_diffable.vue"] G["./viewers/no_preview.vue"] H["./diff_viewer.vue"] I["diffs~~diff_view.vue"] boolIsRenamed{이름이 바뀐 파일인가?} boolIsModeChanged{모드가 변경된 파일인가?} boolFileHasNoPath{새 경로가 있는 파일인가?} boolIsImage{이미지 파일인가?} J["./viewers/renamed.vue"] K["./viewers/mode_changed.vue"] descNoViewer(["뷰어가 렌더링되지 않음"]) L["./viewers/image_diff_viewer.vue"] M["./viewers/download.vue"] N["vue_shared~~download_diff_viewer.vue"] boolImageIsReplaced{교체된 이미지인가?} O["vue_shared~~image_viewer.vue"] switchImageMode((이미지 차이 뷰어 모드)) P["./viewers/image_diff/onion_skin_viewer.vue"] Q["./viewers/image_diff/swipe_viewer.vue"] R["./viewers/image_diff/two_up_viewer.vue"] S["diffs~~image_diff_overlay.vue"] codeForImageDiscussions[["v-for(discussions)"]] T["vue_shared~~design_note_pin.vue"] U["vue_shared~~user_avatar_link.vue"] V["diffs~~diff_discussions.vue"] W["batch_comments~~diff_file_drafts.vue"] codeForTwoUpDiscussions[["v-for(discussions)"]] codeForTwoUpDrafts[["v-for(drafts)"]] X["notes~~notable_discussion.vue"] %% 텍스트 파일 변경 사항 codeForDiffLines[["v-for(diffLines)"]] Y["diffs~~diff_expansion_cell.vue"] Z["diffs~~diff_row.vue"] AA["diffs~~diff_line.vue"] AB["batch_comments~~draft_note.vue"] AC["diffs~~diff_comment_cell.vue"] AD["diffs~~diff_gutter_avatars.vue"] AE["ee-diffs~~inline_findings_gutter_icon_dropdown.vue"] AF["notes~~noteable_note.vue"] AG["notes~~note_actions.vue"] AH["notes~~note_body.vue"] AI["notes~~note_header.vue"] AJ["notes~~reply_button.vue"] AK["notes~~note_awards_list.vue"] AL["notes~~note_edited_text.vue"] AM["notes~~note_form.vue"] AN["vue_shared~~awards_list.vue"] AO["emoji~~picker.vue"] AP["emoji~~emoji_list.vue"] descEmojiVirtualScroll(["가상 스크롤러"]) AQ["emoji~~category.vue"] AR["emoji~emoji_category.vue"] AS["vue_shared~~markdown_editor.vue"] class codeForFiles,codeForImageDiscussions code; class codeForTwoUpDiscussions,codeForTwoUpDrafts code; class codeForDiffLines code; %% 이전과 동일하게 코드 스타일을 적용 class switchImageMode code; %% 이진 노드에 대해서도 코드 스타일을 적용 class boolFileIsText,boolOnlyWhitespace,boolNotDiffable,boolNoPreview code; class boolIsRenamed,boolIsModeChanged,boolFileHasNoPath,boolIsImage code; class boolImageIsReplaced code; A --> descVirtualScroller A -->|"가상 스크롤러는 '페이지에서 찾기' 검색 (Cmd/Ctrl+f)을 사용할 때 비활성화됩니다."|codeForFiles descVirtualScroller --> codeForFiles codeForFiles --> B --> C --> D B --> E %% 파일 보기 플래그 게이트 E --> boolFileIsText boolFileIsText --> |yes| I boolFileIsText --> |no| boolOnlyWhitespace boolOnlyWhitespace --> |yes| descShowChanges boolOnlyWhitespace --> |no| dirDiffViewer dirDiffViewer --> H H --> boolNotDiffable boolNotDiffable --> |yes| F boolNotDiffable --> |no| boolNoPreview boolNoPreview --> |yes| G boolNoPreview --> |no| boolIsRenamed boolIsRenamed --> |yes| J boolIsRenamed --> |no| boolIsModeChanged boolIsModeChanged --> |yes| K boolIsModeChanged --> |no| boolFileHasNoPath boolFileHasNoPath --> |yes| boolIsImage boolFileHasNoPath --> |no| descNoViewer boolIsImage --> |yes| L boolIsImage --> |no| M M --> N %% 이미지 차이 뷰어 L --> boolImageIsReplaced boolImageIsReplaced --> |yes| switchImageMode boolImageIsReplaced --> |no| O switchImageMode -->|"'twoup' (기본값)"| R switchImageMode -->|'onion'| P switchImageMode -->|'swipe'| Q P & Q --> S S --> codeForImageDiscussions S --> AM R-->|"노트 컨테이너 div에 렌더링됨"|U & W & V %% 위의 "P & Q --> S" 문은 조합하지 말 것 %% 노드 관계의 순서가 그래프의 레이아웃을 정의하며 정확한 순서가 필요합니다. R --> S V --> codeForTwoUpDiscussions W --> codeForTwoUpDrafts %% 이 보이지 않는 링크는 `noteable_discussion`이 `design_note_pin`보다 먼저 렌더링되도록 합니다. X ~~~ T codeForTwoUpDrafts --> AB codeForImageDiscussions & codeForTwoUpDiscussions & codeForTwoUpDrafts --> T codeForTwoUpDiscussions --> X %% 텍스트 파일 차이 뷰어 I --> codeForDiffLines codeForDiffLines --> Z codeForDiffLines -->|"isMatchLine?"| Y codeForDiffLines -->|"hasCodeQuality?"| AA codeForDiffLines -->|"hasDraftNote(s)?"| AB Z -->|"hasCodeQuality?"| AE Z -->|"hasDiscussions?"| AD AA --> AC %% 임시 노트 AB --> AF AF --> AG & AH & AI AG --> AJ AH --> AK & AL & AM AK --> AN --> AO --> AP --> descEmojiVirtualScroll --> AQ --> AR AM --> AS

{
  "key": "",
  "path": "",
  "name": "",
  "type": "",
  "tree": [],
  "changed": true,
  "diffLoaded": false,
  "filePaths": {
    "old": file.old_path,
    "new": file.new_path
  },
  "tempFile": false,
  "deleted": false,
  "fileHash": "",
  "addedLines": 1,
  "removedLines": 1,
  "parentPath": "/",
  "submodule": false
}

graph TD A[fetchDiffFilesBatch] --> B[commit SET_DIFF_DATA_BATCH] --> C[prepareDiffData] --> D[prepareRawDiffFile] --> E[ensureBasicDiffFileLines] --> F[prepareDiffFileLines] --> G[finalizeDiffFile] --> H[deduplicateFilesList]

graph TD A[startRenderDiffsQueue] -->B B[commit RENDER_FILE current file index] -->C C[canRenderNextFile?] C -->|Yes| D[Render file] -->B C -->|No| E[Re-run requestIdleCallback] -->C