Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Develop #413

Merged
merged 3 commits into from
Jan 21, 2024
Merged

Develop #413

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
ef79a87
Split changes and jobs into separate tabs
ggodlewski Jan 15, 2024
b26367c
Fix nodejs stack line numbers
ggodlewski Jan 17, 2024
df2d757
Fix transform error reporting
ggodlewski Jan 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
91 changes: 0 additions & 91 deletions apps/ui/src/components/ChangesViewer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,70 +34,7 @@
</tbody>
</table>
</div>
<div class="card-footer" v-if="active_jobs.length === 0">
<div class="btn-group">
<a class="btn btn-outline-primary me-2" v-if="selectedFile.id && selectedFile.id !== 'TO_FILL'" @click.prevent="$emit('sync', { $event, file: selectedFile })">Sync Single</a>
<a class="btn btn-outline-danger me-2" v-if="drive.name" @click.prevent="syncAll">Sync All</a>
<a class="btn btn-outline-secondary me-2" v-if="!isGDocsPreview && drive.name && selectedFile.id" @click.prevent="$emit('transform', $event, selectedFile)">Transform Single Markdown</a>
<a class="btn btn-outline-secondary me-2" v-if="!isGDocsPreview && drive.name" @click.prevent="transformAll">Transform All Markdown</a>
<a class="btn btn-outline-secondary me-2" v-if="!isGDocsPreview && drive.name" @click.prevent="renderPreview">Render Preview</a>
</div>
</div>
</div>

<div class="card mt-3">
<div class="card-header">
Jobs
</div>
<div class="card-body">
<div class="row py-1 align-items-center" v-if="last_job.dateStr">
<div class="col-8">
<span v-if="last_job.kind === 'full'" class="fw-bold">Last full sync </span>
<span v-else class="fw-bold">Last synced </span>
<span class="small text-muted">{{ last_job.dateStr }} </span>
<span v-if="last_job.durationStr" class="small text-muted">&nbsp;{{ last_job.durationStr }}</span>
</div>
<div v-if="last_transform.durationStr" class="col-8">
<span class="fw-bold">Last transform took</span>
<span class="small text-muted">&nbsp;{{ last_transform.durationStr }}</span>
</div>
</div>

<table class="table table-bordered jobs-list mt-3">
<thead>
<tr>
<th>Job</th>
<th>Started</th>
<th>Finished</th>
</tr>
</thead>

<tbody v-if="active_jobs_reverse.length > 0">
<tr v-for="(job, idx) of active_jobs_reverse" :key="idx" class="jobs-list__item" :class="{ active: 'running' === job.state }">
<td>{{ job.title }}</td>
<td>{{ job.startedStr || job.state }}</td>
<td>
<span v-if="job.progress && job.progress.total > job.progress.completed">&nbsp;{{ job.progress.completed }} / {{ job.progress.total }}</span>
<a v-if="job.id && job.started" class="btn float-end" :href="'#drive_logs:job-' + job.id" @click.prevent="showLogs(job)">Logs</a>
</td>
</tr>
</tbody>

<tbody>
<tr v-for="(job, idx) of archive" :key="idx" class="jobs-list__item" :class="{ active: 'running' === job.state, 'text-danger': 'failed' === job.state, 'text-warning': job.progress && job.progress.warnings > 0 }">
<td>{{ job.title }}</td>
<td>{{ job.startedStr }}</td>
<td>
{{ job.finishedStr }}
({{ job.durationStr }})
<a class="btn float-end" :href="'#drive_logs:job-' + job.id" @click.prevent="showLogs(job)">Logs</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>

</div>
</div>
</template>
Expand All @@ -117,33 +54,8 @@ export default {
},
components: {StatusToolBar},
computed: {
active_jobs_reverse() {
return [].concat(this.active_jobs)
.map(a => {
return {
...a,
finishedStr: a.finished ? new Date(a.finished).toISOString() : undefined,
startedStr: a.started ? new Date(a.started).toISOString() : undefined,
durationStr: a.started && a.finished ? Math.round((+new Date(a.finished) - +new Date(a.started)) / 100)/10 + 's' : undefined
};
})
.reverse();
},
fileChanges() {
return this.changes.filter(change => change.mimeType !== 'application/vnd.google-apps.folder');
},
archive() {
const arr = [].concat(this.$root.archive);
arr.sort((a, b) => b.finished - a.finished);

return arr.map(a => {
return {
...a,
finishedStr: new Date(a.finished).toISOString(),
startedStr: new Date(a.started).toISOString(),
durationStr: Math.round((+new Date(a.finished) - +new Date(a.started)) / 100)/10 + 's'
};
});
}
},
methods: {
Expand Down Expand Up @@ -171,9 +83,6 @@ export default {
this.$router.push(`/drive/${this.driveId}${path}`);
}
}
},
showLogs(job) {
this.$router.push(`/drive/${this.driveId}#drive_logs:job-${job.id}`);
}
}
};
Expand Down
120 changes: 120 additions & 0 deletions apps/ui/src/components/JobsViewer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,120 @@
<template>
<div class="container mainbar__content-height">
<StatusToolBar :active-tab="activeTab" />

