From 4bbf220296765a20c3ba03c5351b21618a835424 Mon Sep 17 00:00:00 2001 From: HampusM Date: Sun, 25 Jul 2021 22:34:22 +0200 Subject: Reformated the client code a bit --- packages/client/src/App.vue | 2 +- packages/client/src/components/BaseBackButton.vue | 2 +- packages/client/src/components/BaseBreadcrumb.vue | 2 +- packages/client/src/components/BaseButton.vue | 2 +- .../client/src/components/BaseErrorMessage.vue | 2 +- packages/client/src/components/CommitPatch.vue | 112 +++++++++++---------- packages/client/src/components/HomeHeader.vue | 4 +- .../client/src/components/HomeProjectsHeader.vue | 2 +- .../src/components/RepositoryCloneDropdown.vue | 7 +- .../client/src/components/RepositoryHeader.vue | 2 +- .../client/src/components/RepositoryNavbar.vue | 2 +- .../client/src/components/RepositoryTreeBlob.vue | 10 +- .../client/src/components/RepositoryTreeTree.vue | 2 +- packages/client/src/main.ts | 2 +- packages/client/src/router/index.ts | 2 +- packages/client/src/util/fetch.ts | 16 +-- packages/client/src/util/hljs-languages.ts | 2 +- packages/client/src/util/util.ts | 2 +- packages/client/src/views/Home.vue | 6 +- packages/client/src/views/PageNotFound.vue | 2 +- packages/client/src/views/Repository.vue | 6 +- packages/client/src/views/RepositoryAbout.vue | 6 +- packages/client/src/views/RepositoryCommit.vue | 6 +- packages/client/src/views/RepositoryLog.vue | 6 +- packages/client/src/views/RepositoryTree.vue | 13 +-- 25 files changed, 113 insertions(+), 107 deletions(-) (limited to 'packages') diff --git a/packages/client/src/App.vue b/packages/client/src/App.vue index d34fcc5..7da4b72 100644 --- a/packages/client/src/App.vue +++ b/packages/client/src/App.vue @@ -132,4 +132,4 @@ a { margin-left: 4.5rem; } } - + \ No newline at end of file diff --git a/packages/client/src/components/BaseBackButton.vue b/packages/client/src/components/BaseBackButton.vue index 3139a6c..fe2c2f8 100644 --- a/packages/client/src/components/BaseBackButton.vue +++ b/packages/client/src/components/BaseBackButton.vue @@ -32,4 +32,4 @@ export default defineComponent({ #back:hover { fill: colors.$primary-light; } - + \ No newline at end of file diff --git a/packages/client/src/components/BaseBreadcrumb.vue b/packages/client/src/components/BaseBreadcrumb.vue index 45e835c..f1bf441 100644 --- a/packages/client/src/components/BaseBreadcrumb.vue +++ b/packages/client/src/components/BaseBreadcrumb.vue @@ -59,4 +59,4 @@ export default defineComponent({ } } } - + \ No newline at end of file diff --git a/packages/client/src/components/BaseButton.vue b/packages/client/src/components/BaseButton.vue index 4dad973..e67d198 100644 --- a/packages/client/src/components/BaseButton.vue +++ b/packages/client/src/components/BaseButton.vue @@ -28,4 +28,4 @@ export default defineComponent({ button { @include mixins.button; } - + \ No newline at end of file diff --git a/packages/client/src/components/BaseErrorMessage.vue b/packages/client/src/components/BaseErrorMessage.vue index e2c0bcf..83eb3a4 100644 --- a/packages/client/src/components/BaseErrorMessage.vue +++ b/packages/client/src/components/BaseErrorMessage.vue @@ -26,4 +26,4 @@ export default defineComponent({ color: colors.$danger; font-weight: 700; } - + \ No newline at end of file diff --git a/packages/client/src/components/CommitPatch.vue b/packages/client/src/components/CommitPatch.vue index fbc9e3a..4a3a999 100644 --- a/packages/client/src/components/CommitPatch.vue +++ b/packages/client/src/components/CommitPatch.vue @@ -26,10 +26,10 @@ export default defineComponent({ } // Array of hunks without the first chunk headers - const all_hunks = props.patch.hunks.map((hunk) => hunk.hunk.split("\n").slice(1).join("\n")); + const all_hunks = props.patch.hunks.map(hunk => hunk.hunk.split("\n").slice(1).join("\n")); // Check if the patch's file extension matches any predefined language. - const language = hljs_languages.find((lang) => lang.extensions.some((extension) => props.patch.to.endsWith(extension))); + const language = hljs_languages.find(lang => lang.extensions.some(extension => props.patch.to.endsWith(extension))); // Syntax highlight all of the patch's hunks const highlight_result = language @@ -52,7 +52,7 @@ export default defineComponent({ hunk_start = hunk_start + hunk_row_cnt; }); - const all_hunks_raw = all_hunks.map((hunk) => hunk.split("\n")); + const all_hunks_raw = all_hunks.map(hunk => hunk.split("\n")); return () => h("table", { cellspacing: "0px" }, [ h("tbody", [ @@ -71,7 +71,8 @@ export default defineComponent({ h("code", all_hunks_raw[hunk_index][line_index]) ]) ]); - } else if(/^\\ No newline at end of file$/.test(all_hunks_raw[hunk_index][line_index])) { + } + else if(/^\\ No newline at end of file$/.test(all_hunks_raw[hunk_index][line_index])) { new_offset++; deleted_offset++; return h("tr", { class: "commit-file-no-newline" }, [ @@ -82,60 +83,63 @@ export default defineComponent({ h("code", all_hunks_raw[hunk_index][line_index]) ]) ]); - } else { - let first_td: VNode; - let second_td: VNode; - let third_td: VNode; - - const adjusted_line_index = line_index + 1; - - if(hunk.new_lines.includes(adjusted_line_index)) { - first_td = h("td", ""); - second_td = h("td", { class: "line-highlight-new", "patch-line-col-unsel": Number(hunk.new_start) + line_index - new_offset }); - third_td = h("td", { class: "line-new", "patch-line-col-unsel": "+" }); - deleted_offset++; - } else if(hunk.deleted_lines.includes(adjusted_line_index)) { - first_td = h("td", { "patch-line-col-unsel": Number(hunk.old_start) + line_index - deleted_offset }); - second_td = h("td", { class: "line-highlight-deleted" }); - third_td = h("td", { class: "line-deleted", "patch-line-col-unsel": "-" }); - new_offset++; - } else { - first_td = h("td", { class: "line-unchanged", "patch-line-col-unsel": Number(hunk.old_start) + line_index - deleted_offset }); - second_td = h("td", { class: "line-unchanged", "patch-line-col-unsel": Number(hunk.new_start) + line_index - new_offset }); - third_td = h("td", ""); - } - - const is_comment_open = line.match(//g); - const comment_open_cnt = (is_comment_open !== null) ? is_comment_open.length : 0; - const comment_open = (is_comment_open !== null) ? is_comment_open[0] : ""; - - const is_comment_close = line.match(/<\/span>/g); - const comment_close_cnt = (is_comment_close !== null) ? is_comment_close.length : 0; - // Const comment_close = (is_comment_close !== null) ? is_comment_close[0] : ""; - - if(comment_open_cnt > comment_close_cnt) { - line = line + ""; - multiline_comments.push(comment_open); - } else if(comment_open_cnt < comment_close_cnt && multiline_comments.length !== 0) { - line = multiline_comments[multiline_comments.length - 1] + line; - multiline_comments.pop(); - } else if(multiline_comments.length !== 0) { - line = multiline_comments[multiline_comments.length - 1] + line + ""; - } - - return h("tr", [ - first_td, - second_td, - third_td, - h("td", [ - h("code", { innerHTML: line }) - ]) - ]); } + let first_td: VNode; + let second_td: VNode; + let third_td: VNode; + + const adjusted_line_index = line_index + 1; + + if(hunk.new_lines.includes(adjusted_line_index)) { + first_td = h("td", ""); + second_td = h("td", { class: "line-highlight-new", "patch-line-col-unsel": Number(hunk.new_start) + line_index - new_offset }); + third_td = h("td", { class: "line-new", "patch-line-col-unsel": "+" }); + deleted_offset++; + } + else if(hunk.deleted_lines.includes(adjusted_line_index)) { + first_td = h("td", { "patch-line-col-unsel": Number(hunk.old_start) + line_index - deleted_offset }); + second_td = h("td", { class: "line-highlight-deleted" }); + third_td = h("td", { class: "line-deleted", "patch-line-col-unsel": "-" }); + new_offset++; + } + else { + first_td = h("td", { class: "line-unchanged", "patch-line-col-unsel": Number(hunk.old_start) + line_index - deleted_offset }); + second_td = h("td", { class: "line-unchanged", "patch-line-col-unsel": Number(hunk.new_start) + line_index - new_offset }); + third_td = h("td", ""); + } + + const is_comment_open = line.match(//g); + const comment_open_cnt = (is_comment_open !== null) ? is_comment_open.length : 0; + const comment_open = (is_comment_open !== null) ? is_comment_open[0] : ""; + + const is_comment_close = line.match(/<\/span>/g); + const comment_close_cnt = (is_comment_close !== null) ? is_comment_close.length : 0; + // Const comment_close = (is_comment_close !== null) ? is_comment_close[0] : ""; + + if(comment_open_cnt > comment_close_cnt) { + line = line + ""; + multiline_comments.push(comment_open); + } + else if(comment_open_cnt < comment_close_cnt && multiline_comments.length !== 0) { + line = multiline_comments[multiline_comments.length - 1] + line; + multiline_comments.pop(); + } + else if(multiline_comments.length !== 0) { + line = multiline_comments[multiline_comments.length - 1] + line + ""; + } + + return h("tr", [ + first_td, + second_td, + third_td, + h("td", [ + h("code", { innerHTML: line }) + ]) + ]); }); }) ]) ]); } }); - + \ No newline at end of file diff --git a/packages/client/src/components/HomeHeader.vue b/packages/client/src/components/HomeHeader.vue index 64e70e7..a6e640e 100644 --- a/packages/client/src/components/HomeHeader.vue +++ b/packages/client/src/components/HomeHeader.vue @@ -17,7 +17,7 @@ export default defineComponent({ const title = ref(""); const about = ref(""); - const fetchInfo = async() => { + async function fetchInfo() { const info: Info = (await (await fetch(`${window.location.protocol}//${window.location.host}/api/v1/info`)).json()).data; title.value = info.title; @@ -51,4 +51,4 @@ export default defineComponent({ font-weight: 300; padding-left: 1px; } - + \ No newline at end of file diff --git a/packages/client/src/components/HomeProjectsHeader.vue b/packages/client/src/components/HomeProjectsHeader.vue index 267ecb8..9fde114 100644 --- a/packages/client/src/components/HomeProjectsHeader.vue +++ b/packages/client/src/components/HomeProjectsHeader.vue @@ -51,4 +51,4 @@ export default defineComponent({ margin-right: 15px; } } - + \ No newline at end of file diff --git a/packages/client/src/components/RepositoryCloneDropdown.vue b/packages/client/src/components/RepositoryCloneDropdown.vue index 335604f..77b26fe 100644 --- a/packages/client/src/components/RepositoryCloneDropdown.vue +++ b/packages/client/src/components/RepositoryCloneDropdown.vue @@ -107,7 +107,7 @@ export default defineComponent({ }); } - const clickOutsideDropdown = (event: Event) => { + function clickOutsideDropdown(event: Event) { const target = event.target as HTMLElement; if(dropdown_menu && dropdown_menu.contains(target) === false && target !== dropdown_button) { @@ -122,7 +122,8 @@ export default defineComponent({ if(dropdown_menu.classList.contains("show")) { dropdown_menu.classList.remove("show"); document.removeEventListener("click", clickOutsideDropdown); - } else { + } + else { dropdown_menu.classList.add("show"); document.addEventListener("click", clickOutsideDropdown); } @@ -246,4 +247,4 @@ export default defineComponent({ margin-left: 0.5rem; font-weight: 700; } - + \ No newline at end of file diff --git a/packages/client/src/components/RepositoryHeader.vue b/packages/client/src/components/RepositoryHeader.vue index bbb371e..6b494d6 100644 --- a/packages/client/src/components/RepositoryHeader.vue +++ b/packages/client/src/components/RepositoryHeader.vue @@ -63,4 +63,4 @@ export default defineComponent({ margin: 0px; margin-top: 10px; } - + \ No newline at end of file diff --git a/packages/client/src/components/RepositoryNavbar.vue b/packages/client/src/components/RepositoryNavbar.vue index 51ce1e9..aced5e2 100644 --- a/packages/client/src/components/RepositoryNavbar.vue +++ b/packages/client/src/components/RepositoryNavbar.vue @@ -117,4 +117,4 @@ export default defineComponent({ } } - + \ No newline at end of file diff --git a/packages/client/src/components/RepositoryTreeBlob.vue b/packages/client/src/components/RepositoryTreeBlob.vue index 60f0506..e443287 100644 --- a/packages/client/src/components/RepositoryTreeBlob.vue +++ b/packages/client/src/components/RepositoryTreeBlob.vue @@ -49,7 +49,7 @@ export default defineComponent({ const content_blob: Ref = ref(""); const is_markdown: Ref = ref(false); - const initHighlightedContent = async() => { + async function initHighlightedContent() { const path_extension = /(?:\.([^.]+))?$/; const path_ext = path_extension.exec(props.path); @@ -64,14 +64,14 @@ export default defineComponent({ markdown.innerHTML = marked(props.content); const checkboxes = markdown.querySelectorAll("ul > li > input[type=\"checkbox\"]"); - checkboxes.forEach((checkbox) => { + checkboxes.forEach(checkbox => { if(checkbox.parentElement) { checkbox.parentElement.classList.add("checkbox-list"); } }); const codeblocks = markdown.querySelectorAll("code"); - codeblocks.forEach((codeblock) => { + codeblocks.forEach(codeblock => { codeblock.classList.add("markdown-codeblock"); }); @@ -80,7 +80,7 @@ export default defineComponent({ return; } - const language = hljs_languages.find((lang) => lang.extensions.some((extension) => ext === extension)); + const language = hljs_languages.find(lang => lang.extensions.some(extension => ext === extension)); const highlighted = language ? hljs.highlight(props.content, { language: language.name }) : hljs.highlightAuto(props.content); content_lines.value = highlighted.value.split("\n"); @@ -155,4 +155,4 @@ td:nth-child(1) { [line]::before { content: attr(line); } - + \ No newline at end of file diff --git a/packages/client/src/components/RepositoryTreeTree.vue b/packages/client/src/components/RepositoryTreeTree.vue index a17dc93..0ae38ad 100644 --- a/packages/client/src/components/RepositoryTreeTree.vue +++ b/packages/client/src/components/RepositoryTreeTree.vue @@ -139,4 +139,4 @@ table { display: flex; align-items: center; } - + \ No newline at end of file diff --git a/packages/client/src/main.ts b/packages/client/src/main.ts index 10ea69d..4f043e6 100644 --- a/packages/client/src/main.ts +++ b/packages/client/src/main.ts @@ -2,4 +2,4 @@ import { createApp } from "vue"; import App from "./App.vue"; import router from "./router"; -createApp(App).use(router).mount("#app"); +createApp(App).use(router).mount("#app"); \ No newline at end of file diff --git a/packages/client/src/router/index.ts b/packages/client/src/router/index.ts index 27ea978..85150df 100644 --- a/packages/client/src/router/index.ts +++ b/packages/client/src/router/index.ts @@ -51,4 +51,4 @@ const router = createRouter({ routes }); -export default router; +export default router; \ No newline at end of file diff --git a/packages/client/src/util/fetch.ts b/packages/client/src/util/fetch.ts index 54f5afd..a67014a 100644 --- a/packages/client/src/util/fetch.ts +++ b/packages/client/src/util/fetch.ts @@ -1,6 +1,6 @@ import { Ref } from "vue"; -export default async function(endpoint: string, fetch_failed: Ref, is_loading: Ref, data_name: string) { +export default async function(endpoint: string, fetch_failed: Ref, is_loading: Ref, data_name: string): Promise { const fetch_timeout = setTimeout(() => { if(!fetch_failed.value) { fetch_failed.value = `Failed to fetch ${data_name} data.`; @@ -8,7 +8,7 @@ export default async function(endpoint: string, fetch_failed: Ref } }, 5000); - const data_req = await fetch(`${window.location.protocol}//${window.location.host}/api/v1/${endpoint}`).catch(() => { + const res = await fetch(`${window.location.protocol}//${window.location.host}/api/v1/${endpoint}`).catch(() => { if(!fetch_failed.value) { fetch_failed.value = `Failed to fetch ${data_name} data.`; is_loading.value = false; @@ -17,21 +17,21 @@ export default async function(endpoint: string, fetch_failed: Ref return null; }); - if(data_req !== null) { - const data = await data_req.json().catch(() => { + if(res !== null && res.ok) { + const data: Record | null = await res.json().catch(() => { fetch_failed.value = "Failed to parse server response."; }); - if(data_req.ok) { + if(data) { clearTimeout(fetch_timeout); is_loading.value = false; return data.data; - } else { - fetch_failed.value = `Failed to fetch ${data_name} data.`; } } + fetch_failed.value = `Failed to fetch ${data_name} data.`; + clearTimeout(fetch_timeout); is_loading.value = false; return null; -}; +} \ No newline at end of file diff --git a/packages/client/src/util/hljs-languages.ts b/packages/client/src/util/hljs-languages.ts index 2f50461..1ba036a 100644 --- a/packages/client/src/util/hljs-languages.ts +++ b/packages/client/src/util/hljs-languages.ts @@ -42,4 +42,4 @@ const languages = [ { name: "yml", extensions: [ ".yml" ] } ]; -export default languages; +export default languages; \ No newline at end of file diff --git a/packages/client/src/util/util.ts b/packages/client/src/util/util.ts index 5f72c27..58ff064 100644 --- a/packages/client/src/util/util.ts +++ b/packages/client/src/util/util.ts @@ -4,4 +4,4 @@ type Params = { export function getParam(params: Params, param: string): string { return params[param].toString(); -} +} \ No newline at end of file diff --git a/packages/client/src/views/Home.vue b/packages/client/src/views/Home.vue index 1edafff..1d4cfa1 100644 --- a/packages/client/src/views/Home.vue +++ b/packages/client/src/views/Home.vue @@ -52,8 +52,8 @@ export default defineComponent({ const is_loading: Ref = ref(true); const fetch_failed: Ref = ref(""); - const fetchProjects = async() => { - const projects_data: RepositorySummary[] = await fetchData("repos", fetch_failed, is_loading, "projects"); + async function fetchProjects() { + const projects_data = await fetchData("repos", fetch_failed, is_loading, "projects") as RepositorySummary[]; projects_data.reduce((result: RepositorySummary[], project) => { if(typeof project.last_updated === "number") { @@ -101,4 +101,4 @@ export default defineComponent({ } } - + \ No newline at end of file diff --git a/packages/client/src/views/PageNotFound.vue b/packages/client/src/views/PageNotFound.vue index f373f42..b8896df 100644 --- a/packages/client/src/views/PageNotFound.vue +++ b/packages/client/src/views/PageNotFound.vue @@ -8,4 +8,4 @@ import { defineComponent } from "vue"; export default defineComponent({ name: "PageNotFound" }); - + \ No newline at end of file diff --git a/packages/client/src/views/Repository.vue b/packages/client/src/views/Repository.vue index a3a973d..90578fb 100644 --- a/packages/client/src/views/Repository.vue +++ b/packages/client/src/views/Repository.vue @@ -32,7 +32,7 @@ export default defineComponent({ const has_readme: Ref = ref(false); const error: Ref = ref(null); - const fetchProjects = async(repository: string, router: Router, path: string) => { + async function fetchProjects(repository: string, router: Router, path: string) { const repository_data = await fetch(`${window.location.protocol}//${window.location.host}/api/v1/repos/${repository}`); if(!repository_data.ok) { @@ -45,7 +45,7 @@ export default defineComponent({ if(path.split("/").length === 2) { router.replace(`/${repository}/log`); - }; + } const data: Repository = (await repository_data.json()).data; @@ -60,4 +60,4 @@ export default defineComponent({ this.fetchProjects(getParam(this.$route.params, "repo"), this.$router, this.$route.path); } }); - + \ No newline at end of file diff --git a/packages/client/src/views/RepositoryAbout.vue b/packages/client/src/views/RepositoryAbout.vue index dc759d1..c72ee12 100644 --- a/packages/client/src/views/RepositoryAbout.vue +++ b/packages/client/src/views/RepositoryAbout.vue @@ -35,8 +35,8 @@ export default defineComponent({ const is_loading: Ref = ref(true); const fetch_failed: Ref = ref(""); - const fetchReadme = async(repository: string) => { - const readme_data: Tree = await fetchData(`repos/${repository}/tree?path=README.md`, fetch_failed, is_loading, "tree"); + async function fetchReadme(repository: string) { + const readme_data = await fetchData(`repos/${repository}/tree?path=README.md`, fetch_failed, is_loading, "tree") as Tree; if(readme_data && typeof readme_data.content === "string") { readme.value = readme_data.content; @@ -58,4 +58,4 @@ export default defineComponent({ + \ No newline at end of file diff --git a/packages/client/src/views/RepositoryCommit.vue b/packages/client/src/views/RepositoryCommit.vue index f0dec4a..9818dff 100644 --- a/packages/client/src/views/RepositoryCommit.vue +++ b/packages/client/src/views/RepositoryCommit.vue @@ -78,8 +78,8 @@ export default defineComponent({ const is_loading: Ref = ref(true); const fetch_failed: Ref = ref(""); - const fetchCommit = async(repository: string, commit_id: string) => { - const commit_data: Commit = await fetchData(`repos/${repository}/log/${commit_id}`, fetch_failed, is_loading, "commit"); + async function fetchCommit(repository: string, commit_id: string) { + const commit_data = await fetchData(`repos/${repository}/log/${commit_id}`, fetch_failed, is_loading, "commit") as Commit; if(commit_data) { const pretty_commit = commit_data as PrettyDateCommit; @@ -221,4 +221,4 @@ code { height: 100%; } - + \ No newline at end of file diff --git a/packages/client/src/views/RepositoryLog.vue b/packages/client/src/views/RepositoryLog.vue index c5ce241..83184fa 100644 --- a/packages/client/src/views/RepositoryLog.vue +++ b/packages/client/src/views/RepositoryLog.vue @@ -74,8 +74,8 @@ export default defineComponent({ const is_loading: Ref = ref(true); const fetch_failed: Ref = ref(""); - const fetchLog = async(repository: string) => { - const log_data: LogCommit[] = await fetchData(`repos/${repository}/log`, fetch_failed, is_loading, "log"); + async function fetchLog(repository: string) { + const log_data = await fetchData(`repos/${repository}/log`, fetch_failed, is_loading, "log") as LogCommit[]; if(log_data) { commits.value = log_data; } @@ -147,4 +147,4 @@ table { } } - + \ No newline at end of file diff --git a/packages/client/src/views/RepositoryTree.vue b/packages/client/src/views/RepositoryTree.vue index 8ffb480..152b6a4 100644 --- a/packages/client/src/views/RepositoryTree.vue +++ b/packages/client/src/views/RepositoryTree.vue @@ -65,23 +65,24 @@ export default defineComponent({ const fetch_failed: Ref = ref(""); const path: Ref = ref(null); - const fetchTree = async(repository: string) => { + async function fetchTree(repository: string) { blob_content.value = null; tree.value = null; path.value = props.pathArr ? props.pathArr.join("/") : null; - const tree_data: Tree = await fetchData(`repos/${repository}/tree${path.value ? "?path=" + path.value : ""}`, fetch_failed, is_loading, "tree"); + const tree_data = await fetchData(`repos/${repository}/tree${path.value ? "?path=" + path.value : ""}`, fetch_failed, is_loading, "tree") as Tree; if(tree_data) { if(tree_data.type === "tree" && tree_data.content instanceof Array) { - let tree_trees = tree_data.content.filter((entry) => entry.type === "tree"); + let tree_trees = tree_data.content.filter(entry => entry.type === "tree"); tree_trees = tree_trees.sort((a, b) => a.name.localeCompare(b.name)); - let tree_blobs = tree_data.content.filter((entry) => entry.type === "blob"); + let tree_blobs = tree_data.content.filter(entry => entry.type === "blob"); tree_blobs = tree_blobs.sort((a, b) => a.name.localeCompare(b.name)); tree.value = tree_trees.concat(tree_blobs); - } else if(typeof tree_data.content === "string") { + } + else if(typeof tree_data.content === "string") { blob_content.value = tree_data.content; } } @@ -104,4 +105,4 @@ export default defineComponent({ + \ No newline at end of file -- cgit v1.2.3-18-g5258