mirror of
https://github.com/cupcakearmy/coolify.git
synced 2024-10-22 08:04:19 +02:00
v1.0.4 (#21)
- Search in repositories (thanks to @SaraVieira).
- Custom Dockerfile - you be able to deploy ANY applications! 🎉
- Basic repository scanner for Nextjs and React. It will setup the default commands and buildpack if it detects some defined parameters.
- UI/UX fixes:
- Github loading screen instead of standard loading screen.
- Info tooltips which provide some explanations of the input fields.
This commit is contained in:
Andras Bacsai
GitHub
parent
3af1fd4d1b
commit
69f050b864
@ -50,15 +50,11 @@ function setDefaultConfiguration (configuration) {
|
||||
configuration.publish.port = 3000
|
||||
}
|
||||
}
|
||||
|
||||
if (configuration.build.pack === 'static') {
|
||||
if (!configuration.build.command.installation) configuration.build.command.installation = 'yarn install'
|
||||
if (!configuration.build.directory) configuration.build.directory = '/'
|
||||
if (!configuration.build.directory) {
|
||||
configuration.build.directory = '/'
|
||||
}
|
||||
|
||||
if (configuration.build.pack === 'nodejs') {
|
||||
if (configuration.build.pack === 'static' || configuration.build.pack === 'nodejs') {
|
||||
if (!configuration.build.command.installation) configuration.build.command.installation = 'yarn install'
|
||||
if (!configuration.build.directory) configuration.build.directory = '/'
|
||||
}
|
||||
|
||||
configuration.build.container.baseSHA = crypto.createHash('sha256').update(JSON.stringify(baseServiceConfiguration)).digest('hex')
|
||||
|
||||
@ -60,7 +60,6 @@ module.exports = async function (configuration, configChanged, imageChanged) {
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(stack)
|
||||
await saveAppLog('### Publishing.', configuration)
|
||||
await fs.writeFile(`${configuration.general.workdir}/stack.yml`, yaml.dump(stack))
|
||||
// TODO: Compare stack.yml with the currently running one to upgrade if something changes, like restart_policy
|
||||
|
||||
15
api/packs/custom/index.js
Normal file
15
api/packs/custom/index.js
Normal file
@ -0,0 +1,15 @@
|
||||
const fs = require('fs').promises
|
||||
const { streamEvents, docker } = require('../../libs/docker')
|
||||
|
||||
module.exports = async function (configuration) {
|
||||
const path = `${configuration.general.workdir}/${configuration.build.directory ? configuration.build.directory : ''}`
|
||||
if (fs.stat(`${path}/Dockerfile`)) {
|
||||
const stream = await docker.engine.buildImage(
|
||||
{ src: ['.'], context: path },
|
||||
{ t: `${configuration.build.container.name}:${configuration.build.container.tag}` }
|
||||
)
|
||||
await streamEvents(stream, configuration)
|
||||
} else {
|
||||
throw { error: 'No custom dockerfile found.', type: 'app' }
|
||||
}
|
||||
}
|
||||
@ -1,21 +1,16 @@
|
||||
const fs = require('fs').promises
|
||||
const { streamEvents, docker } = require('../libs/docker')
|
||||
|
||||
const buildImageNodeDocker = (configuration) => {
|
||||
return [
|
||||
'FROM node:lts',
|
||||
'WORKDIR /usr/src/app',
|
||||
`COPY ${configuration.build.directory} ./`,
|
||||
configuration.build.command.installation && `RUN ${configuration.build.command.installation}`,
|
||||
`RUN ${configuration.build.command.build}`
|
||||
].join('\n')
|
||||
}
|
||||
async function buildImage (configuration) {
|
||||
let dockerFile = `
|
||||
# build
|
||||
FROM node:lts
|
||||
WORKDIR /usr/src/app
|
||||
COPY package*.json .
|
||||
`
|
||||
if (configuration.build.command.installation) {
|
||||
dockerFile += `RUN ${configuration.build.command.installation}
|
||||
`
|
||||
}
|
||||
dockerFile += `COPY . .
|
||||
RUN ${configuration.build.command.build}`
|
||||
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, dockerFile)
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, buildImageNodeDocker(configuration))
|
||||
const stream = await docker.engine.buildImage(
|
||||
{ src: ['.'], context: configuration.general.workdir },
|
||||
{ t: `${configuration.build.container.name}:${configuration.build.container.tag}` }
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
const static = require('./static')
|
||||
const nodejs = require('./nodejs')
|
||||
const php = require('./php')
|
||||
const custom = require('./custom')
|
||||
|
||||
module.exports = { static, nodejs, php }
|
||||
module.exports = { static, nodejs, php, custom }
|
||||
|
||||
@ -2,32 +2,22 @@ const fs = require('fs').promises
|
||||
const { buildImage } = require('../helpers')
|
||||
const { streamEvents, docker } = require('../../libs/docker')
|
||||
|
||||
const publishNodejsDocker = (configuration) => {
|
||||
return [
|
||||
'FROM node:lts',
|
||||
'WORKDIR /usr/src/app',
|
||||
configuration.build.command.build
|
||||
? `COPY --from=${configuration.build.container.name}:${configuration.build.container.tag} /usr/src/app/${configuration.publish.directory} ./`
|
||||
: `COPY ${configuration.build.directory} ./`,
|
||||
configuration.build.command.installation && `RUN ${configuration.build.command.installation}`,
|
||||
`EXPOSE ${configuration.publish.port}`,
|
||||
'CMD [ "yarn", "start" ]'
|
||||
].join('\n')
|
||||
}
|
||||
|
||||
module.exports = async function (configuration) {
|
||||
if (configuration.build.command.build) await buildImage(configuration)
|
||||
|
||||
let dockerFile = `# production stage
|
||||
FROM node:lts
|
||||
WORKDIR /usr/src/app
|
||||
`
|
||||
if (configuration.build.command.build) {
|
||||
dockerFile += `COPY --from=${configuration.build.container.name}:${configuration.build.container.tag} /usr/src/app/${configuration.publish.directory} /usr/src/app`
|
||||
} else {
|
||||
if (configuration.publish.directory) {
|
||||
dockerFile += `COPY .${configuration.publish.directory} ./`
|
||||
} else {
|
||||
dockerFile += 'COPY ./'
|
||||
}
|
||||
}
|
||||
if (configuration.build.command.installation) {
|
||||
dockerFile += `
|
||||
RUN ${configuration.build.command.installation}
|
||||
`
|
||||
}
|
||||
dockerFile += `
|
||||
EXPOSE ${configuration.publish.port}
|
||||
CMD [ "yarn", "start" ]`
|
||||
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, dockerFile)
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, publishNodejsDocker(configuration))
|
||||
const stream = await docker.engine.buildImage(
|
||||
{ src: ['.'], context: configuration.general.workdir },
|
||||
{ t: `${configuration.build.container.name}:${configuration.build.container.tag}` }
|
||||
|
||||
@ -1,21 +1,18 @@
|
||||
const fs = require('fs').promises
|
||||
const { streamEvents, docker } = require('../../libs/docker')
|
||||
|
||||
const publishPHPDocker = (configuration) => {
|
||||
return [
|
||||
'FROM php:apache',
|
||||
'WORKDIR /usr/src/app',
|
||||
`COPY .${configuration.build.directory} /var/www/html`,
|
||||
'EXPOSE 80',
|
||||
' CMD ["apache2-foreground"]'
|
||||
].join('\n')
|
||||
}
|
||||
|
||||
module.exports = async function (configuration) {
|
||||
let dockerFile = `# production stage
|
||||
FROM php:apache
|
||||
`
|
||||
if (configuration.publish.directory) {
|
||||
dockerFile += `COPY ${configuration.publish.directory} /var/www/html`
|
||||
} else {
|
||||
dockerFile += 'COPY . /var/www/html'
|
||||
}
|
||||
|
||||
dockerFile += `
|
||||
EXPOSE 80
|
||||
CMD ["apache2-foreground"]`
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, dockerFile)
|
||||
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, publishPHPDocker(configuration))
|
||||
const stream = await docker.engine.buildImage(
|
||||
{ src: ['.'], context: configuration.general.workdir },
|
||||
{ t: `${configuration.build.container.name}:${configuration.build.container.tag}` }
|
||||
|
||||
@ -2,27 +2,22 @@ const fs = require('fs').promises
|
||||
const { buildImage } = require('../helpers')
|
||||
const { streamEvents, docker } = require('../../libs/docker')
|
||||
|
||||
const publishStaticDocker = (configuration) => {
|
||||
return [
|
||||
'FROM nginx:stable-alpine',
|
||||
'COPY nginx.conf /etc/nginx/nginx.conf',
|
||||
'WORKDIR /usr/share/nginx/html',
|
||||
configuration.build.command.build
|
||||
? `COPY --from=${configuration.build.container.name}:${configuration.build.container.tag} /usr/src/app/${configuration.publish.directory} ./`
|
||||
: `COPY ${configuration.build.directory} ./`,
|
||||
'EXPOSE 80',
|
||||
'CMD ["nginx", "-g", "daemon off;"]'
|
||||
].join('\n')
|
||||
}
|
||||
|
||||
module.exports = async function (configuration) {
|
||||
if (configuration.build.command.build) await buildImage(configuration)
|
||||
|
||||
let dockerFile = `# production stage
|
||||
FROM nginx:stable-alpine
|
||||
COPY nginx.conf /etc/nginx/nginx.conf
|
||||
`
|
||||
if (configuration.build.command.build) {
|
||||
dockerFile += `COPY --from=${configuration.build.container.name}:${configuration.build.container.tag} /usr/src/app/${configuration.publish.directory} /usr/share/nginx/html`
|
||||
} else {
|
||||
if (configuration.publish.directory) {
|
||||
dockerFile += `COPY .${configuration.publish.directory} /usr/share/nginx/html`
|
||||
} else {
|
||||
dockerFile += 'COPY . /usr/share/nginx/html'
|
||||
}
|
||||
}
|
||||
|
||||
dockerFile += `
|
||||
EXPOSE 80
|
||||
CMD ["nginx", "-g", "daemon off;"]`
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, dockerFile)
|
||||
await fs.writeFile(`${configuration.general.workdir}/Dockerfile`, publishStaticDocker(configuration))
|
||||
|
||||
const stream = await docker.engine.buildImage(
|
||||
{ src: ['.'], context: configuration.general.workdir },
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
<link rel="dns-prefetch" href="https://cdn.coollabs.io/" />
|
||||
<link rel="preconnect" href="https://cdn.coollabs.io/" crossorigin="" />
|
||||
<link rel="stylesheet" href="https://cdn.coollabs.io/fonts/montserrat/montserrat.css" />
|
||||
<link rel="stylesheet" href="https://cdn.coollabs.io/css/microtip-0.2.2.min.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "coolify",
|
||||
"description": "An open-source, hassle-free, self-hostable Heroku & Netlify alternative.",
|
||||
"version": "1.0.3",
|
||||
"version": "1.0.4",
|
||||
"license": "AGPL-3.0",
|
||||
"scripts": {
|
||||
"lint": "standard",
|
||||
@ -36,6 +36,7 @@
|
||||
"jsonwebtoken": "^8.5.1",
|
||||
"mongoose": "^5.11.4",
|
||||
"shelljs": "^0.8.4",
|
||||
"svelte-select": "^3.17.0",
|
||||
"unique-names-generator": "^4.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@ -19,6 +19,7 @@ dependencies:
|
||||
jsonwebtoken: 8.5.1
|
||||
mongoose: 5.12.2
|
||||
shelljs: 0.8.4
|
||||
svelte-select: 3.17.0
|
||||
unique-names-generator: 4.4.0
|
||||
devDependencies:
|
||||
mongodb-memory-server-core: 6.9.6
|
||||
@ -6042,6 +6043,10 @@ packages:
|
||||
requiresBuild: true
|
||||
resolution:
|
||||
integrity: sha512-SROWH0rB0DJ+0Ii264cprmNu/NJyZacs5wFD71ya93Cg/oA2lKHgQm4F6j0EWA4ktFMzeuJJm/eX6fka39hEHA==
|
||||
/svelte-select/3.17.0:
|
||||
dev: false
|
||||
resolution:
|
||||
integrity: sha512-ITmX/XUiSdkaILmsTviKRkZPaXckM5/FA7Y8BhiUPoamaZG/ZDyOo6ydjFu9fDVFTbwoAUGUi6HBjs+ZdK2AwA==
|
||||
/svelte/3.35.0:
|
||||
dev: true
|
||||
engines:
|
||||
@ -6783,6 +6788,7 @@ specifiers:
|
||||
svelte: ^3.29.7
|
||||
svelte-hmr: ^0.12.2
|
||||
svelte-preprocess: ^4.6.1
|
||||
svelte-select: ^3.17.0
|
||||
svite: 0.8.1
|
||||
tailwindcss: compat
|
||||
unique-names-generator: ^4.4.0
|
||||
|
||||
@ -3,8 +3,8 @@
|
||||
import { Router } from "@roxi/routify";
|
||||
import { routes } from "../.routify/routes";
|
||||
const options = {
|
||||
duration: 2000,
|
||||
dismissable: false
|
||||
duration: 5000,
|
||||
dismissable: true
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,29 +1,24 @@
|
||||
<script>
|
||||
import { application } from "@store";
|
||||
import Tooltip from "../../../Tooltip/TooltipInfo.svelte";
|
||||
</script>
|
||||
|
||||
<div class="grid grid-cols-1 max-w-2xl md:mx-auto mx-6 text-center">
|
||||
<label for="buildCommand">Build Command</label>
|
||||
<input
|
||||
class="mb-6"
|
||||
id="buildCommand"
|
||||
bind:value="{$application.build.command.build}"
|
||||
placeholder="eg: yarn build"
|
||||
/>
|
||||
<label for="installCommand"
|
||||
>Install Command <Tooltip label="Command to run for installing dependencies. eg: yarn install." />
|
||||
</label>
|
||||
|
||||
<label for="installCommand">Install Command</label>
|
||||
<input
|
||||
class="mb-6"
|
||||
id="installCommand"
|
||||
bind:value="{$application.build.command.installation}"
|
||||
placeholder="eg: yarn install"
|
||||
/>
|
||||
|
||||
<label for="baseDir">Base Directory</label>
|
||||
<label for="buildCommand">Build Command <Tooltip label="Command to run for building your application. If empty, no build phase initiated in the deploy process." /></label>
|
||||
<input
|
||||
id="baseDir"
|
||||
class="mb-6"
|
||||
bind:value="{$application.build.directory}"
|
||||
placeholder="/"
|
||||
id="buildCommand"
|
||||
bind:value="{$application.build.command.build}"
|
||||
placeholder="eg: yarn build"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -1,16 +1,40 @@
|
||||
<script>
|
||||
import { application } from "@store";
|
||||
import { application} from "@store";
|
||||
import TooltipInfo from "../../../Tooltip/TooltipInfo.svelte";
|
||||
</script>
|
||||
|
||||
<div>
|
||||
<div
|
||||
class="grid grid-cols-1 text-sm max-w-2xl md:mx-auto mx-6 pb-6 auto-cols-max "
|
||||
>
|
||||
<label for="buildPack">Build Pack</label>
|
||||
<label for="buildPack"
|
||||
>Build Pack
|
||||
{#if $application.build.pack === 'custom'}
|
||||
<TooltipInfo
|
||||
label="Your custom Dockerfile will be used from the root directory (or from 'Base Directory' specified below) of your repository. "
|
||||
/>
|
||||
{:else if $application.build.pack === 'static'}
|
||||
<TooltipInfo
|
||||
label="Published as a static site (for build phase see 'Build Step' tab)."
|
||||
/>
|
||||
{:else if $application.build.pack === 'nodejs'}
|
||||
<TooltipInfo
|
||||
label="Published as a Node.js application (for build phase see 'Build Step' tab)."
|
||||
/>
|
||||
{:else if $application.build.pack === 'php'}
|
||||
<TooltipInfo
|
||||
size="large"
|
||||
label="Published as a PHP application."
|
||||
/>
|
||||
{/if}
|
||||
|
||||
</label
|
||||
>
|
||||
<select id="buildPack" bind:value="{$application.build.pack}">
|
||||
<option selected class="font-bold">static</option>
|
||||
<option class="font-bold">nodejs</option>
|
||||
<option class="font-bold">php</option>
|
||||
<option class="font-bold">custom</option>
|
||||
</select>
|
||||
</div>
|
||||
<div
|
||||
@ -30,7 +54,11 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-flow-row">
|
||||
<label for="Path">Path</label>
|
||||
<label for="Path"
|
||||
>Path <TooltipInfo
|
||||
label="{`Path to deploy your application on your domain. eg: /api means it will be deployed to -> https://${$application.publish.domain}/api`}"
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
id="Path"
|
||||
bind:value="{$application.publish.path}"
|
||||
@ -38,19 +66,40 @@
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<label for="publishDir">Publish Directory</label>
|
||||
{#if $application.build.pack === "nodejs" || $application.build.pack === "custom"}
|
||||
<label for="Port" >Port</label>
|
||||
<input
|
||||
id="publishDir"
|
||||
bind:value="{$application.publish.directory}"
|
||||
placeholder="/"
|
||||
id="Port"
|
||||
class="mb-6"
|
||||
bind:value="{$application.publish.port}"
|
||||
placeholder="{$application.build.pack === 'static' ? '80' : '3000'}"
|
||||
/>
|
||||
{#if $application.build.pack === "nodejs"}
|
||||
<label for="Port" class="pt-6">Port</label>
|
||||
<input
|
||||
id="Port"
|
||||
bind:value="{$application.publish.port}"
|
||||
placeholder="{$application.build.pack === 'static' ? '80' : '3000'}"
|
||||
/>
|
||||
{/if}
|
||||
{/if}
|
||||
<div class="grid grid-flow-col gap-2 items-center pt-12">
|
||||
<div class="grid grid-flow-row">
|
||||
<label for="baseDir"
|
||||
>Base Directory <TooltipInfo
|
||||
label="The directory to use as base for every command (could be useful if you have a monorepo)."
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
id="baseDir"
|
||||
bind:value="{$application.build.directory}"
|
||||
placeholder="/"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-flow-row">
|
||||
<label for="publishDir"
|
||||
>Publish Directory <TooltipInfo
|
||||
label="The directory to deploy after running the build command. eg: dist, _site, public."
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
id="publishDir"
|
||||
bind:value="{$application.publish.directory}"
|
||||
placeholder="/"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -147,13 +147,13 @@
|
||||
<Login />
|
||||
{:else}
|
||||
{#await loadGithub()}
|
||||
<Loading />
|
||||
<Loading github githubLoadingText="Loading repositories..." />
|
||||
{:then}
|
||||
{#if loading.github}
|
||||
<Loading />
|
||||
<Loading github githubLoadingText="Loading repositories..." />
|
||||
{:else}
|
||||
<div
|
||||
class="text-center space-y-2 max-w-4xl mx-auto px-6"
|
||||
class="space-y-2 max-w-4xl mx-auto px-6"
|
||||
in:fade="{{ duration: 100 }}"
|
||||
>
|
||||
<Repositories
|
||||
|
||||
@ -1,36 +1,63 @@
|
||||
<style lang="postcss">
|
||||
:global(.repository-select-search .listItem .item),
|
||||
:global(.repository-select-search .empty) {
|
||||
@apply text-sm py-3 font-bold bg-warmGray-800 text-white cursor-pointer border-none hover:bg-warmGray-700 !important;
|
||||
}
|
||||
|
||||
:global(.repository-select-search .listContainer) {
|
||||
@apply bg-transparent !important;
|
||||
}
|
||||
|
||||
:global(.repository-select-search .clearSelect) {
|
||||
@apply text-white cursor-pointer !important;
|
||||
}
|
||||
|
||||
:global(.repository-select-search .selectedItem) {
|
||||
@apply text-white relative cursor-pointer font-bold text-sm flex items-center !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { createEventDispatcher } from "svelte";
|
||||
import { isActive } from "@roxi/routify";
|
||||
import { application } from "@store";
|
||||
import Select from "svelte-select";
|
||||
|
||||
function handleSelect(event) {
|
||||
$application.repository.id = parseInt(event.detail.value, 10);
|
||||
dispatch("loadBranches");
|
||||
}
|
||||
|
||||
export let repositories;
|
||||
let items = repositories.map(repo => ({
|
||||
label: `${repo.owner.login}/${repo.name}`,
|
||||
value: repo.id.toString(),
|
||||
}));
|
||||
|
||||
const selectedValue =
|
||||
!$isActive("/application/new") &&
|
||||
`${$application.repository.organization}/${$application.repository.name}`;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
const loadBranches = () => dispatch("loadBranches");
|
||||
const modifyGithubAppConfig = () => dispatch("modifyGithubAppConfig");
|
||||
</script>
|
||||
|
||||
<div class="grid grid-cols-1">
|
||||
{#if repositories.length !== 0}
|
||||
<label for="repository">Organization / Repository</label>
|
||||
<div class="grid grid-cols-3">
|
||||
<!-- svelte-ignore a11y-no-onchange -->
|
||||
<select
|
||||
id="repository"
|
||||
class:cursor-not-allowed="{!$isActive('/application/new')}"
|
||||
class="col-span-2"
|
||||
bind:value="{$application.repository.id}"
|
||||
on:change="{loadBranches}"
|
||||
disabled="{!$isActive('/application/new')}"
|
||||
>
|
||||
<option selected disabled>Select a repository</option>
|
||||
{#each repositories as repo}
|
||||
<option value="{repo.id}" class="font-bold">
|
||||
{repo.owner.login}
|
||||
/
|
||||
{repo.name}
|
||||
</option>
|
||||
{/each}
|
||||
</select>
|
||||
|
||||
<div class="grid grid-cols-3 ">
|
||||
<div class="repository-select-search col-span-2">
|
||||
<Select
|
||||
containerClasses="w-full border-none bg-transparent"
|
||||
on:select="{handleSelect}"
|
||||
selectedValue="{selectedValue}"
|
||||
isClearable="{false}"
|
||||
items="{items}"
|
||||
noOptionsMessage="No Repositories found"
|
||||
placeholder="Select a Repository"
|
||||
isDisabled="{!$isActive('/application/new')}"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
class="button col-span-1 ml-2 bg-warmGray-800 hover:bg-warmGray-700 text-white"
|
||||
on:click="{modifyGithubAppConfig}">Configure on Github</button
|
||||
|
||||
@ -1,11 +1,15 @@
|
||||
<script>
|
||||
import { redirect, isActive } from "@roxi/routify";
|
||||
import { onMount } from "svelte";
|
||||
import { toast } from "@zerodevx/svelte-toast";
|
||||
|
||||
import { application, fetch, deployments } from "@store";
|
||||
import General from "./ActiveTab/General.svelte";
|
||||
import BuildStep from "./ActiveTab/BuildStep.svelte";
|
||||
import Secrets from "./ActiveTab/Secrets.svelte";
|
||||
import { onMount } from "svelte";
|
||||
import Loading from "../../Loading.svelte";
|
||||
|
||||
let loading = false;
|
||||
onMount(async () => {
|
||||
if (!$isActive("/application/new")) {
|
||||
const config = await $fetch(`/api/v1/config`, {
|
||||
@ -22,13 +26,14 @@
|
||||
branch: $application.repository.branch,
|
||||
});
|
||||
} else {
|
||||
$deployments.applications.deployed.filter(d => {
|
||||
loading = true;
|
||||
$deployments?.applications?.deployed.filter(d => {
|
||||
const conf = d?.Spec?.Labels.application;
|
||||
if (
|
||||
conf.repository.organization ===
|
||||
conf?.repository?.organization ===
|
||||
$application.repository.organization &&
|
||||
conf.repository.name === $application.repository.name &&
|
||||
conf.repository.branch === $application.repository.branch
|
||||
conf?.repository?.name === $application.repository.name &&
|
||||
conf?.repository?.branch === $application.repository.branch
|
||||
) {
|
||||
$redirect(`/application/:organization/:name/:branch/configuration`, {
|
||||
name: $application.repository.name,
|
||||
@ -37,7 +42,51 @@
|
||||
});
|
||||
}
|
||||
});
|
||||
try {
|
||||
const dir = await $fetch(
|
||||
`https://api.github.com/repos/${$application.repository.organization}/${$application.repository.name}/contents/?ref=${$application.repository.branch}`,
|
||||
);
|
||||
const packageJson = dir.find(
|
||||
f => f.type === "file" && f.name === "package.json",
|
||||
);
|
||||
const Dockerfile = dir.find(
|
||||
f => f.type === "file" && f.name === "Dockerfile",
|
||||
);
|
||||
|
||||
if (Dockerfile) {
|
||||
$application.build.pack = "custom";
|
||||
toast.push("Custom Dockerfile found. Build pack set to custom.");
|
||||
} else if (packageJson) {
|
||||
// Check here for things like nextjs,react,vue,blablabla
|
||||
const { content } = await $fetch(packageJson.git_url);
|
||||
const packageJsonContent = JSON.parse(atob(content));
|
||||
|
||||
if (packageJsonContent.dependencies.hasOwnProperty("next")) {
|
||||
// Next.js
|
||||
$application.build.pack = "nodejs";
|
||||
$application.build.command.installation = "yarn install";
|
||||
if (packageJsonContent.scripts.hasOwnProperty("build")) {
|
||||
$application.build.command.build = `yarn build`;
|
||||
}
|
||||
toast.push("Next.js App detected. Build pack set to Node.js.");
|
||||
} else if (packageJsonContent.dependencies.hasOwnProperty("react")) {
|
||||
// CRA
|
||||
$application.build.pack = "static";
|
||||
$application.publish.directory = "build";
|
||||
$application.build.command.installation = "yarn install";
|
||||
if (packageJsonContent.scripts.hasOwnProperty("build")) {
|
||||
$application.build.command.build = `yarn build`;
|
||||
}
|
||||
toast.push(
|
||||
"React App detected. Build pack set to static with build phase.",
|
||||
);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
// Nothing detected
|
||||
}
|
||||
}
|
||||
loading = false;
|
||||
});
|
||||
let activeTab = {
|
||||
general: true,
|
||||
@ -56,42 +105,53 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="block text-center py-4">
|
||||
<nav
|
||||
class="flex space-x-4 justify-center font-bold text-md text-white"
|
||||
aria-label="Tabs"
|
||||
>
|
||||
<div
|
||||
on:click="{() => activateTab('general')}"
|
||||
class:text-green-500="{activeTab.general}"
|
||||
class="px-3 py-2 cursor-pointer hover:text-green-500"
|
||||
{#if loading}
|
||||
<Loading github githubLoadingText="Scanning repository 🤖" />
|
||||
{:else}
|
||||
<div class="block text-center py-4">
|
||||
<nav
|
||||
class="flex space-x-4 justify-center font-bold text-md text-white"
|
||||
aria-label="Tabs"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
on:click="{() => activateTab('buildStep')}"
|
||||
class:text-green-500="{activeTab.buildStep}"
|
||||
class="px-3 py-2 cursor-pointer hover:text-green-500"
|
||||
>
|
||||
Build Step
|
||||
</div>
|
||||
<div
|
||||
on:click="{() => activateTab('secrets')}"
|
||||
class:text-green-500="{activeTab.secrets}"
|
||||
class="px-3 py-2 cursor-pointer hover:text-green-500"
|
||||
>
|
||||
Secrets
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="max-w-4xl mx-auto">
|
||||
<div class="h-full">
|
||||
{#if activeTab.general}
|
||||
<General />
|
||||
{:else if activeTab.buildStep}
|
||||
<BuildStep />
|
||||
{:else if activeTab.secrets}
|
||||
<Secrets />
|
||||
{/if}
|
||||
<div
|
||||
on:click="{() => activateTab('general')}"
|
||||
class:text-green-500="{activeTab.general}"
|
||||
class="px-3 py-2 cursor-pointer hover:text-green-500"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
{#if $application.build.pack === "php"}
|
||||
<div disabled class="px-3 py-2 text-warmGray-700 cursor-not-allowed">
|
||||
Build Step
|
||||
</div>
|
||||
{:else}
|
||||
<div
|
||||
on:click="{() => activateTab('buildStep')}"
|
||||
class:text-green-500="{activeTab.buildStep}"
|
||||
class="px-3 py-2 cursor-pointer hover:text-green-500"
|
||||
>
|
||||
Build Step
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div
|
||||
on:click="{() => activateTab('secrets')}"
|
||||
class:text-green-500="{activeTab.secrets}"
|
||||
class="px-3 py-2 cursor-pointer hover:text-green-500"
|
||||
>
|
||||
Secrets
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
<div class="max-w-4xl mx-auto">
|
||||
<div class="h-full">
|
||||
{#if activeTab.general}
|
||||
<General />
|
||||
{:else if activeTab.buildStep}
|
||||
<BuildStep />
|
||||
{:else if activeTab.secrets}
|
||||
<Secrets />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@ -42,11 +42,38 @@
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export let github = false;
|
||||
export let githubLoadingText = "Loading GitHub...";
|
||||
export let fullscreen = true;
|
||||
</script>
|
||||
|
||||
{#if fullscreen}
|
||||
<div class="fixed top-0 flex flex-wrap content-center h-full w-full">
|
||||
<span class="loader"></span>
|
||||
</div>
|
||||
{#if github}
|
||||
<div class="fixed left-0 top-0 flex flex-wrap content-center h-full w-full">
|
||||
<div class="w-full flex justify-center items-center">
|
||||
<div class="w-64">
|
||||
<svg
|
||||
class=" w-28 animate-bounce mx-auto"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
><path
|
||||
d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"
|
||||
></path></svg
|
||||
>
|
||||
<div class="w-full text-xl font-bold text-center">
|
||||
{githubLoadingText}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="fixed left-0 top-0 flex flex-wrap content-center h-full w-full">
|
||||
<span class="loader"></span>
|
||||
</div>
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
14
src/components/Tooltip/Tooltip.svelte
Normal file
14
src/components/Tooltip/Tooltip.svelte
Normal file
@ -0,0 +1,14 @@
|
||||
<script>
|
||||
export let position = "bottom";
|
||||
export let label;
|
||||
export let size = "fit";
|
||||
</script>
|
||||
|
||||
<span
|
||||
aria-label="{label}"
|
||||
data-microtip-position="{position}"
|
||||
data-microtip-size="{size}"
|
||||
role="tooltip"
|
||||
>
|
||||
<slot></slot>
|
||||
</span>
|
||||
25
src/components/Tooltip/TooltipInfo.svelte
Normal file
25
src/components/Tooltip/TooltipInfo.svelte
Normal file
@ -0,0 +1,25 @@
|
||||
<script>
|
||||
export let position = "top";
|
||||
export let label;
|
||||
export let size = "large";
|
||||
</script>
|
||||
|
||||
<span
|
||||
class="absolute px-1 py-1"
|
||||
aria-label="{label}"
|
||||
data-microtip-position="{position}"
|
||||
data-microtip-size="{size}"
|
||||
role="tooltip"
|
||||
>
|
||||
<svg
|
||||
class="w-4 text-warmGray-600 hover:text-white"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
</span>
|
||||
@ -15,4 +15,28 @@ :root {
|
||||
--toastBackground: rgba(41, 37, 36, 0.8);
|
||||
--toastProgressBackground: transparent;
|
||||
--toastFont: 'Inter';
|
||||
}
|
||||
|
||||
[aria-label][role~="tooltip"]::after {
|
||||
background: rgba(41, 37, 36, 0.9);
|
||||
color: white;
|
||||
font-family: 'Inter';
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
[role~="tooltip"][data-microtip-position|="bottom"]::before {
|
||||
background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2841,%2037,%2036,%200.9%29%22%20transform%3D%22rotate%28180%2018%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
|
||||
}
|
||||
|
||||
[role~="tooltip"][data-microtip-position|="top"]::before {
|
||||
background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2841,%2037,%2036,%200.9%29%22%20transform%3D%22rotate%280%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
|
||||
}
|
||||
[role~="tooltip"][data-microtip-position="right"]::before {
|
||||
background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2841,%2037,%2036,%200.9%29%22%20transform%3D%22rotate%2890%206%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
|
||||
}
|
||||
|
||||
[role~="tooltip"][data-microtip-position="left"]::before {
|
||||
background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2841,%2037,%2036,%200.9%29%22%20transform%3D%22rotate%28-90%2018%2018%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
|
||||
}
|
||||
@ -9,26 +9,20 @@
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { url, goto, route, isActive, redirect } from "@roxi/routify/runtime";
|
||||
import {
|
||||
loggedIn,
|
||||
session,
|
||||
fetch,
|
||||
deployments,
|
||||
application,
|
||||
initConf,
|
||||
} from "@store";
|
||||
import { goto, route, isActive } from "@roxi/routify/runtime";
|
||||
import { loggedIn, session, fetch, deployments } from "@store";
|
||||
import { toast } from "@zerodevx/svelte-toast";
|
||||
import { onMount } from "svelte";
|
||||
import compareVersions from 'compare-versions';
|
||||
import compareVersions from "compare-versions";
|
||||
import packageJson from "../../package.json";
|
||||
import Tooltip from "../components/Tooltip/Tooltip.svelte";
|
||||
|
||||
let upgradeAvailable = false;
|
||||
let upgradeDisabled = false;
|
||||
let upgradeDone = false;
|
||||
let latest = {};
|
||||
onMount(async () => {
|
||||
upgradeAvailable = await checkUpgrade();
|
||||
if ($session.token) upgradeAvailable = await checkUpgrade();
|
||||
});
|
||||
async function verifyToken() {
|
||||
if ($session.token) {
|
||||
@ -74,14 +68,20 @@
|
||||
}
|
||||
}
|
||||
async function checkUpgrade() {
|
||||
const branch = process.env.NODE_ENV === 'production' && window.location.hostname !== 'test.andrasbacsai.dev' ? 'main' : 'next'
|
||||
const branch =
|
||||
process.env.NODE_ENV === "production" &&
|
||||
window.location.hostname !== "test.andrasbacsai.dev"
|
||||
? "main"
|
||||
: "next";
|
||||
latest = await window
|
||||
.fetch(
|
||||
`https://raw.githubusercontent.com/coollabsio/coolify/${branch}/package.json`,
|
||||
{ cache: "no-cache" },
|
||||
)
|
||||
.then(r => r.json());
|
||||
return compareVersions(latest.version,packageJson.version) === 1 ? true : false
|
||||
return compareVersions(latest.version, packageJson.version) === 1
|
||||
? true
|
||||
: false;
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -91,123 +91,128 @@
|
||||
class="w-16 bg-warmGray-800 text-white top-0 left-0 fixed min-w-4rem min-h-screen"
|
||||
>
|
||||
<div
|
||||
class="flex flex-col w-full h-screen items-center space-y-4 transition-all duration-100"
|
||||
class="flex flex-col w-full h-screen items-center transition-all duration-100"
|
||||
class:border-green-500="{$isActive('/dashboard/applications')}"
|
||||
class:border-purple-500="{$isActive('/dashboard/databases')}"
|
||||
>
|
||||
<img class="w-10 pt-4 pb-4" src="/favicon.png" alt="coolLabs logo" />
|
||||
<div
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-green-500 my-4 transition-all duration-100 cursor-pointer"
|
||||
on:click="{() => $goto('/dashboard/applications')}"
|
||||
class:text-green-500="{$isActive('/dashboard/applications') ||
|
||||
$isActive('/application')}"
|
||||
class:bg-warmGray-700="{$isActive('/dashboard/applications') ||
|
||||
$isActive('/application')}"
|
||||
>
|
||||
<svg
|
||||
class="w-8"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
><rect x="4" y="4" width="16" height="16" rx="2" ry="2"></rect><rect
|
||||
x="9"
|
||||
y="9"
|
||||
width="6"
|
||||
height="6"></rect><line x1="9" y1="1" x2="9" y2="4"></line><line
|
||||
x1="15"
|
||||
y1="1"
|
||||
x2="15"
|
||||
y2="4"></line><line x1="9" y1="20" x2="9" y2="23"></line><line
|
||||
x1="15"
|
||||
y1="20"
|
||||
x2="15"
|
||||
y2="23"></line><line x1="20" y1="9" x2="23" y2="9"></line><line
|
||||
x1="20"
|
||||
y1="14"
|
||||
x2="23"
|
||||
y2="14"></line><line x1="1" y1="9" x2="4" y2="9"></line><line
|
||||
x1="1"
|
||||
y1="14"
|
||||
x2="4"
|
||||
y2="14"></line></svg
|
||||
<Tooltip position="right" label="Applications">
|
||||
<div
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-green-500 my-4 transition-all duration-100 cursor-pointer"
|
||||
on:click="{() => $goto('/dashboard/applications')}"
|
||||
class:text-green-500="{$isActive('/dashboard/applications') ||
|
||||
$isActive('/application')}"
|
||||
class:bg-warmGray-700="{$isActive('/dashboard/applications') ||
|
||||
$isActive('/application')}"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-purple-500 my-4 transition-all duration-100 cursor-pointer"
|
||||
on:click="{() => $goto('/dashboard/databases')}"
|
||||
class:text-purple-500="{$isActive('/dashboard/databases') ||
|
||||
$isActive('/database')}"
|
||||
class:bg-warmGray-700="{$isActive('/dashboard/databases') ||
|
||||
$isActive('/database')}"
|
||||
>
|
||||
<svg
|
||||
class="w-8"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
<svg
|
||||
class="w-8"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
><rect x="4" y="4" width="16" height="16" rx="2" ry="2"
|
||||
></rect><rect x="9" y="9" width="6" height="6"></rect><line
|
||||
x1="9"
|
||||
y1="1"
|
||||
x2="9"
|
||||
y2="4"></line><line x1="15" y1="1" x2="15" y2="4"></line><line
|
||||
x1="9"
|
||||
y1="20"
|
||||
x2="9"
|
||||
y2="23"></line><line x1="15" y1="20" x2="15" y2="23"
|
||||
></line><line x1="20" y1="9" x2="23" y2="9"></line><line
|
||||
x1="20"
|
||||
y1="14"
|
||||
x2="23"
|
||||
y2="14"></line><line x1="1" y1="9" x2="4" y2="9"></line><line
|
||||
x1="1"
|
||||
y1="14"
|
||||
x2="4"
|
||||
y2="14"></line></svg
|
||||
>
|
||||
</div>
|
||||
</Tooltip>
|
||||
<Tooltip position="right" label="Databases">
|
||||
<div
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-purple-500 transition-all duration-100 cursor-pointer"
|
||||
on:click="{() => $goto('/dashboard/databases')}"
|
||||
class:text-purple-500="{$isActive('/dashboard/databases') ||
|
||||
$isActive('/database')}"
|
||||
class:bg-warmGray-700="{$isActive('/dashboard/databases') ||
|
||||
$isActive('/database')}"
|
||||
>
|
||||
<svg
|
||||
class="w-8"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</Tooltip>
|
||||
<div class="flex-1"></div>
|
||||
<button
|
||||
title="Settings"
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-yellow-500 my-4 transition-all duration-100 cursor-pointer"
|
||||
class:text-yellow-500="{$isActive('/settings')}"
|
||||
class:bg-warmGray-700="{$isActive('/settings')}"
|
||||
on:click="{() => $goto('/settings')}"
|
||||
>
|
||||
<svg
|
||||
class="w-8"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
<Tooltip position="right" label="Settings">
|
||||
<button
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-yellow-500 transition-all duration-100 cursor-pointer"
|
||||
class:text-yellow-500="{$isActive('/settings')}"
|
||||
class:bg-warmGray-700="{$isActive('/settings')}"
|
||||
on:click="{() => $goto('/settings')}"
|
||||
>
|
||||
<path
|
||||
<svg
|
||||
class="w-8"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
|
||||
></path>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</Tooltip>
|
||||
<Tooltip position="right" label="Logout">
|
||||
<button
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-red-500 my-4 transition-all duration-100 cursor-pointer"
|
||||
on:click="{logout}"
|
||||
>
|
||||
<svg
|
||||
class="w-7"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
|
||||
></path>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
class="p-2 hover:bg-warmGray-700 rounded hover:text-red-500 my-4 transition-all duration-100 cursor-pointer"
|
||||
on:click="{logout}"
|
||||
>
|
||||
<svg
|
||||
class="w-7"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline
|
||||
points="16 17 21 12 16 7"></polyline><line
|
||||
x1="21"
|
||||
y1="12"
|
||||
x2="9"
|
||||
y2="12"></line></svg
|
||||
>
|
||||
</button>
|
||||
><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"
|
||||
></path><polyline points="16 17 21 12 16 7"></polyline><line
|
||||
x1="21"
|
||||
y1="12"
|
||||
x2="9"
|
||||
y2="12"></line></svg
|
||||
>
|
||||
</button>
|
||||
</Tooltip>
|
||||
<div
|
||||
class="cursor-pointer text-xs font-bold text-warmGray-400 py-2 hover:bg-warmGray-700 w-full text-center"
|
||||
>
|
||||
@ -223,32 +228,32 @@
|
||||
<div class="flex items-center">
|
||||
<div></div>
|
||||
<div class="flex-1"></div>
|
||||
{#if !upgradeDisabled}
|
||||
<button
|
||||
class="bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-xs font-bold rounded px-2 py-2"
|
||||
disabled="{upgradeDisabled}"
|
||||
on:click="{upgrade}"
|
||||
>New version available, <br>click here to upgrade!</button
|
||||
>
|
||||
{:else if upgradeDone}
|
||||
<button
|
||||
use:reloadInAMin
|
||||
class="font-bold text-xs rounded px-2 cursor-not-allowed"
|
||||
disabled="{upgradeDisabled}"
|
||||
>Upgrade done. 🎉 Automatically reloading in 30s.</button
|
||||
>
|
||||
{:else}
|
||||
<button
|
||||
class="opacity-50 tracking-tight font-bold text-xs rounded px-2 cursor-not-allowed"
|
||||
disabled="{upgradeDisabled}">Upgrading. It could take a while, please wait...</button
|
||||
>
|
||||
{/if}
|
||||
|
||||
{#if !upgradeDisabled}
|
||||
<button
|
||||
class="bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-xs font-bold rounded px-2 py-2"
|
||||
disabled="{upgradeDisabled}"
|
||||
on:click="{upgrade}"
|
||||
>New version available, <br />click here to upgrade!</button
|
||||
>
|
||||
{:else if upgradeDone}
|
||||
<button
|
||||
use:reloadInAMin
|
||||
class="font-bold text-xs rounded px-2 cursor-not-allowed"
|
||||
disabled="{upgradeDisabled}"
|
||||
>Upgrade done. 🎉 Automatically reloading in 30s.</button
|
||||
>
|
||||
{:else}
|
||||
<button
|
||||
class="opacity-50 tracking-tight font-bold text-xs rounded px-2 cursor-not-allowed"
|
||||
disabled="{upgradeDisabled}"
|
||||
>Upgrading. It could take a while, please wait...</button
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
</footer>
|
||||
{/if}
|
||||
<main class:main={$route.path !== "/index"}>
|
||||
<slot />
|
||||
{/if}
|
||||
<main class:main="{$route.path !== '/index'}">
|
||||
<slot />
|
||||
</main>
|
||||
{:catch test}
|
||||
{$goto("/index")}
|
||||
|
||||
@ -1,30 +1,6 @@
|
||||
<script>
|
||||
import { redirect, isActive } from "@roxi/routify";
|
||||
import { application, fetch, initialApplication, initConf } from "@store";
|
||||
import { toast } from "@zerodevx/svelte-toast";
|
||||
import { application } from "@store";
|
||||
import Configuration from "../../../../../components/Application/Configuration/Configuration.svelte";
|
||||
import Loading from "../../../../../components/Loading.svelte";
|
||||
|
||||
async function loadConfiguration() {
|
||||
if (!$isActive("/application/new")) {
|
||||
try {
|
||||
const config = await $fetch(`/api/v1/config`, {
|
||||
body: {
|
||||
name: $application.repository.name,
|
||||
organization: $application.repository.organization,
|
||||
branch: $application.repository.branch,
|
||||
},
|
||||
});
|
||||
$application = { ...config };
|
||||
$initConf = JSON.parse(JSON.stringify($application));
|
||||
} catch (error) {
|
||||
toast.push("Configuration not found.");
|
||||
$redirect("/dashboard/applications");
|
||||
}
|
||||
} else {
|
||||
$application = JSON.parse(JSON.stringify(initialApplication));
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="min-h-full text-white">
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
<script>
|
||||
import { fade } from "svelte/transition";
|
||||
import { application } from "@store";
|
||||
import Configuration from "../../../../../components/Application/Configuration/Configuration.svelte";
|
||||
</script>
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
import { fade } from "svelte/transition";
|
||||
import Loading from "../../components/Loading.svelte";
|
||||
import { toast } from "@zerodevx/svelte-toast";
|
||||
import Tooltip from "../../components/Tooltip/Tooltip.svelte";
|
||||
|
||||
$application.repository.organization = $params.organization;
|
||||
$application.repository.name = $params.name;
|
||||
@ -77,8 +78,8 @@
|
||||
<nav
|
||||
class="flex text-white justify-end items-center m-4 fixed right-0 top-0 space-x-4"
|
||||
>
|
||||
<Tooltip position="bottom" label="Deploy" >
|
||||
<button
|
||||
title="Deploy"
|
||||
disabled="{$application.publish.domain === '' ||
|
||||
$application.publish.domain === null}"
|
||||
class:cursor-not-allowed="{$application.publish.domain === '' ||
|
||||
@ -91,6 +92,7 @@
|
||||
class="icon"
|
||||
on:click="{deploy}"
|
||||
>
|
||||
|
||||
<svg
|
||||
class="w-6"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -108,9 +110,11 @@
|
||||
d="M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3"></path><polyline
|
||||
points="16 16 12 12 8 16"></polyline></svg
|
||||
>
|
||||
|
||||
</button>
|
||||
</Tooltip>
|
||||
<Tooltip position="bottom" label="Delete" >
|
||||
<button
|
||||
title="Delete"
|
||||
disabled="{$application.publish.domain === '' ||
|
||||
$application.publish.domain === null ||
|
||||
$isActive('/application/new')}"
|
||||
@ -143,9 +147,11 @@
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
</Tooltip>
|
||||
<div class="border border-warmGray-700 h-8"></div>
|
||||
<Tooltip position="bottom" label="Logs" >
|
||||
<button
|
||||
title="Logs"
|
||||
|
||||
class="icon"
|
||||
class:text-warmGray-700="{$isActive('/application/new')}"
|
||||
disabled="{$isActive('/application/new')}"
|
||||
@ -178,8 +184,9 @@
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
</Tooltip>
|
||||
<Tooltip position="bottom-left" label="Configuration" >
|
||||
<button
|
||||
title="Configuration"
|
||||
class="icon hover:text-yellow-400"
|
||||
disabled="{$isActive(`/application/new`)}"
|
||||
class:text-yellow-400="{$isActive(
|
||||
@ -208,6 +215,7 @@
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
</Tooltip>
|
||||
</nav>
|
||||
|
||||
<div class="text-white">
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<script>
|
||||
import { deployments } from "@store";
|
||||
import { deployments, dateOptions } from "@store";
|
||||
import { fade } from "svelte/transition";
|
||||
import { goto } from "@roxi/routify/runtime";
|
||||
|
||||
@ -55,7 +55,7 @@
|
||||
.organization,
|
||||
})}"
|
||||
>
|
||||
<div class="flex items-center ">
|
||||
<div class="flex items-center">
|
||||
{#if application.Spec.Labels.configuration.build.pack === "static"}
|
||||
<svg
|
||||
class="text-white w-10 h-10 absolute top-0 left-0 -m-4"
|
||||
@ -85,7 +85,7 @@
|
||||
>
|
||||
{:else if application.Spec.Labels.configuration.build.pack === "nodejs"}
|
||||
<svg
|
||||
class="text-white w-10 h-10 absolute top-0 left-0 -m-4"
|
||||
class="text-green-400 w-10 h-10 absolute top-0 left-0 -m-4"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
aria-hidden="true"
|
||||
focusable="false"
|
||||
@ -98,13 +98,97 @@
|
||||
d="M224 508c-6.7 0-13.5-1.8-19.4-5.2l-61.7-36.5c-9.2-5.2-4.7-7-1.7-8 12.3-4.3 14.8-5.2 27.9-12.7 1.4-.8 3.2-.5 4.6.4l47.4 28.1c1.7 1 4.1 1 5.7 0l184.7-106.6c1.7-1 2.8-3 2.8-5V149.3c0-2.1-1.1-4-2.9-5.1L226.8 37.7c-1.7-1-4-1-5.7 0L36.6 144.3c-1.8 1-2.9 3-2.9 5.1v213.1c0 2 1.1 4 2.9 4.9l50.6 29.2c27.5 13.7 44.3-2.4 44.3-18.7V167.5c0-3 2.4-5.3 5.4-5.3h23.4c2.9 0 5.4 2.3 5.4 5.3V378c0 36.6-20 57.6-54.7 57.6-10.7 0-19.1 0-42.5-11.6l-48.4-27.9C8.1 389.2.7 376.3.7 362.4V149.3c0-13.8 7.4-26.8 19.4-33.7L204.6 9c11.7-6.6 27.2-6.6 38.8 0l184.7 106.7c12 6.9 19.4 19.8 19.4 33.7v213.1c0 13.8-7.4 26.7-19.4 33.7L243.4 502.8c-5.9 3.4-12.6 5.2-19.4 5.2zm149.1-210.1c0-39.9-27-50.5-83.7-58-57.4-7.6-63.2-11.5-63.2-24.9 0-11.1 4.9-25.9 47.4-25.9 37.9 0 51.9 8.2 57.7 33.8.5 2.4 2.7 4.2 5.2 4.2h24c1.5 0 2.9-.6 3.9-1.7s1.5-2.6 1.4-4.1c-3.7-44.1-33-64.6-92.2-64.6-52.7 0-84.1 22.2-84.1 59.5 0 40.4 31.3 51.6 81.8 56.6 60.5 5.9 65.2 14.8 65.2 26.7 0 20.6-16.6 29.4-55.5 29.4-48.9 0-59.6-12.3-63.2-36.6-.4-2.6-2.6-4.5-5.3-4.5h-23.9c-3 0-5.3 2.4-5.3 5.3 0 31.1 16.9 68.2 97.8 68.2 58.4-.1 92-23.2 92-63.4z"
|
||||
></path>
|
||||
</svg>
|
||||
{:else if application.Spec.Labels.configuration.build.pack === "php"}
|
||||
<svg viewBox="0 0 128 128" class="text-white w-14 h-14 absolute top-0 left-0 -m-6">
|
||||
<path fill="#6181B6" d="M64 33.039c-33.74 0-61.094 13.862-61.094 30.961s27.354 30.961 61.094 30.961 61.094-13.862 61.094-30.961-27.354-30.961-61.094-30.961zm-15.897 36.993c-1.458 1.364-3.077 1.927-4.86 2.507-1.783.581-4.052.461-6.811.461h-6.253l-1.733 10h-7.301l6.515-34h14.04c4.224 0 7.305 1.215 9.242 3.432 1.937 2.217 2.519 5.364 1.747 9.337-.319 1.637-.856 3.159-1.614 4.515-.759 1.357-1.75 2.624-2.972 3.748zm21.311 2.968l2.881-14.42c.328-1.688.208-2.942-.361-3.555-.57-.614-1.782-1.025-3.635-1.025h-5.79l-3.731 19h-7.244l6.515-33h7.244l-1.732 9h6.453c4.061 0 6.861.815 8.402 2.231s2.003 3.356 1.387 6.528l-3.031 15.241h-7.358zm40.259-11.178c-.318 1.637-.856 3.133-1.613 4.488-.758 1.357-1.748 2.598-2.971 3.722-1.458 1.364-3.078 1.927-4.86 2.507-1.782.581-4.053.461-6.812.461h-6.253l-1.732 10h-7.301l6.514-34h14.041c4.224 0 7.305 1.215 9.241 3.432 1.935 2.217 2.518 5.418 1.746 9.39zM95.919 54h-5.001l-2.727 14h4.442c2.942 0 5.136-.29 6.576-1.4 1.442-1.108 2.413-2.828 2.918-5.421.484-2.491.264-4.434-.66-5.458-.925-1.024-2.774-1.721-5.548-1.721zM38.934 54h-5.002l-2.727 14h4.441c2.943 0 5.136-.29 6.577-1.4 1.441-1.108 2.413-2.828 2.917-5.421.484-2.491.264-4.434-.66-5.458s-2.772-1.721-5.546-1.721z"></path>
|
||||
</svg>
|
||||
{:else if application.Spec.Labels.configuration.build.pack === "php"}
|
||||
<svg
|
||||
viewBox="0 0 128 128"
|
||||
class="text-white w-14 h-14 absolute top-0 left-0 -m-6"
|
||||
>
|
||||
<path
|
||||
fill="#6181B6"
|
||||
d="M64 33.039c-33.74 0-61.094 13.862-61.094 30.961s27.354 30.961 61.094 30.961 61.094-13.862 61.094-30.961-27.354-30.961-61.094-30.961zm-15.897 36.993c-1.458 1.364-3.077 1.927-4.86 2.507-1.783.581-4.052.461-6.811.461h-6.253l-1.733 10h-7.301l6.515-34h14.04c4.224 0 7.305 1.215 9.242 3.432 1.937 2.217 2.519 5.364 1.747 9.337-.319 1.637-.856 3.159-1.614 4.515-.759 1.357-1.75 2.624-2.972 3.748zm21.311 2.968l2.881-14.42c.328-1.688.208-2.942-.361-3.555-.57-.614-1.782-1.025-3.635-1.025h-5.79l-3.731 19h-7.244l6.515-33h7.244l-1.732 9h6.453c4.061 0 6.861.815 8.402 2.231s2.003 3.356 1.387 6.528l-3.031 15.241h-7.358zm40.259-11.178c-.318 1.637-.856 3.133-1.613 4.488-.758 1.357-1.748 2.598-2.971 3.722-1.458 1.364-3.078 1.927-4.86 2.507-1.782.581-4.053.461-6.812.461h-6.253l-1.732 10h-7.301l6.514-34h14.041c4.224 0 7.305 1.215 9.241 3.432 1.935 2.217 2.518 5.418 1.746 9.39zM95.919 54h-5.001l-2.727 14h4.442c2.942 0 5.136-.29 6.576-1.4 1.442-1.108 2.413-2.828 2.918-5.421.484-2.491.264-4.434-.66-5.458-.925-1.024-2.774-1.721-5.548-1.721zM38.934 54h-5.002l-2.727 14h4.441c2.943 0 5.136-.29 6.577-1.4 1.441-1.108 2.413-2.828 2.917-5.421.484-2.491.264-4.434-.66-5.458s-2.772-1.721-5.546-1.721z"
|
||||
></path>
|
||||
</svg>
|
||||
{:else if application.Spec.Labels.configuration.build.pack === "custom"}
|
||||
<svg
|
||||
viewBox="0 0 128 128"
|
||||
class="w-16 h-16 absolute top-0 left-0 -m-8"
|
||||
>
|
||||
<g
|
||||
><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#3A4D54"
|
||||
d="M73.8 50.8h11.3v11.5h5.7c2.6 0 5.3-.5 7.8-1.3 1.2-.4 2.6-1 3.8-1.7-1.6-2.1-2.4-4.7-2.6-7.3-.3-3.5.4-8.1 2.8-10.8l1.2-1.4 1.4 1.1c3.6 2.9 6.5 6.8 7.1 11.4 4.3-1.3 9.3-1 13.1 1.2l1.5.9-.8 1.6c-3.2 6.2-9.9 8.2-16.4 7.8-9.8 24.3-31 35.8-56.8 35.8-13.3 0-25.5-5-32.5-16.8l-.1-.2-1-2.1c-2.4-5.2-3.1-10.9-2.6-16.6l.2-1.7h9.6v-11.4h11.3v-11.2h22.5v-11.3h13.5v22.5z"
|
||||
></path><path
|
||||
fill="#00AADA"
|
||||
d="M110.4 55.1c.8-5.9-3.6-10.5-6.4-12.7-3.1 3.6-3.6 13.2 1.3 17.2-2.8 2.4-8.5 4.7-14.5 4.7h-72.2c-.6 6.2.5 11.9 3 16.8l.8 1.5c.5.9 1.1 1.7 1.7 2.6 3 .2 5.7.3 8.2.2 4.9-.1 8.9-.7 12-1.7.5-.2.9.1 1.1.5.2.5-.1.9-.5 1.1-.4.1-.8.3-1.3.4-2.4.7-5 1.1-8.3 1.3h-.6000000000000001c-1.3.1-2.7.1-4.2.1-1.6 0-3.1 0-4.9-.1 6 6.8 15.4 10.8 27.2 10.8 25 0 46.2-11.1 55.5-35.9 6.7.7 13.1-1 16-6.7-4.5-2.7-10.5-1.8-13.9-.1z"
|
||||
></path><path
|
||||
fill="#28B8EB"
|
||||
d="M110.4 55.1c.8-5.9-3.6-10.5-6.4-12.7-3.1 3.6-3.6 13.2 1.3 17.2-2.8 2.4-8.5 4.7-14.5 4.7h-68c-.3 9.5 3.2 16.7 9.5 21 4.9-.1 8.9-.7 12-1.7.5-.2.9.1 1.1.5.2.5-.1.9-.5 1.1-.4.1-.8.3-1.3.4-2.4.7-5.2 1.2-8.5 1.4l-.1-.1c8.5 4.4 20.8 4.3 35-1.1 15.8-6.1 30.6-17.7 40.9-30.9-.2.1-.4.1-.5.2z"
|
||||
></path><path
|
||||
fill="#028BB8"
|
||||
d="M18.7 71.8c.4 3.3 1.4 6.4 2.9 9.3l.8 1.5c.5.9 1.1 1.7 1.7 2.6 3 .2 5.7.3 8.2.2 4.9-.1 8.9-.7 12-1.7.5-.2.9.1 1.1.5.2.5-.1.9-.5 1.1-.4.1-.8.3-1.3.4-2.4.7-5.2 1.2-8.5 1.4h-.4c-1.3.1-2.7.1-4.1.1-1.6 0-3.2 0-4.9-.1 6 6.8 15.5 10.8 27.3 10.8 21.4 0 40-8.1 50.8-26h-85.1v-.1z"
|
||||
></path><path
|
||||
fill="#019BC6"
|
||||
d="M23.5 71.8c1.3 5.8 4.3 10.4 8.8 13.5 4.9-.1 8.9-.7 12-1.7.5-.2.9.1 1.1.5.2.5-.1.9-.5 1.1-.4.1-.8.3-1.3.4-2.4.7-5.2 1.2-8.6 1.4 8.5 4.4 20.8 4.3 34.9-1.1 8.5-3.3 16.8-8.2 24.2-14.1h-70.6z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#00ACD3"
|
||||
d="M28.4 52.7h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zM39.6 41.5h9.8v9.8h-9.8v-9.8zm.9.8h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#23C2EE"
|
||||
d="M39.6 52.7h9.8v9.8h-9.8v-9.8zm.9.8h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#00ACD3"
|
||||
d="M50.9 52.7h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#23C2EE"
|
||||
d="M50.9 41.5h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zM62.2 52.7h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#00ACD3"
|
||||
d="M62.2 41.5h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#23C2EE"
|
||||
d="M62.2 30.2h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#00ACD3"
|
||||
d="M73.5 52.7h9.8v9.8h-9.8v-9.8zm.8.8h.8v8.1h-.8v-8.1zm1.4 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1zm1.5 0h.8v8.1h-.8v-8.1z"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#D4EEF1"
|
||||
d="M48.8 78.3c1.5 0 2.7 1.2 2.7 2.7 0 1.5-1.2 2.7-2.7 2.7-1.5 0-2.7-1.2-2.7-2.7 0-1.5 1.2-2.7 2.7-2.7"
|
||||
></path><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
fill="#3A4D54"
|
||||
d="M48.8 79.1c.2 0 .5 0 .7.1-.2.1-.4.4-.4.7 0 .4.4.8.8.8.3 0 .6-.2.7-.4.1.2.1.5.1.7 0 1.1-.9 1.9-1.9 1.9-1.1 0-1.9-.9-1.9-1.9 0-1 .8-1.9 1.9-1.9M1.1 72.8h125.4c-2.7-.7-8.6-1.6-7.7-5.2-5 5.7-16.9 4-20 1.2-3.4 4.9-23 3-24.3-.8-4.2 5-17.3 5-21.5 0-1.4 3.8-21 5.7-24.3.8-3 2.8-15 4.5-20-1.2 1.1 3.5-4.9 4.5-7.6 5.2"
|
||||
></path><path
|
||||
fill="#BFDBE0"
|
||||
d="M56 97.8c-6.7-3.2-10.3-7.5-12.4-12.2-2.5.7-5.5 1.2-8.9 1.4-1.3.1-2.7.1-4.1.1-1.7 0-3.4 0-5.2-.1 6 6 13.6 10.7 27.5 10.8h3.1z"
|
||||
></path><path
|
||||
fill="#D4EEF1"
|
||||
d="M46.1 89.9c-.9-1.3-1.8-2.8-2.5-4.3-2.5.7-5.5 1.2-8.9 1.4 2.3 1.2 5.7 2.4 11.4 2.9z"
|
||||
></path></g
|
||||
>
|
||||
</svg>
|
||||
{/if}
|
||||
<div class="flex flex-col justify-center items-center w-full">
|
||||
<div
|
||||
class="text-xs font-bold text-center w-full text-warmGray-300 group-hover:text-white"
|
||||
class="text-xs font-bold text-center w-full text-warmGray-300 group-hover:text-white pb-6"
|
||||
>
|
||||
{application.Spec.Labels.configuration.publish
|
||||
.domain}{application.Spec.Labels.configuration.publish
|
||||
@ -112,6 +196,14 @@
|
||||
? application.Spec.Labels.configuration.publish.path
|
||||
: ""}
|
||||
</div>
|
||||
<div class="text-xs font-bold text-center w-full text-warmGray-300 group-hover:text-white">
|
||||
Last deployment<br>
|
||||
{new Intl.DateTimeFormat(
|
||||
'default',
|
||||
$dateOptions,
|
||||
).format(new Date(application.UpdatedAt))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -32,6 +32,15 @@ module.exports = {
|
||||
important: true,
|
||||
theme: {
|
||||
extend: {
|
||||
keyframes: {
|
||||
wiggle: {
|
||||
'0%, 100%': { transform: 'rotate(-3deg)' },
|
||||
'50%': { transform: 'rotate(3deg)' }
|
||||
}
|
||||
},
|
||||
animation: {
|
||||
wiggle: 'wiggle 0.5s ease-in-out infinite'
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['Montserrat', ...defaultTheme.fontFamily.sans]
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user