<div>
<div class="card-footer" v-if="active_jobs.length === 0">
<div class="btn-group">
<a class="btn btn-outline-primary me-2" v-if="selectedFile.id && selectedFile.id !== 'TO_FILL'" @click.prevent="$emit('sync', { $event, file: selectedFile })">Sync Single</a>
<a class="btn btn-outline-danger me-2" v-if="drive.name" @click.prevent="syncAll">Sync All</a>
<a class="btn btn-outline-secondary me-2" v-if="!isGDocsPreview && drive.name && selectedFile.id" @click.prevent="$emit('transform', $event, selectedFile)">Transform Single Markdown</a>
<a class="btn btn-outline-secondary me-2" v-if="!isGDocsPreview && drive.name" @click.prevent="transformAll">Transform All Markdown</a>
<a class="btn btn-outline-secondary me-2" v-if="!isGDocsPreview && drive.name" @click.prevent="renderPreview">Render Preview</a>
</div>
</div>

<div class="card mt-3">
<div class="card-header">
Jobs
</div>
<div class="card-body">
<div class="row py-1 align-items-center" v-if="last_job.dateStr">
<div class="col-8">
<span v-if="last_job.kind === 'full'" class="fw-bold">Last full sync </span>
<span v-else class="fw-bold">Last synced </span>
<span class="small text-muted">{{ last_job.dateStr }} </span>
<span v-if="last_job.durationStr" class="small text-muted">&nbsp;{{ last_job.durationStr }}</span>
</div>
<div v-if="last_transform.durationStr" class="col-8">
<span class="fw-bold">Last transform took</span>
<span class="small text-muted">&nbsp;{{ last_transform.durationStr }}</span>
</div>
</div>

<table class="table table-bordered jobs-list mt-3">
<thead>
<tr>
<th>Job</th>
<th>Started</th>
<th>Finished</th>
</tr>
</thead>

<tbody v-if="active_jobs_reverse.length > 0">
<tr v-for="(job, idx) of active_jobs_reverse" :key="idx" class="jobs-list__item" :class="{ active: 'running' === job.state }">
<td>{{ job.title }}</td>
<td>{{ job.startedStr || job.state }}</td>
<td>
<span v-if="job.progress && job.progress.total > job.progress.completed">&nbsp;{{ job.progress.completed }} / {{ job.progress.total }}</span>
<a v-if="job.id && job.started" class="btn float-end" :href="'#drive_logs:job-' + job.id" @click.prevent="showLogs(job)">Logs</a>
</td>
</tr>
</tbody>

<tbody>
<tr v-for="(job, idx) of archive" :key="idx" class="jobs-list__item" :class="{ active: 'running' === job.state, 'text-danger': 'failed' === job.state, 'text-warning': job.progress && job.progress.warnings > 0 }">
<td>{{ job.title }}</td>
<td>{{ job.startedStr }}</td>
<td>
{{ job.finishedStr }}
({{ job.durationStr }})
<a class="btn float-end" :href="'#drive_logs:job-' + job.id" @click.prevent="showLogs(job)">Logs</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>

</div>
</div>
</template>
<script>
import {UtilsMixin} from './UtilsMixin.ts';
import {UiMixin} from './UiMixin.ts';
import StatusToolBar from './StatusToolBar.vue';

