Finish deployments detials

This commit is contained in:
Matej Bačo
2023-08-09 18:58:56 +02:00
parent ee3fc64817
commit 0c5f2c5a3c
6 changed files with 102 additions and 43 deletions
+4 -4
View File
@@ -7,7 +7,7 @@
"name": "@appwrite/console",
"dependencies": {
"@analytics/google-analytics": "^1.0.5",
"@appwrite.io/console": "npm:matej-appwrite-console@7.1.122",
"@appwrite.io/console": "npm:matej-appwrite-console@7.1.123",
"@appwrite.io/pink": "0.0.7-next.0",
"@appwrite.io/pink-icons": "0.0.7-next.0",
"@popperjs/core": "^2.11.6",
@@ -159,9 +159,9 @@
},
"node_modules/@appwrite.io/console": {
"name": "matej-appwrite-console",
"version": "7.1.122",
"resolved": "https://registry.npmjs.org/matej-appwrite-console/-/matej-appwrite-console-7.1.122.tgz",
"integrity": "sha512-r4Pkg8qX4wXZxXsLmS3xfJTIf0hKBKsdrhxWJYWCTD8uDdfx6YX03fR4Lnm9b25PespKV3KUYGTqWZvlRXTdbw==",
"version": "7.1.123",
"resolved": "https://registry.npmjs.org/matej-appwrite-console/-/matej-appwrite-console-7.1.123.tgz",
"integrity": "sha512-AASU1sd1kyW8KwwL88/hNcxENcC0DdZ3/EkpFSvVuqsq5dQGduQrvhakP2krdwetkeDUSGuTUsMCnT1GdCLZJw==",
"dependencies": {
"cross-fetch": "3.1.5",
"isomorphic-form-data": "2.0.0"
+1 -1
View File
@@ -19,7 +19,7 @@
},
"dependencies": {
"@analytics/google-analytics": "^1.0.5",
"@appwrite.io/console": "npm:matej-appwrite-console@7.1.122",
"@appwrite.io/console": "npm:matej-appwrite-console@7.1.123",
"@appwrite.io/pink": "0.0.7-next.0",
"@appwrite.io/pink-icons": "0.0.7-next.0",
"@popperjs/core": "^2.11.6",
@@ -38,8 +38,9 @@
import DropListLink from '$lib/components/dropListLink.svelte';
import { page } from '$app/stores';
import { tooltip } from '$lib/actions/tooltip';
import { tick } from 'svelte';
import RedeployModal from './redeployModal.svelte';
import DeploymentSource from './deploymentSource.svelte';
import DeploymentCreatedBy from './deploymentCreatedBy.svelte';
export let data: PageData;
@@ -50,7 +51,6 @@
let showRedeploy = false;
let selectedDeployment: Models.Deployment = null;
let tooltipContent: HTMLDivElement;
function handleActivate() {
invalidate(Dependencies.DEPLOYMENTS);
@@ -102,7 +102,10 @@
</div>
<div class="u-flex u-gap-12 u-cross-center">
<a href={'//' + data.domain.rules[0].domain} target="_blank">
<a
class="u-underline u-cursor-pointer"
href={'//' + data.domain.rules[0].domain}
target="_blank">
{data.domain.rules[0].domain}
</a>
</div>
@@ -114,21 +117,14 @@
<div class="u-flex u-main-space-between">
<div>
<p><b>Build time:</b> {calculateTime(activeDeployment.buildTime)}</p>
<p><b>Created:</b> {timeFromNow(activeDeployment.$createdAt)}</p>
<p>
<b>Created:</b>
<DeploymentCreatedBy deployment={activeDeployment} />
</p>
<p><b>Size:</b> {fileSize.value + fileSize.unit}</p>
<p>
<b>Source:</b>
<span
use:tooltip={{
interactive: true,
allowHTML: true,
disabled: false,
onShow(instance) {
tick().then(() => {
instance.setContent(tooltipContent);
});
}
}}>Git</span>
<DeploymentSource deployment={activeDeployment} />
</p>
</div>
<div class="u-flex u-flex-vertical u-cross-end">
@@ -168,7 +164,7 @@
{/if}
<div class="common-section">
<Heading tag="h3" size="7">Inactive</Heading>
<Heading tag="h3" size="7">All</Heading>
</div>
{#if data.deployments.total > 0}
<TableScroll>
@@ -194,12 +190,22 @@
warning={status === 'pending'}
success={status === 'completed' || status === 'ready'}
info={status === 'processing' || status === 'building'}>
<span>{status}</span>
<span
class="text u-trim"
use:tooltip={{
content: 'Active Deployment',
placement: 'top'
}}>
{#if deployment.$id === $func.deployment}
<span class="icon-check-circle" aria-hidden="true" />
{/if}
<span>{status}</span></span>
</Pill>
</TableCell>
<TableCellText width={70} title="Source">Git</TableCellText>
<TableCellText width={70} title="Source">
<DeploymentSource {deployment} /></TableCellText>
<TableCellText width={140} title="Created">
{timeFromNow(deployment.$createdAt)}
<DeploymentCreatedBy {deployment} />
</TableCellText>
<TableCellText width={100} title="Build Time">
@@ -307,9 +313,3 @@
<Activate {selectedDeployment} bind:showActivate on:activated={handleActivate} />
<RedeployModal {selectedDeployment} bind:show={showRedeploy} />
{/if}
<div class="u-hide">
<div bind:this={tooltipContent}>
<p class="text">test</p>
</div>
</div>
@@ -17,7 +17,7 @@
import { Dependencies } from '$lib/constants';
import { timer } from '$lib/actions/timer';
import { tooltip } from '$lib/actions/tooltip';
import { tick } from 'svelte/types/runtime/internal/scheduler';
import DeploymentSource from '../deploymentSource.svelte';
export let data;
@@ -79,21 +79,11 @@
{calculateTime(data.deployment.buildTime)}
{/if}
</p>
<p><b>Created:</b> {timeFromNow(data.deployment.$createdAt)}</p>
<p><b>Created:</b> <deploymentCreatedBy deployment={activeDeployment} /></p>
<p><b>Size:</b> {fileSize.value + fileSize.unit}</p>
<p>
<b>Source:</b>
<span
use:tooltip={{
interactive: true,
allowHTML: true,
disabled: false,
onShow(instance) {
tick().then(() => {
instance.setContent(tooltipContent);
});
}
}}>Git</span>
<DeploymentSource deployment={data.deployment} />
</p>
</div>
<div class="u-flex u-flex-vertical u-cross-end">
@@ -0,0 +1,15 @@
<script lang="ts">
import { timeFromNow } from '$lib/helpers/date';
import { tooltip } from '$lib/actions/tooltip';
import type { Models } from '@appwrite.io/console';
export let deployment: Models.Deployment;
</script>
{timeFromNow(deployment.$createdAt)}
{#if deployment.providerCommitAuthor}
by <a
class="u-underline u-cursor-pointer"
target="_blank"
href={deployment.providerCommitAuthorUrl}>{deployment.providerCommitAuthor}</a>
{/if}
@@ -0,0 +1,54 @@
<script lang="ts">
import { tooltip } from '$lib/actions/tooltip';
import type { Models } from '@appwrite.io/console';
import { tick } from 'svelte';
export let deployment: Models.Deployment;
let tooltipContent: HTMLDivElement;
</script>
{#if deployment.type === 'vcs'}
<span
class="u-underline u-cursor-pointer"
use:tooltip={{
interactive: true,
allowHTML: true,
disabled: false,
onShow(instance) {
tick().then(() => {
instance.setContent(tooltipContent);
});
}
}}><span class="icon-github" aria-hidden="true" /> Git</span>
{:else if deployment.type === 'manual'}
<span class="icon-code" aria-hidden="true" /> <span>Manual</span>
{/if}
<div class="u-hide">
<div bind:this={tooltipContent} class="u-flex u-flex-vertical u-gap-2">
<span
><span class="icon-github" aria-hidden="true" />
<a
class="u-underline u-cursor-pointer"
target="_blank"
href={deployment.providerRepositoryUrl}
>{deployment.providerRepositoryOwner}/{deployment.providerRepositoryName}</a
></span>
<span
><span class="icon-git-branch" aria-hidden="true" />
<a
class="u-underline u-cursor-pointer"
target="_blank"
href={deployment.providerBranchUrl}>{deployment.providerBranch}</a
></span>
<span
><span class="icon-git-commit" aria-hidden="true" />
<a
class="u-underline u-cursor-pointer"
target="_blank"
href={deployment.providerCommitUrl}
>{deployment.providerCommitHash.substring(0, 7)}
{deployment.providerCommitMessage}</a
></span>
</div>
</div>