export default {
name: 'JobsViewer',
mixins: [UtilsMixin, UiMixin],
props: {
selectedFile: Object,
activeTab: {
type: String
}
},
components: {StatusToolBar},
computed: {
active_jobs_reverse() {
return [].concat(this.active_jobs)
.map(a => {
return {
...a,
finishedStr: a.finished ? new Date(a.finished).toISOString() : undefined,
startedStr: a.started ? new Date(a.started).toISOString() : undefined,
durationStr: a.started && a.finished ? Math.round((+new Date(a.finished) - +new Date(a.started)) / 100)/10 + 's' : undefined
};
})
.reverse();
},
archive() {
const arr = [].concat(this.$root.archive);
arr.sort((a, b) => b.finished - a.finished);

return arr.map(a => {
return {
...a,
finishedStr: new Date(a.finished).toISOString(),
startedStr: new Date(a.started).toISOString(),
durationStr: Math.round((+new Date(a.finished) - +new Date(a.started)) / 100)/10 + 's'
};
});
}
},
methods: {
showLogs(job) {
this.$router.push(`/drive/${this.driveId}#drive_logs:job-${job.id}`);
}
}
};
</script>
17 changes: 12 additions & 5 deletions apps/ui/src/components/StatusToolBar.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,18 @@
<template>
<ul class="nav nav-tabs mt-2">
<ToolButton
v-if="!isGDocsPreview"
:active="activeTab === 'sync'"
:to="{ name: 'drive', params: { driveId }, hash: '#sync' }"
icon="fa-solid fa-computer me-1"
title="Sync"
v-if="!isGDocsPreview"
:active="activeTab === 'sync'"
:to="{ name: 'drive', params: { driveId }, hash: '#sync' }"
icon="fa-solid fa-computer me-1"
title="Sync"
/>
<ToolButton
v-if="!isGDocsPreview"
:active="activeTab === 'changes'"
:to="{ name: 'drive', params: { driveId }, hash: '#changes' }"
icon="fa-solid fa-code-compare me-1"
:title="'Changes: ' + changes.length"
/>
<ToolButton
v-if="!isGDocsPreview"
Expand Down
7 changes: 5 additions & 2 deletions apps/ui/src/pages/FolderView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,8 @@
</div>
</div>

<ChangesViewer v-if="activeTab === 'sync'" :selected-file="selectedFile" :activeTab="activeTab" @sync="syncSingle($event.$event, $event.file)" @transform="transformSingle" @showLogs="showLogs" />
<JobsViewer v-if="activeTab === 'sync'" :selected-file="selectedFile" :activeTab="activeTab" @sync="syncSingle($event.$event, $event.file)" @transform="transformSingle" @showLogs="showLogs" />
<ChangesViewer v-if="activeTab === 'changes'" :selected-file="selectedFile" :activeTab="activeTab" @sync="syncSingle($event.$event, $event.file)" @transform="transformSingle" @showLogs="showLogs" />
<GitLog v-if="activeTab === 'git_log'" :folderPath="folderPath" :selectedFile="selectedFile" :active-tab="activeTab" />
<GitSettings v-if="activeTab === 'git_settings'" :active-tab="activeTab" :tree-empty="treeEmpty" />

Expand Down Expand Up @@ -114,6 +115,7 @@ import LogsViewer from '../components/LogsViewer.vue';
import JobLogsViewer from '../components/JobLogsViewer.vue';
import ZipkinViewer from '../components/ZipkinViewer.vue';
import ChangesViewer from '../components/ChangesViewer.vue';
import JobsViewer from '../components/JobsViewer.vue';
import UserSettings from '../components/UserSettings.vue';
import DangerSettings from '../components/DangerSettings.vue';
import GitLog from '../components/GitLog.vue';
Expand Down Expand Up @@ -143,6 +145,7 @@ export default {
JobLogsViewer,
ZipkinViewer,
ChangesViewer,
JobsViewer,
UserSettings,
DangerSettings,
WorkflowsEditor,
Expand Down Expand Up @@ -179,7 +182,7 @@ export default {
if (this.notRegistered) {
return false;
}
return this.activeTab !== 'drive_logs' && this.activeTab !== 'performance' && this.activeTab !== 'drive_config' && this.activeTab !== 'drive_danger' && this.activeTab !== 'git_settings' && this.activeTab !== 'sync' && this.activeTab !== 'workflows';
return this.activeTab !== 'drive_logs' && this.activeTab !== 'performance' && this.activeTab !== 'drive_config' && this.activeTab !== 'drive_danger' && this.activeTab !== 'git_settings' && this.activeTab !== 'sync' && this.activeTab !== 'changes' && this.activeTab !== 'workflows';
},
jobs() {
return this.$root.jobs || [];
Expand Down
Loading
Loading