ui: responsive!
This commit is contained in:
Andras Bacsai
parent
051629fad3
commit
6fc99524f0
@ -10,7 +10,7 @@
|
||||
.slice(-16);
|
||||
</script>
|
||||
|
||||
<a {id} href={url} target="_blank" class="icons inline-block text-pink-500 cursor-pointer text-xs">
|
||||
<a {id} href={url} target="_blank" class="icons inline-block cursor-pointer text-xs mx-2">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="w-6 h-6"
|
||||
|
||||
@ -10,17 +10,17 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div {id} class="inline-block mx-2 text-pink-500 cursor-pointer" bind:this={self}>
|
||||
<div {id} class="inline-block mx-2 cursor-pointer" bind:this={self}>
|
||||
<svg
|
||||
fill="none"
|
||||
height="18"
|
||||
height="14"
|
||||
shape-rendering="geometricPrecision"
|
||||
stroke="currentColor"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="1.5"
|
||||
stroke-width="1.4"
|
||||
viewBox="0 0 24 24"
|
||||
width="18"
|
||||
width="14"
|
||||
><path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z" /><path
|
||||
d="M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"
|
||||
/><circle cx="12" cy="17" r=".5" />
|
||||
|
||||
@ -15,9 +15,13 @@
|
||||
|
||||
<div class="flex items-center py-4 pr-8">
|
||||
<div class="flex w-96 flex-col">
|
||||
<div class="text-xs font-bold text-stone-100 md:text-base">
|
||||
{title}<Explaner explanation={description} />
|
||||
</div>
|
||||
<!-- svelte-ignore a11y-label-has-associated-control -->
|
||||
<label>
|
||||
{title}
|
||||
{#if description && description !== ''}
|
||||
<Explaner explanation={description} />
|
||||
{/if}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class:text-center={isCenter} class="flex justify-center">
|
||||
|
||||
@ -2,6 +2,11 @@
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
const dispatch = createEventDispatcher();
|
||||
export let type = 'info';
|
||||
function success() {
|
||||
if (type === 'success') {
|
||||
return 'bg-gradient-to-r from-coollabs to-pink-500';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div
|
||||
@ -10,8 +15,7 @@
|
||||
on:focus={() => dispatch('pause')}
|
||||
on:mouseout={() => dispatch('resume')}
|
||||
on:blur={() => dispatch('resume')}
|
||||
class="alert shadow-lg text-white rounded hover:scale-105 transition-all duration-100 cursor-pointer"
|
||||
class:bg-coollabs={type === 'success'}
|
||||
class={`alert shadow-lg text-white hover:scale-105 transition-all duration-100 cursor-pointer rounded ${success()}`}
|
||||
class:alert-error={type === 'error'}
|
||||
class:alert-info={type === 'info'}
|
||||
>
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
<script lang="ts">
|
||||
import { fade } from 'svelte/transition';
|
||||
import Toast from './Toast.svelte';
|
||||
|
||||
import { dismissToast, pauseToast, resumeToast, toasts } from '$lib/store';
|
||||
@ -7,9 +6,9 @@
|
||||
|
||||
{#if $toasts}
|
||||
<section>
|
||||
<article class="toast toast-top toast-end rounded-none" role="alert" transition:fade>
|
||||
<article class="toast toast-top toast-end rounded-none px-10" role="alert" >
|
||||
{#each $toasts as toast (toast.id)}
|
||||
<Toast
|
||||
<Toast
|
||||
type={toast.type}
|
||||
on:resume={() => resumeToast(toast.id)}
|
||||
on:pause={() => pauseToast(toast.id)}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<script lang="ts">
|
||||
import { Tooltip } from 'flowbite-svelte';
|
||||
export let placement = 'bottom';
|
||||
export let color = 'bg-coollabs text-left';
|
||||
export let color = 'bg-coolgray-300 font-thin text-left';
|
||||
export let triggeredBy = '#tooltip-default';
|
||||
</script>
|
||||
|
||||
|
||||
@ -83,7 +83,7 @@
|
||||
id="update"
|
||||
disabled={updateStatus.success === false}
|
||||
on:click={update}
|
||||
class="icons bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
|
||||
class="icons bg-gradient-to-r from-coollabs to-pink-500 text-white duration-75 hover:scale-105"
|
||||
>
|
||||
{#if updateStatus.loading}
|
||||
<svg
|
||||
|
||||
@ -79,12 +79,12 @@
|
||||
BETA
|
||||
</div>
|
||||
{/if}
|
||||
<div class="w-full flex flex-col lg:flex-row space-y-4 lg:space-y-0">
|
||||
<div class="w-full flex flex-col lg:flex-row space-y-4 lg:space-y-0 space-x-4">
|
||||
<div class="flex flex-col">
|
||||
<h1 class="font-bold text-lg lg:text-xl truncate">
|
||||
{server.name}
|
||||
</h1>
|
||||
<div class="text-xs ">
|
||||
<div class="text-xs">
|
||||
{#if server?.remoteIpAddress}
|
||||
<h2>{server?.remoteIpAddress}</h2>
|
||||
{:else}
|
||||
|
||||
@ -9,15 +9,8 @@
|
||||
viewBox="0 0 309.88 252.72"
|
||||
class={isAbsolute ? 'absolute top-0 left-0 -m-5 h-12 w-12 ' : 'mx-auto w-8 h-8'}
|
||||
>
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #fff;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<path
|
||||
class="cls-1"
|
||||
fill="#fff"
|
||||
d="M316,10.05a4.2,4.2,0,0,0-2.84-1c-2.84,0-6.5,1.92-8.46,3l-.79.4a26.81,26.81,0,0,1-10.57,2.66c-3.76.12-7,.34-11.22.77-25,2.58-36.15,21.74-46.89,40.27-5.84,10.08-11.88,20.5-20.16,28.57a55.71,55.71,0,0,1-5.46,4.63c-8.57,6.39-19.33,10.9-27.74,14.12-8.07,3.08-16.86,5.85-25.37,8.53-7.78,2.45-15.14,4.76-21.9,7.28-3.05,1.13-5.64,2-7.93,2.76-6.15,2-10.6,3.53-17.08,8-2.53,1.73-5.07,3.6-6.8,5a71.26,71.26,0,0,0-13.54,14.27A84.81,84.81,0,0,1,77.88,163c-1.36,1.34-3.8,2-7.43,2-4.27,0-9.43-.88-14.91-1.81s-11.46-2-16.46-2c-4.07,0-7.17.66-9.5,2,0,0-3.9,2.28-5.56,5.23l1.62.73a33.56,33.56,0,0,1,6.93,5,33.68,33.68,0,0,0,7.19,5.12A6.37,6.37,0,0,1,42,180.72c-.69,1-1.69,2.29-2.74,3.67-5.77,7.55-9.13,12.32-7.2,14.92a6,6,0,0,0,3,.68c12.59,0,19.34-3.27,27.9-7.41,2.47-1.2,5-2.44,8-3.7,5-2.17,10.38-5.63,16.08-9.29,7.55-4.85,15.36-9.87,22.92-12.3a62.3,62.3,0,0,1,19.23-2.7c8,0,16.42,1.07,24.54,2.11,6.06.78,12.32,1.58,18.47,2,2.39.14,4.6.21,6.76.21a78.48,78.48,0,0,0,8.61-.45l.68-.24c4.32-2.65,6.34-8.34,8.29-13.84,1.26-3.54,2.32-6.72,4-8.74a2.06,2.06,0,0,1,.33-.27.4.4,0,0,1,.49.08.25.25,0,0,1,0,.16c-1,21.51-9.67,35.16-18.42,47.3L177,199.14s8.18,0,12.84-1.8c17-5.08,29.84-16.28,39.18-34.14a144.39,144.39,0,0,0,6.16-14.09c.16-.4,1.64-1.14,1.49.93,0,.61-.08,1.29-.13,2h0c0,.42-.06.85-.08,1.28-.25,3-1,9.34-1,9.34l5.25-2.81c12.66-8,22.42-24.14,29.82-49.25,3.09-10.46,5.34-20.85,7.33-30,2.38-11,4.43-20.43,6.78-24.09,3.69-5.74,9.32-9.62,14.77-13.39.75-.51,1.49-1,2.22-1.54,6.86-4.81,13.67-10.36,15.16-20.71l0-.23C317.93,12.92,317,11,316,10.05Z"
|
||||
transform="translate(-7.45 -9.1)"
|
||||
/>
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<svg
|
||||
viewBox="0 0 700 240"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class={isAbsolute ? 'w-36 absolute top-0 left-0 -m-3 -mt-5' : 'w-28 h-28 mx-auto'}
|
||||
class={isAbsolute ? 'w-36 absolute top-0 left-0 -m-3 -mt-5' : 'w-full h-10 mx-auto'}
|
||||
><path fill="#FDBC3D" d="m90.694 107.498-.981.39-20.608 8.23 6.332 6.547z" /><path
|
||||
fill="#8EC63F"
|
||||
d="M61.139 77.914 46.632 93 56.9 103.547c8.649-7.169 17.832-10.502 18.653-10.789L61.139 77.914z"
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class={isAbsolute ? 'w-16 h-16 absolute top-0 left-0 -m-7' : 'w-12 h-12 mx-auto'}
|
||||
class={isAbsolute ? 'w-16 h-16 absolute top-0 left-0 -m-7' : 'w-10 h-10 mx-auto'}
|
||||
version="1.1"
|
||||
viewBox="0 0 300 300"
|
||||
><linearGradient
|
||||
|
||||
@ -88,7 +88,7 @@
|
||||
"removing": "Removing...",
|
||||
"remove_domain": "Remove domain",
|
||||
"public_port_range": "Public Port Range",
|
||||
"public_port_range_explainer": "Ports used to expose databases/services/internal services.<br> Add them to your firewall (if applicable).<br><br>You can specify a range of ports, eg: <span class='text-settings font-bold'>9000-9100</span>",
|
||||
"public_port_range_explainer": "Ports used to expose databases/services/internal services.<br> Add them to your firewall (if applicable).<br><br>You can specify a range of ports, eg: <span class='text-settings '>9000-9100</span>",
|
||||
"no_actions_available": "No actions available",
|
||||
"admin_api_key": "Admin API key"
|
||||
},
|
||||
@ -144,8 +144,8 @@
|
||||
},
|
||||
"preview": {
|
||||
"need_during_buildtime": "Need during buildtime?",
|
||||
"setup_secret_app_first": "You can add secrets to PR/MR deployments. Please add secrets to the application first. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments.",
|
||||
"values_overwriting_app_secrets": "These values overwrite application secrets in PR/MR deployments. Useful for creating <span class='text-green-500 font-bold'>staging</span> environments.",
|
||||
"setup_secret_app_first": "You can add secrets to PR/MR deployments. Please add secrets to the application first. <br>Useful for creating <span class='text-settings '>staging</span> environments.",
|
||||
"values_overwriting_app_secrets": "These values overwrite application secrets in PR/MR deployments. Useful for creating <span class='text-settings '>staging</span> environments.",
|
||||
"redeploy": "Redeploy",
|
||||
"no_previews_available": "No previews available"
|
||||
},
|
||||
@ -159,7 +159,7 @@
|
||||
"storage_saved": "Storage saved.",
|
||||
"storage_updated": "Storage updated.",
|
||||
"storage_deleted": "Storage deleted.",
|
||||
"persistent_storage_explainer": "You can specify any folder that you want to be persistent across deployments.<br><span class='text-green-500 font-bold'>/example</span> means it will preserve <span class='text-green-500 font-bold'>/app/example</span> in the container as <span class='text-green-500 font-bold'>/app</span> is <span class='text-green-500 font-bold'>the root directory</span> for your application.<br><br>This is useful for storing data such as a <span class='text-green-500 font-bold'>database (SQLite)</span> or a <span class='text-green-500 font-bold'>cache</span>."
|
||||
"persistent_storage_explainer": "You can specify any folder that you want to be persistent across deployments.<br><span class='text-settings '>/example</span> means it will preserve <span class='text-settings '>/app/example</span> in the container as <span class='text-settings '>/app</span> is <span class='text-settings '>the root directory</span> for your application.<br><br>This is useful for storing data such as a <span class='text-settings '>database (SQLite)</span> or a <span class='text-settings '>cache</span>."
|
||||
},
|
||||
"deployment_queued": "Deployment queued.",
|
||||
"confirm_to_delete": "Are you sure you would like to delete '{{name}}'?",
|
||||
@ -194,14 +194,14 @@
|
||||
"application": "Application",
|
||||
"url_fqdn": "URL (FQDN)",
|
||||
"domain_fqdn": "Domain (FQDN)",
|
||||
"https_explainer": "If you specify <span class='text-green-500 font-bold'>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-green-500 font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-white font-bold'>You must set your DNS to point to the server IP in advance.</span>",
|
||||
"https_explainer": "If you specify <span class='text-settings '>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-settings '>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-white '>You must set your DNS to point to the server IP in advance.</span>",
|
||||
"ssl_www_and_non_www": "Generate SSL for www and non-www?",
|
||||
"ssl_explainer": "It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-green-500'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both.",
|
||||
"ssl_explainer": "It will generate certificates for both www and non-www. <br>You need to have <span class=' text-settings'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both.",
|
||||
"install_command": "Install Command",
|
||||
"build_command": "Build Command",
|
||||
"start_command": "Start Command",
|
||||
"directory_to_use_explainer": "Directory to use as the base for all commands.<br>Could be useful with <span class='text-green-500 font-bold'>monorepos</span>.",
|
||||
"publish_directory_explainer": "Directory containing all the assets for deployment. <br> For example: <span class='text-green-500 font-bold'>dist</span>,<span class='text-green-500 font-bold'>_site</span> or <span class='text-green-500 font-bold'>public</span>.",
|
||||
"directory_to_use_explainer": "Directory to use as the base for all commands.<br>Could be useful with <span class='text-settings '>monorepos</span>.",
|
||||
"publish_directory_explainer": "Directory containing all the assets for deployment. <br> For example: <span class='text-settings '>dist</span>,<span class='text-settings '>_site</span> or <span class='text-settings '>public</span>.",
|
||||
"features": "Features",
|
||||
"enable_automatic_deployment": "Enable Automatic Deployment",
|
||||
"enable_auto_deploy_webhooks": "Enable automatic deployment through webhooks.",
|
||||
@ -209,7 +209,7 @@
|
||||
"expose_a_port": "Expose a port",
|
||||
"enable_preview_deploy_mr_pr_requests": "Enable preview deployments from pull or merge requests.",
|
||||
"debug_logs": "Debug Logs",
|
||||
"enable_debug_log_during_build": "Enable debug logs during build phase.<br><span class='text-settings font-bold'>Sensitive information</span> could be visible and saved in logs.",
|
||||
"enable_debug_log_during_build": "Enable debug logs during build phase.<br><span class='text-settings '>Sensitive information</span> could be visible and saved in logs.",
|
||||
"cant_activate_auto_deploy_without_repo": "Cannot activate automatic deployments until only one application is defined for this repository / branch.",
|
||||
"no_applications_found": "No applications found",
|
||||
"secret__batch_dot_env": "Paste .env file",
|
||||
@ -223,7 +223,7 @@
|
||||
"set_public": "Set it public",
|
||||
"warning_database_public": "Your database will be reachable over the internet. <br>Take security seriously in this case!",
|
||||
"change_append_only_mode": "Change append only mode",
|
||||
"warning_append_only": "Useful if you would like to restore redis data from a backup.<br><span class='font-bold text-white'>Database restart is required.</span>",
|
||||
"warning_append_only": "Useful if you would like to restore redis data from a backup.<br><span class=' text-white'>Database restart is required.</span>",
|
||||
"select_database_type": "Select a Database type",
|
||||
"select_database_version": "Select a Database version",
|
||||
"confirm_stop": "Are you sure you would like to stop {{name}}?",
|
||||
@ -275,7 +275,7 @@
|
||||
"application_id": "Application ID",
|
||||
"group_name": "Group Name",
|
||||
"oauth_id": "OAuth ID",
|
||||
"oauth_id_explainer": "The OAuth ID is the unique identifier of the GitLab application. <br>You can find it <span class='font-bold text-settings' >in the URL</span> of your GitLab OAuth Application.",
|
||||
"oauth_id_explainer": "The OAuth ID is the unique identifier of the GitLab application. <br>You can find it <span class=' text-settings' >in the URL</span> of your GitLab OAuth Application.",
|
||||
"register_oauth_gitlab": "Register new OAuth application on GitLab",
|
||||
"gitlab": {
|
||||
"self_hosted": "Instance-wide application (self-hosted)",
|
||||
@ -290,7 +290,7 @@
|
||||
},
|
||||
"services": {
|
||||
"all_email_verified": "All emails are verified. You can login now.",
|
||||
"generate_www_non_www_ssl": "It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-pink-600'>both DNS entries</span> set in advance.<br><br>Service needs to be restarted."
|
||||
"generate_www_non_www_ssl": "It will generate certificates for both www and non-www. <br>You need to have <span class='text-settings'>both DNS entries</span> set in advance.<br><br>Service needs to be restarted."
|
||||
},
|
||||
"service": {
|
||||
"stop_service": "Stop",
|
||||
@ -306,15 +306,15 @@
|
||||
"change_language": "Change Language",
|
||||
"permission_denied": "You do not have permission to do this. \\nAsk an admin to modify your permissions.",
|
||||
"domain_removed": "Domain removed",
|
||||
"ssl_explainer": "If you specify <span class='text-settings font-bold'>https</span>, Coolify will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-settings font-bold'>www</span>, Coolify will be redirected (302) from non-www and vice versa.<br><br><span class='text-settings font-bold'>WARNING:</span> If you change an already set domain, it will break webhooks and other integrations! You need to manually update them.",
|
||||
"ssl_explainer": "If you specify <span class='text-settings'>https</span>, Coolify will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-settings '>www</span>, Coolify will be redirected (302) from non-www and vice versa.<br><br><span class='text-settings '>WARNING:</span> If you change an already set domain, it will break webhooks and other integrations! You need to manually update them.",
|
||||
"must_remove_domain_before_changing": "Must remove the domain before you can change this setting.",
|
||||
"registration_allowed": "Registration allowed?",
|
||||
"registration_allowed_explainer": "Allow further registrations to the application. <br>It's turned off after the first registration.",
|
||||
"coolify_proxy_settings": "Coolify Proxy Settings",
|
||||
"credential_stat_explainer": "Credentials for <a class=\"text-white font-bold\" href=\"{{link}}\" target=\"_blank\">stats</a> page.",
|
||||
"credential_stat_explainer": "Credentials for <a class=\"text-white \" href=\"{{link}}\" target=\"_blank\">stats</a> page.",
|
||||
"auto_update_enabled": "Auto update enabled?",
|
||||
"auto_update_enabled_explainer": "Enable automatic updates for Coolify. It will be done automatically behind the scenes, if there is no build process running.",
|
||||
"generate_www_non_www_ssl": "It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-settings'>both DNS entries</span> set in advance.",
|
||||
"generate_www_non_www_ssl": "It will generate certificates for both www and non-www. <br>You need to have <span class=' text-settings'>both DNS entries</span> set in advance.",
|
||||
"is_dns_check_enabled": "DNS check enabled?",
|
||||
"is_dns_check_enabled_explainer": "You can disable DNS check before creating SSL certificates.<br><br>Turning it off is useful when Coolify is behind a reverse proxy or tunnel."
|
||||
},
|
||||
@ -324,9 +324,9 @@
|
||||
"delete": "Delete",
|
||||
"member": "member(s)",
|
||||
"root": "(root)",
|
||||
"invited_with_permissions": "Invited to <span class=\"font-bold text-pink-600\">{{teamName}}</span> with <span class=\"font-bold text-rose-600\">{{permission}}</span> permission.",
|
||||
"invited_with_permissions": "Invited to <span class=\" text-settings\">{{teamName}}</span> with <span class=\" text-rose-600\">{{permission}}</span> permission.",
|
||||
"members": "Members",
|
||||
"root_team_explainer": "This is the <span class='text-red-500 font-bold'>root</span> team. That means members of this group can manage instance wide settings and have all the priviliges in Coolify (imagine like root user on Linux).",
|
||||
"root_team_explainer": "This is the <span class='text-red-500 '>root</span> team. That means members of this group can manage instance wide settings and have all the priviliges in Coolify (imagine like root user on Linux).",
|
||||
"permission": "Permission",
|
||||
"you": "(You)",
|
||||
"promote_to": "Promote to {{grade}}",
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="dropdown dropdown-left">
|
||||
<div class="dropdown dropdown-bottom">
|
||||
<slot>
|
||||
<label for="new" tabindex="0" class="btn btn-square btn-sm bg-coollabs">
|
||||
<svg
|
||||
|
||||
@ -107,10 +107,11 @@
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>Coolify</title>
|
||||
{#if !$appSession.whiteLabeled}
|
||||
<title>Coolify</title>
|
||||
<link rel="icon" href="/favicon.png" />
|
||||
{:else if $appSession.whiteLabeledDetails.icon}
|
||||
<title>Coolify</title>
|
||||
<link rel="icon" href={$appSession.whiteLabeledDetails.icon} />
|
||||
{/if}
|
||||
</svelte:head>
|
||||
@ -284,25 +285,18 @@
|
||||
{/if}
|
||||
{/if}
|
||||
<div
|
||||
class="navbar bg-neutral-focus lg:hidden space-x-2 flex flex-row items-center"
|
||||
class="navbar lg:hidden space-x-2 flex flex-row items-center bg-coollabs"
|
||||
class:hidden={!$appSession.userId}
|
||||
>
|
||||
<label for="main-drawer" class="drawer-button btn btn-square btn-ghost">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
class="inline-block w-5 h-5 stroke-current"
|
||||
><path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 6h16M4 12h16M4 18h16"
|
||||
/></svg
|
||||
>
|
||||
<label for="main-drawer" class="drawer-button btn btn-square btn-ghost flex-col">
|
||||
<span class="burger bg-white" />
|
||||
<span class="burger bg-white" />
|
||||
<span class="burger bg-white" />
|
||||
</label>
|
||||
<div class="prose flex flex-row justify-between space-x-1 w-full items-center pr-3">
|
||||
<h3 class="mb-0">Coolify</h3>
|
||||
{#if !$appSession.whiteLabeled}
|
||||
<h3 class="mb-0 text-white">Coolify</h3>
|
||||
{/if}
|
||||
<UpdateAvailable />
|
||||
</div>
|
||||
</div>
|
||||
@ -314,10 +308,7 @@
|
||||
</div>
|
||||
<div class="drawer-side">
|
||||
<label for="main-drawer" class="drawer-overlay w-full" />
|
||||
<ul class="menu bg-base-100 w-80 p-2 rounded-r-lg space-y-3">
|
||||
<li class="menu-title">
|
||||
<span>Main</span>
|
||||
</li>
|
||||
<ul class="menu bg-coolgray-300 w-60 p-2 space-y-3 pt-4 ">
|
||||
<li>
|
||||
<a
|
||||
class="no-underline icons hover:text-white"
|
||||
@ -329,7 +320,7 @@
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="h-9 w-9"
|
||||
class="h-8 w-8"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
@ -346,12 +337,10 @@
|
||||
Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-title">
|
||||
<span>Manage</span>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a
|
||||
class="no-underline"
|
||||
class="no-underline icons hover:text-white"
|
||||
sveltekit:prefetch
|
||||
href="/servers"
|
||||
class:bg-applications={$page.url.pathname.startsWith('/servers')}
|
||||
@ -375,15 +364,12 @@
|
||||
Servers
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-title">
|
||||
<span>Dashboard settings</span>
|
||||
</li>
|
||||
<li>
|
||||
<a class="no-underline" href="/iam" class:bg-iam={$page.url.pathname.startsWith('/iam')}
|
||||
<a class="no-underline icons hover:text-white" href="/iam" class:bg-iam={$page.url.pathname.startsWith('/iam')}
|
||||
><svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
class="h-9 w-9"
|
||||
class="h-8 w-8"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
fill="none"
|
||||
@ -402,7 +388,7 @@
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="no-underline"
|
||||
class="no-underline icons hover:text-white"
|
||||
href={$appSession.teamId === '0' ? '/settings/global' : '/settings/ssh-keys'}
|
||||
class:bg-settings={$page.url.pathname.startsWith('/settings')}
|
||||
class:text-black={$page.url.pathname.startsWith('/settings')}
|
||||
@ -410,7 +396,7 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
class="h-9 w-9"
|
||||
class="h-8 w-8"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
fill="none"
|
||||
@ -430,7 +416,7 @@
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<div class="no-underline hover:bg-error" on:click={logout}>
|
||||
<div class="no-underline icons hover:bg-error" on:click={logout}>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="ml-1 h-8 w-8"
|
||||
@ -447,10 +433,18 @@
|
||||
/>
|
||||
<path d="M7 12h14l-3 -3m0 6l3 -3" />
|
||||
</svg>
|
||||
Logout
|
||||
<div class="-ml-1">Logout</div>
|
||||
</div>
|
||||
<Tooltip triggeredBy="#logout" placement="right" color="bg-red-600">Logout</Tooltip>
|
||||
</li>
|
||||
<li class="flex-1 bg-transparent" />
|
||||
<li class="w-full justify-center">
|
||||
<a
|
||||
class="text-xs hover:bg-coolgray-200 no-underline hover:text-white"
|
||||
href={`https://github.com/coollabsio/coolify/releases/tag/v${$appSession.version}`}
|
||||
target="_blank">Changelog: v{$appSession.version}</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -188,13 +188,30 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<nav class="header">
|
||||
<div class="hidden items-center space-x-2 p-5 px-6 font-bold lg:flex">
|
||||
<div class="flex flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
<nav class="header lg:flex-row flex-col-reverse">
|
||||
<div class="flex flex-row space-x-2 font-bold pt-10 lg:pt-0">
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<div class="title">
|
||||
{#if $page.url.pathname === `/applications/${id}`}
|
||||
Configurations
|
||||
{:else if $page.url.pathname === `/applications/${id}/secrets`}
|
||||
Secrets
|
||||
{:else if $page.url.pathname === `/applications/${id}/storages`}
|
||||
Persistent Storages
|
||||
{:else if $page.url.pathname === `/applications/${id}/previews`}
|
||||
Preview Deployments
|
||||
{:else if $page.url.pathname === `/applications/${id}/logs`}
|
||||
Application Logs
|
||||
{:else if $page.url.pathname === `/applications/${id}/logs/build`}
|
||||
Build Logs
|
||||
{:else if $page.url.pathname === `/applications/${id}/configuration/source`}
|
||||
Select a Git Source
|
||||
{:else if $page.url.pathname === `/applications/${id}/configuration/destination`}
|
||||
Select a Destination
|
||||
{:else if $page.url.pathname === `/applications/${id}/configuration/buildpack`}
|
||||
Select a Build Pack
|
||||
{/if}
|
||||
</div>
|
||||
<span class="text-xs">{application.name}</span>
|
||||
</div>
|
||||
{#if application.gitSource?.htmlUrl && application.repository && application.branch}
|
||||
<a
|
||||
@ -242,15 +259,10 @@
|
||||
<Tooltip triggeredBy="#git">Open on Git</Tooltip>
|
||||
{/if}
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-row flex-wrap space-x-4 space-y-3 justify-center lg:justify-start py-2 lg:py-0"
|
||||
>
|
||||
<div class="lg:block hidden flex-1" />
|
||||
<div class="flex flex-row flex-wrap space-x-3 justify-center lg:justify-start lg:py-0">
|
||||
{#if $location}
|
||||
<a
|
||||
id="open"
|
||||
href={$location}
|
||||
target="_blank"
|
||||
class="icons flex items-center bg-transparent text-sm mt-3"
|
||||
<a id="open" href={$location} target="_blank" class="icons bg-transparent"
|
||||
><svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="h-6 w-6"
|
||||
@ -269,13 +281,13 @@
|
||||
>
|
||||
<Tooltip triggeredBy="#open">Open</Tooltip>
|
||||
|
||||
<div class="border border-coolgray-500 h-8" />
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
{/if}
|
||||
{#if $status.application.isExited || $status.application.isRestarting}
|
||||
<a
|
||||
id="applicationerror"
|
||||
href={$isDeploymentEnabled ? `/applications/${id}/logs` : null}
|
||||
class="icons bg-transparent text-sm flex items-center text-error"
|
||||
class="icons bg-transparent text-sm text-error"
|
||||
sveltekit:prefetch
|
||||
>
|
||||
<svg
|
||||
@ -299,9 +311,7 @@
|
||||
<Tooltip triggeredBy="#applicationerror">Application exited with an error!</Tooltip>
|
||||
{/if}
|
||||
{#if $status.application.initialLoading}
|
||||
<button
|
||||
class="icons flex animate-spin items-center space-x-2 bg-transparent text-sm duration-500 ease-in-out"
|
||||
>
|
||||
<button class="icons animate-spin bg-transparent duration-500 ease-in-out">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="h-6 w-6"
|
||||
@ -327,7 +337,7 @@
|
||||
on:click={stopApplication}
|
||||
type="submit"
|
||||
disabled={!$isDeploymentEnabled}
|
||||
class="icons bg-transparent text-sm flex items-center space-x-2 text-error"
|
||||
class="icons bg-transparent text-error"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -351,7 +361,7 @@
|
||||
on:click={restartApplication}
|
||||
type="submit"
|
||||
disabled={!$isDeploymentEnabled}
|
||||
class="icons bg-transparent text-sm flex items-center space-x-2"
|
||||
class="icons bg-transparent"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -375,7 +385,7 @@
|
||||
id="forceredeploy"
|
||||
type="submit"
|
||||
disabled={!$isDeploymentEnabled}
|
||||
class="icons bg-transparent text-sm flex items-center space-x-2"
|
||||
class="icons bg-transparent"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -402,7 +412,7 @@
|
||||
id="deploy"
|
||||
type="submit"
|
||||
disabled={!$isDeploymentEnabled}
|
||||
class="icons bg-transparent text-sm flex items-center space-x-2 text-success"
|
||||
class="icons bg-transparent text-success"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -422,7 +432,7 @@
|
||||
</form>
|
||||
{/if}
|
||||
|
||||
<div class="border border-coolgray-500 h-8" />
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
<a
|
||||
href={$isDeploymentEnabled ? `/applications/${id}` : null}
|
||||
sveltekit:prefetch
|
||||
@ -548,7 +558,7 @@
|
||||
>
|
||||
<Tooltip triggeredBy="#previews">Previews</Tooltip>
|
||||
{/if}
|
||||
<div class="border border-coolgray-500 h-8" />
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
<a
|
||||
href={$isDeploymentEnabled && $status.application.isRunning
|
||||
? `/applications/${id}/logs`
|
||||
@ -614,7 +624,7 @@
|
||||
</button></a
|
||||
>
|
||||
<Tooltip triggeredBy="#buildlogs">Build Logs</Tooltip>
|
||||
<div class="border border-coolgray-500 h-8" />
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
|
||||
{#if forceDelete}
|
||||
<button
|
||||
@ -628,7 +638,7 @@
|
||||
>
|
||||
Force Delete
|
||||
</button>
|
||||
<Tooltip triggeredBy="#forcedelete">Force Delete</Tooltip>
|
||||
<Tooltip triggeredBy="#forcedelete" placement="left">Force Delete</Tooltip>
|
||||
{:else}
|
||||
<button
|
||||
id="delete"
|
||||
@ -640,7 +650,7 @@
|
||||
>
|
||||
<DeleteIcon />
|
||||
</button>
|
||||
<Tooltip triggeredBy="#delete">Delete</Tooltip>
|
||||
<Tooltip triggeredBy="#delete" placement="left">Delete</Tooltip>
|
||||
{/if}
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@ -156,12 +156,12 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-5xl">
|
||||
<div class="mx-auto max-w-6xl">
|
||||
<form
|
||||
class="flex flex-col lg:flex-row w-full lg:px-32 space-y-5 lg:space-y-0 lg:space-x-5 lg:items-center"
|
||||
class="flex flex-col lg:flex-row w-full lg:px-32 space-y-5 lg:space-y-0 lg:space-x-5 justify-start"
|
||||
on:submit|preventDefault={loadBranches}
|
||||
>
|
||||
<div class="space-y-4 w-full">
|
||||
<div class="space-y-2 w-full">
|
||||
<input
|
||||
class="w-full"
|
||||
placeholder="eg: https://github.com/coollabsio/nodejs-example/tree/main"
|
||||
@ -170,6 +170,7 @@
|
||||
{#if branchSelectOptions.length > 0}
|
||||
<div class="custom-select-wrapper">
|
||||
<Select
|
||||
class="w-full"
|
||||
placeholder={loading.branches
|
||||
? $t('application.configuration.loading_branches')
|
||||
: !publicRepositoryLink
|
||||
|
||||
@ -254,12 +254,6 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">
|
||||
{$t('application.configuration.configure_build_pack')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{#if scanning}
|
||||
<div class="flex justify-center space-x-1 p-6 font-bold">
|
||||
<div class="text-xl tracking-tight">
|
||||
@ -267,18 +261,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="max-w-5xl mx-auto ">
|
||||
<div class="title pb-2">Coolify</div>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
{#each buildPacks.filter((bp) => bp.isCoolifyBuildPack === true) as buildPack}
|
||||
<div class="p-2">
|
||||
<BuildPack {packageManager} {buildPack} {scanning} bind:foundConfig />
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="max-w-5xl mx-auto ">
|
||||
<div class="max-w-6xl mx-auto px-5">
|
||||
<div class="title pb-2">Other</div>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
{#each buildPacks.filter((bp) => bp.isHerokuBuildPack === true) as buildPack}
|
||||
@ -288,4 +271,14 @@
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
<div class="max-w-6xl mx-auto px-5">
|
||||
<div class="title pb-2">Coolify Custom</div>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
{#each buildPacks.filter((bp) => bp.isCoolifyBuildPack === true) as buildPack}
|
||||
<div class="p-2">
|
||||
<BuildPack {packageManager} {buildPack} {scanning} bind:foundConfig />
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@ -126,7 +126,7 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="mx-auto max-w-4xl p-6">
|
||||
<div class="mx-auto max-w-6xl p-6">
|
||||
<div class="grid grid-flow-row gap-2 px-10">
|
||||
<div class="font-bold text-xl tracking-tight">Connect a Hosted / Remote Database</div>
|
||||
<div class="mt-2 grid grid-cols-2 items-center px-4">
|
||||
|
||||
@ -63,19 +63,14 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">
|
||||
{$t('application.configuration.configure_destination')}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col justify-center">
|
||||
<div class="flex flex-col justify-center w-full">
|
||||
{#if !destinations || ownDestinations.length === 0}
|
||||
<div class="flex-col">
|
||||
<div class="pb-2 text-center font-bold">
|
||||
{$t('application.configuration.no_configurable_destination')}
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
<a href="/new/destination" sveltekit:prefetch class="add-icon bg-sky-600 hover:bg-sky-500">
|
||||
<a href="/destinations/new" sveltekit:prefetch class="add-icon bg-sky-600 hover:bg-sky-500">
|
||||
<svg
|
||||
class="w-6"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -93,7 +88,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex flex-col flex-wrap justify-center px-2 md:flex-row">
|
||||
<div class="flex flex-col flex-wrap justify-center px-2 md:flex-row mx-auto">
|
||||
{#each ownDestinations as destination}
|
||||
<div class="p-2">
|
||||
<form on:submit|preventDefault={() => handleSubmit(destination.id)}>
|
||||
@ -106,9 +101,9 @@
|
||||
{/each}
|
||||
</div>
|
||||
{#if otherDestinations.length > 0 && $appSession.teamId === '0'}
|
||||
<div class="px-6 pb-5 pt-10 text-xl font-bold">Other Destinations</div>
|
||||
<div class="px-6 pb-5 pt-10 title">Other Destinations</div>
|
||||
{/if}
|
||||
<div class="flex flex-col flex-wrap justify-center px-2 md:flex-row">
|
||||
<div class="flex flex-col flex-wrap justify-center px-2 md:flex-row mx-auto">
|
||||
{#each otherDestinations as destination}
|
||||
<div class="p-2">
|
||||
<form on:submit|preventDefault={() => handleSubmit(destination.id)}>
|
||||
|
||||
@ -68,12 +68,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">
|
||||
{$t('application.configuration.select_a_git_source')}
|
||||
</div>
|
||||
</div>
|
||||
<div class="max-w-5xl mx-auto px-5">
|
||||
<div class="max-w-6xl mx-auto px-5">
|
||||
<div class="title pb-8">Git App</div>
|
||||
<div class="flex flex-wrap justify-center">
|
||||
{#if !filteredSources || ownSources.length === 0}
|
||||
|
||||
@ -94,7 +94,7 @@
|
||||
}
|
||||
];
|
||||
function containerClass() {
|
||||
return 'text-white bg-transparent font-thin px-0 w-full';
|
||||
return 'text-white bg-transparent font-thin px-0 w-full border-dashed border-coolgray-300';
|
||||
}
|
||||
|
||||
async function getUsage() {
|
||||
@ -294,83 +294,30 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex items-center space-x-2 p-5 px-6 font-bold lg:hidden">
|
||||
<div class="flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
</div>
|
||||
<span class="text-xs">{application.name}</span>
|
||||
</div>
|
||||
{#if application.gitSource?.htmlUrl && application.repository && application.branch}
|
||||
<a
|
||||
id="git"
|
||||
href="{application.gitSource.htmlUrl}/{application.repository}/tree/{application.branch}"
|
||||
target="_blank"
|
||||
class="w-10"
|
||||
>
|
||||
{#if application.gitSource?.type === 'gitlab'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<path
|
||||
fill="#FC6D26"
|
||||
d="M126.615 72.31l-7.034-21.647L105.64 7.76c-.716-2.206-3.84-2.206-4.556 0l-13.94 42.903H40.856L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664 1.385 72.31a4.792 4.792 0 001.74 5.358L64 121.894l60.874-44.227a4.793 4.793 0 001.74-5.357"
|
||||
/><path fill="#E24329" d="M64 121.894l23.144-71.23H40.856L64 121.893z" /><path
|
||||
fill="#FC6D26"
|
||||
d="M64 121.894l-23.144-71.23H8.42L64 121.893z"
|
||||
/><path
|
||||
fill="#FCA326"
|
||||
d="M8.42 50.663L1.384 72.31a4.79 4.79 0 001.74 5.357L64 121.894 8.42 50.664z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M8.42 50.663h32.436L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664z"
|
||||
/><path fill="#FC6D26" d="M64 121.894l23.144-71.23h32.437L64 121.893z" /><path
|
||||
fill="#FCA326"
|
||||
d="M119.58 50.663l7.035 21.647a4.79 4.79 0 01-1.74 5.357L64 121.894l55.58-71.23z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M119.58 50.663H87.145l13.94-42.902c.717-2.206 3.84-2.206 4.557 0l13.94 42.903z"
|
||||
/>
|
||||
</svg>
|
||||
{:else if application.gitSource?.type === 'github'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<g fill="#ffffff"
|
||||
><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M64 5.103c-33.347 0-60.388 27.035-60.388 60.388 0 26.682 17.303 49.317 41.297 57.303 3.017.56 4.125-1.31 4.125-2.905 0-1.44-.056-6.197-.082-11.243-16.8 3.653-20.345-7.125-20.345-7.125-2.747-6.98-6.705-8.836-6.705-8.836-5.48-3.748.413-3.67.413-3.67 6.063.425 9.257 6.223 9.257 6.223 5.386 9.23 14.127 6.562 17.573 5.02.542-3.903 2.107-6.568 3.834-8.076-13.413-1.525-27.514-6.704-27.514-29.843 0-6.593 2.36-11.98 6.223-16.21-.628-1.52-2.695-7.662.584-15.98 0 0 5.07-1.623 16.61 6.19C53.7 35 58.867 34.327 64 34.304c5.13.023 10.3.694 15.127 2.033 11.526-7.813 16.59-6.19 16.59-6.19 3.287 8.317 1.22 14.46.593 15.98 3.872 4.23 6.215 9.617 6.215 16.21 0 23.194-14.127 28.3-27.574 29.796 2.167 1.874 4.097 5.55 4.097 11.183 0 8.08-.07 14.583-.07 16.572 0 1.607 1.088 3.49 4.148 2.897 23.98-7.994 41.263-30.622 41.263-57.294C124.388 32.14 97.35 5.104 64 5.104z"
|
||||
/><path
|
||||
d="M26.484 91.806c-.133.3-.605.39-1.035.185-.44-.196-.685-.605-.543-.906.13-.31.603-.395 1.04-.188.44.197.69.61.537.91zm2.446 2.729c-.287.267-.85.143-1.232-.28-.396-.42-.47-.983-.177-1.254.298-.266.844-.14 1.24.28.394.426.472.984.17 1.255zM31.312 98.012c-.37.258-.976.017-1.35-.52-.37-.538-.37-1.183.01-1.44.373-.258.97-.025 1.35.507.368.545.368 1.19-.01 1.452zm3.261 3.361c-.33.365-1.036.267-1.552-.23-.527-.487-.674-1.18-.343-1.544.336-.366 1.045-.264 1.564.23.527.486.686 1.18.333 1.543zm4.5 1.951c-.147.473-.825.688-1.51.486-.683-.207-1.13-.76-.99-1.238.14-.477.823-.7 1.512-.485.683.206 1.13.756.988 1.237zm4.943.361c.017.498-.563.91-1.28.92-.723.017-1.308-.387-1.315-.877 0-.503.568-.91 1.29-.924.717-.013 1.306.387 1.306.88zm4.598-.782c.086.485-.413.984-1.126 1.117-.7.13-1.35-.172-1.44-.653-.086-.498.422-.997 1.122-1.126.714-.123 1.354.17 1.444.663zm0 0"
|
||||
/></g
|
||||
>
|
||||
</svg>
|
||||
{/if}
|
||||
</a>
|
||||
<Tooltip triggeredBy="#git">Open on Git</Tooltip>
|
||||
{/if}
|
||||
</div>
|
||||
{#if $status.application.isRunning}
|
||||
<div class="mx-auto max-w-6xl px-6 lg:my-0 my-4 lg:pt-0 pt-4 rounded">
|
||||
<div class="text-center">
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used Memory / Memory Limit</div>
|
||||
<div class="stat-value text-xl">{usage?.MemUsage}</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto max-w-4xl px-6 pt-4">
|
||||
<div class="text-2xl font-bold">Application Usage</div>
|
||||
<div class="text-center">
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used Memory / Memory Limit</div>
|
||||
<div class="stat-value text-xl">{usage?.MemUsage}</div>
|
||||
</div>
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used CPU</div>
|
||||
<div class="stat-value text-xl">{usage?.CPUPerc}</div>
|
||||
</div>
|
||||
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used CPU</div>
|
||||
<div class="stat-value text-xl">{usage?.CPUPerc}</div>
|
||||
</div>
|
||||
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Network IO</div>
|
||||
<div class="stat-value text-xl">{usage?.NetIO}</div>
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Network IO</div>
|
||||
<div class="stat-value text-xl">{usage?.NetIO}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto max-w-4xl px-6">
|
||||
{/if}
|
||||
<div class="mx-auto max-w-6xl px-6 pb-12">
|
||||
<!-- svelte-ignore missing-declaration -->
|
||||
<form on:submit|preventDefault={handleSubmit} class="py-4">
|
||||
<div class="flex space-x-1 pb-5 justify-between items-center">
|
||||
<div class="flex space-x-1 pb-5 items-center">
|
||||
<h1 class="title">{$t('general')}</h1>
|
||||
{#if $appSession.isAdmin}
|
||||
<button
|
||||
@ -385,18 +332,17 @@
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 pr-5">
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 px-2 pr-5">
|
||||
<div class="mt-2 grid grid-cols-2 items-center">
|
||||
<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
|
||||
<input name="name" id="name" bind:value={application.name} required />
|
||||
<label for="name">{$t('forms.name')}</label>
|
||||
<input name="name" id="name" class="w-full" bind:value={application.name} required />
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="gitSource" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.git_source')}</label
|
||||
>
|
||||
<label for="gitSource">{$t('application.git_source')}</label>
|
||||
{#if isDisabled || application.settings.isPublicRepository}
|
||||
<input
|
||||
disabled={isDisabled || application.settings.isPublicRepository}
|
||||
class="w-full"
|
||||
value={application.gitSource.name}
|
||||
/>
|
||||
{:else}
|
||||
@ -406,17 +352,16 @@
|
||||
><input
|
||||
value={application.gitSource.name}
|
||||
id="gitSource"
|
||||
class="cursor-pointer hover:bg-coolgray-500"
|
||||
class="cursor-pointer hover:bg-coolgray-500 w-full"
|
||||
/></a
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="repository" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.git_repository')}</label
|
||||
>
|
||||
<label for="repository">{$t('application.git_repository')}</label>
|
||||
{#if isDisabled || application.settings.isPublicRepository}
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled || application.settings.isPublicRepository}
|
||||
value="{application.repository}/{application.branch}"
|
||||
/>
|
||||
@ -427,34 +372,30 @@
|
||||
><input
|
||||
value="{application.repository}/{application.branch}"
|
||||
id="repository"
|
||||
class="cursor-pointer hover:bg-coolgray-500"
|
||||
class="cursor-pointer hover:bg-coolgray-500 w-full"
|
||||
/></a
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="buildPack" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.build_pack')}</label
|
||||
>
|
||||
<label for="buildPack">{$t('application.build_pack')}</label>
|
||||
{#if isDisabled}
|
||||
<input class="capitalize" disabled={isDisabled} value={application.buildPack} />
|
||||
<input class="uppercase w-full" disabled={isDisabled} value={application.buildPack} />
|
||||
{:else}
|
||||
<a
|
||||
href={`/applications/${id}/configuration/buildpack?from=/applications/${id}`}
|
||||
class="no-underline "
|
||||
class="no-underline"
|
||||
>
|
||||
<input
|
||||
value={application.buildPack}
|
||||
id="buildPack"
|
||||
class="cursor-pointer hover:bg-coolgray-500 capitalize"
|
||||
class="cursor-pointer hover:bg-coolgray-500 capitalize w-full"
|
||||
/></a
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="destination" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.destination')}</label
|
||||
>
|
||||
<label for="destination">{$t('application.destination')}</label>
|
||||
<div class="no-underline">
|
||||
<input
|
||||
value={application.destinationDocker.name}
|
||||
@ -466,7 +407,7 @@
|
||||
</div>
|
||||
{#if application.buildCommand || application.buildPack === 'rust' || application.buildPack === 'laravel'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="baseBuildImage" class="text-base font-bold text-stone-100"
|
||||
<label for="baseBuildImage"
|
||||
>{$t('application.base_build_image')}
|
||||
<Explainer
|
||||
explanation={application.buildPack === 'laravel'
|
||||
@ -476,7 +417,7 @@
|
||||
</label>
|
||||
<Select
|
||||
{isDisabled}
|
||||
containerClasses={(isDisabled && containerClass()) || 'bg-neutral border-0 w-full'}
|
||||
containerClasses={isDisabled && containerClass()}
|
||||
id="baseBuildImages"
|
||||
showIndicator={!$status.application.isRunning}
|
||||
items={application.baseBuildImages}
|
||||
@ -488,25 +429,27 @@
|
||||
{/if}
|
||||
{#if application.buildPack !== 'docker'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="baseImage" class="text-base font-bold text-stone-100"
|
||||
<label for="baseImage"
|
||||
>{$t('application.base_image')}
|
||||
<Explainer explanation={'Image that will be used for the deployment.'} /></label
|
||||
>
|
||||
<Select
|
||||
{isDisabled}
|
||||
containerClasses={(isDisabled && containerClass()) || 'bg-neutral border-0'}
|
||||
id="baseImages"
|
||||
showIndicator={!$status.application.isRunning}
|
||||
items={application.baseImages}
|
||||
on:select={selectBaseImage}
|
||||
value={application.baseImage}
|
||||
isClearable={false}
|
||||
/>
|
||||
<div class="custom-select-wrapper">
|
||||
<Select
|
||||
{isDisabled}
|
||||
containerClasses={isDisabled && containerClass()}
|
||||
id="baseImages"
|
||||
showIndicator={!$status.application.isRunning}
|
||||
items={application.baseImages}
|
||||
on:select={selectBaseImage}
|
||||
value={application.baseImage}
|
||||
isClearable={false}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
{#if application.buildPack !== 'docker' && (application.buildPack === 'nextjs' || application.buildPack === 'nuxtjs')}
|
||||
<div class="grid grid-cols-2 items-center pb-8">
|
||||
<label for="deploymentType" class="text-base font-bold text-stone-100"
|
||||
<label for="deploymentType"
|
||||
>Deployment Type
|
||||
<Explainer
|
||||
explanation={"Defines how to deploy your application. <br><br><span class='text-green-500 font-bold'>Static</span> is for static websites, <span class='text-green-500 font-bold'>node</span> is for server-side applications."}
|
||||
@ -546,7 +489,7 @@
|
||||
>
|
||||
{#if application.connectedDatabase}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="baseImage" class="text-base font-bold text-stone-100"
|
||||
<label for="baseImage"
|
||||
>Base Database
|
||||
<Explainer
|
||||
explanation={'The name of the database that will be used as base when branching.'}
|
||||
@ -568,9 +511,9 @@
|
||||
{/if}
|
||||
</div>
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">{$t('application.application')}</div>
|
||||
<h1 class="title">{$t('application.application')}</h1>
|
||||
</div>
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 pr-5">
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 px-2 pr-5">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<Setting
|
||||
id="isBot"
|
||||
@ -590,13 +533,13 @@
|
||||
isCenter={false}
|
||||
bind:setting={dualCerts}
|
||||
title={$t('application.ssl_www_and_non_www')}
|
||||
description="It will generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-settings'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both."
|
||||
description="Generate certificates for both www and non-www. <br>You need to have <span class='font-bold text-settings'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both."
|
||||
on:click={() => !$status.application.isRunning && changeSettings('dualCerts')}
|
||||
/>
|
||||
</div>
|
||||
{#if !isBot}
|
||||
<div class="grid grid-cols-2 items-center pb-8">
|
||||
<label for="fqdn" class="text-base font-bold text-stone-100"
|
||||
<label for="fqdn"
|
||||
>{$t('application.url_fqdn')}
|
||||
<Explainer
|
||||
explanation={"If you specify <span class='text-settings font-bold'>https</span>, the application will be accessible only over https.<br>SSL certificate will be generated automatically.<br><br>If you specify <span class='text-settings font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-settings font-bold'>You must set your DNS to point to the server IP in advance.</span>"}
|
||||
@ -604,6 +547,8 @@
|
||||
</label>
|
||||
<div>
|
||||
<input
|
||||
class="w-full"
|
||||
required={!application.settings.isBot}
|
||||
readonly={isDisabled}
|
||||
disabled={isDisabled}
|
||||
name="fqdn"
|
||||
@ -651,14 +596,14 @@
|
||||
{/if}
|
||||
{#if application.buildPack === 'python'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="pythonModule" class="text-base font-bold text-stone-100">WSGI / ASGI</label>
|
||||
<label for="pythonModule">WSGI / ASGI</label>
|
||||
<div class="custom-select-wrapper">
|
||||
<Select id="wsgi" items={wsgis} on:select={selectWSGI} value={application.pythonWSGI} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="pythonModule" class="text-base font-bold text-stone-100">Module</label>
|
||||
<label for="pythonModule">Module</label>
|
||||
<input
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
@ -671,7 +616,7 @@
|
||||
</div>
|
||||
{#if application.pythonWSGI?.toLowerCase() === 'gunicorn'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="pythonVariable" class="text-base font-bold text-stone-100">Variable</label>
|
||||
<label for="pythonVariable">Variable</label>
|
||||
<input
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
@ -685,7 +630,7 @@
|
||||
{/if}
|
||||
{#if application.pythonWSGI?.toLowerCase() === 'uvicorn'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="pythonVariable" class="text-base font-bold text-stone-100">Variable</label>
|
||||
<label for="pythonVariable">Variable</label>
|
||||
<input
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
@ -700,11 +645,12 @@
|
||||
{/if}
|
||||
{#if !staticDeployments.includes(application.buildPack)}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="port" class="text-base font-bold text-stone-100"
|
||||
<label for="port"
|
||||
>{$t('forms.port')}
|
||||
<Explainer explanation={'The port your application listens on.'} /></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="port"
|
||||
@ -714,13 +660,14 @@
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center pb-8">
|
||||
<label for="exposePort" class="text-base font-bold text-stone-100"
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="exposePort"
|
||||
>Exposed Port <Explainer
|
||||
explanation={'You can expose your application to a port on the host system.<br><br>Useful if you would like to use your own reverse proxy or tunnel and also in development mode. Otherwise leave empty.'}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
readonly={!$appSession.isAdmin && !$status.application.isRunning}
|
||||
disabled={isDisabled}
|
||||
name="exposePort"
|
||||
@ -731,10 +678,9 @@
|
||||
</div>
|
||||
{#if !notNodeDeployments.includes(application.buildPack)}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="installCommand" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.install_command')}</label
|
||||
>
|
||||
<label for="installCommand">{$t('application.install_command')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="installCommand"
|
||||
@ -744,10 +690,9 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="buildCommand" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.build_command')}</label
|
||||
>
|
||||
<label for="buildCommand">{$t('application.build_command')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="buildCommand"
|
||||
@ -757,10 +702,9 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center pb-8">
|
||||
<label for="startCommand" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.start_command')}</label
|
||||
>
|
||||
<label for="startCommand">{$t('application.start_command')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="startCommand"
|
||||
@ -772,12 +716,13 @@
|
||||
{/if}
|
||||
{#if application.buildPack === 'docker'}
|
||||
<div class="grid grid-cols-2 items-center pt-4">
|
||||
<label for="dockerFileLocation" class="text-base font-bold text-stone-100"
|
||||
<label for="dockerFileLocation"
|
||||
>Dockerfile Location <Explainer
|
||||
explanation={"Should be absolute path, like <span class='text-settings font-bold'>/data/Dockerfile</span> or <span class='text-settings font-bold'>/Dockerfile.</span>"}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="dockerFileLocation"
|
||||
@ -789,8 +734,9 @@
|
||||
{/if}
|
||||
{#if application.buildPack === 'deno'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="denoMainFile" class="text-base font-bold text-stone-100">Main File</label>
|
||||
<label for="denoMainFile">Main File</label>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="denoMainFile"
|
||||
@ -800,12 +746,13 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="denoOptions" class="text-base font-bold text-stone-100"
|
||||
<label for="denoOptions"
|
||||
>Arguments <Explainer
|
||||
explanation={"List of arguments to pass to <span class='text-settings font-bold'>deno run</span> command. Could include permissions, configurations files, etc."}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="denoOptions"
|
||||
@ -818,7 +765,7 @@
|
||||
{#if application.buildPack !== 'laravel' && application.buildPack !== 'heroku'}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<div class="flex-col">
|
||||
<label for="baseDirectory" class="pt-2 text-base font-bold text-stone-100"
|
||||
<label for="baseDirectory"
|
||||
>{$t('forms.base_directory')}
|
||||
<Explainer
|
||||
explanation={"Directory to use as the base for all commands.<br>Could be useful with <span class='text-settings font-bold'>monorepos</span>."}
|
||||
@ -826,6 +773,7 @@
|
||||
>
|
||||
</div>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="baseDirectory"
|
||||
@ -838,7 +786,7 @@
|
||||
{#if !notNodeDeployments.includes(application.buildPack)}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<div class="flex-col">
|
||||
<label for="publishDirectory" class="pt-2 text-base font-bold text-stone-100"
|
||||
<label for="publishDirectory"
|
||||
>{$t('forms.publish_directory')}
|
||||
<Explainer
|
||||
explanation={"Directory containing all the assets for deployment. <br> For example: <span class='text-settings font-bold'>dist</span>,<span class='text-settings font-bold'>_site</span> or <span class='text-settings font-bold'>public</span>."}
|
||||
@ -847,6 +795,7 @@
|
||||
</div>
|
||||
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={isDisabled}
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="publishDirectory"
|
||||
@ -862,7 +811,7 @@
|
||||
<div class="flex space-x-1 pb-5 font-bold">
|
||||
<div class="title">{$t('application.features')}</div>
|
||||
</div>
|
||||
<div class="lg:px-10 lg:pb-10 pb-6">
|
||||
<div class="lg:px-10 px-2 lg:pb-10 pb-6">
|
||||
{#if !application.settings.isPublicRepository}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<Setting
|
||||
|
||||
@ -107,57 +107,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex items-center space-x-2 p-5 px-6 font-bold">
|
||||
<div class="-mb-5 flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
{$t('application.build_logs')}
|
||||
</div>
|
||||
<span class="text-xs">{application.name} </span>
|
||||
</div>
|
||||
{#if application.gitSource?.htmlUrl && application.repository && application.branch}
|
||||
<a
|
||||
href="{application.gitSource.htmlUrl}/{application.repository}/tree/{application.branch}"
|
||||
target="_blank"
|
||||
class="w-10"
|
||||
>
|
||||
{#if application.gitSource?.type === 'gitlab'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<path
|
||||
fill="#FC6D26"
|
||||
d="M126.615 72.31l-7.034-21.647L105.64 7.76c-.716-2.206-3.84-2.206-4.556 0l-13.94 42.903H40.856L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664 1.385 72.31a4.792 4.792 0 001.74 5.358L64 121.894l60.874-44.227a4.793 4.793 0 001.74-5.357"
|
||||
/><path fill="#E24329" d="M64 121.894l23.144-71.23H40.856L64 121.893z" /><path
|
||||
fill="#FC6D26"
|
||||
d="M64 121.894l-23.144-71.23H8.42L64 121.893z"
|
||||
/><path
|
||||
fill="#FCA326"
|
||||
d="M8.42 50.663L1.384 72.31a4.79 4.79 0 001.74 5.357L64 121.894 8.42 50.664z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M8.42 50.663h32.436L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664z"
|
||||
/><path fill="#FC6D26" d="M64 121.894l23.144-71.23h32.437L64 121.893z" /><path
|
||||
fill="#FCA326"
|
||||
d="M119.58 50.663l7.035 21.647a4.79 4.79 0 01-1.74 5.357L64 121.894l55.58-71.23z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M119.58 50.663H87.145l13.94-42.902c.717-2.206 3.84-2.206 4.557 0l13.94 42.903z"
|
||||
/>
|
||||
</svg>
|
||||
{:else if application.gitSource?.type === 'github'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<g fill="#ffffff"
|
||||
><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M64 5.103c-33.347 0-60.388 27.035-60.388 60.388 0 26.682 17.303 49.317 41.297 57.303 3.017.56 4.125-1.31 4.125-2.905 0-1.44-.056-6.197-.082-11.243-16.8 3.653-20.345-7.125-20.345-7.125-2.747-6.98-6.705-8.836-6.705-8.836-5.48-3.748.413-3.67.413-3.67 6.063.425 9.257 6.223 9.257 6.223 5.386 9.23 14.127 6.562 17.573 5.02.542-3.903 2.107-6.568 3.834-8.076-13.413-1.525-27.514-6.704-27.514-29.843 0-6.593 2.36-11.98 6.223-16.21-.628-1.52-2.695-7.662.584-15.98 0 0 5.07-1.623 16.61 6.19C53.7 35 58.867 34.327 64 34.304c5.13.023 10.3.694 15.127 2.033 11.526-7.813 16.59-6.19 16.59-6.19 3.287 8.317 1.22 14.46.593 15.98 3.872 4.23 6.215 9.617 6.215 16.21 0 23.194-14.127 28.3-27.574 29.796 2.167 1.874 4.097 5.55 4.097 11.183 0 8.08-.07 14.583-.07 16.572 0 1.607 1.088 3.49 4.148 2.897 23.98-7.994 41.263-30.622 41.263-57.294C124.388 32.14 97.35 5.104 64 5.104z"
|
||||
/><path
|
||||
d="M26.484 91.806c-.133.3-.605.39-1.035.185-.44-.196-.685-.605-.543-.906.13-.31.603-.395 1.04-.188.44.197.69.61.537.91zm2.446 2.729c-.287.267-.85.143-1.232-.28-.396-.42-.47-.983-.177-1.254.298-.266.844-.14 1.24.28.394.426.472.984.17 1.255zM31.312 98.012c-.37.258-.976.017-1.35-.52-.37-.538-.37-1.183.01-1.44.373-.258.97-.025 1.35.507.368.545.368 1.19-.01 1.452zm3.261 3.361c-.33.365-1.036.267-1.552-.23-.527-.487-.674-1.18-.343-1.544.336-.366 1.045-.264 1.564.23.527.486.686 1.18.333 1.543zm4.5 1.951c-.147.473-.825.688-1.51.486-.683-.207-1.13-.76-.99-1.238.14-.477.823-.7 1.512-.485.683.206 1.13.756.988 1.237zm4.943.361c.017.498-.563.91-1.28.92-.723.017-1.308-.387-1.315-.877 0-.503.568-.91 1.29-.924.717-.013 1.306.387 1.306.88zm4.598-.782c.086.485-.413.984-1.126 1.117-.7.13-1.35-.172-1.44-.653-.086-.498.422-.997 1.122-1.126.714-.123 1.354.17 1.444.663zm0 0"
|
||||
/></g
|
||||
>
|
||||
</svg>
|
||||
{/if}
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="block flex-row justify-start space-x-2 px-5 pt-6 sm:px-10 md:flex">
|
||||
<div class="mb-4 min-w-[16rem] space-y-2 md:mb-0 ">
|
||||
<button class="btn btn-sm text-xs w-full bg-error" on:click={resetQueue}
|
||||
|
||||
@ -91,57 +91,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex h-20 items-center space-x-2 p-5 px-6 font-bold">
|
||||
<div class="-mb-5 flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Application Logs
|
||||
</div>
|
||||
<span class="text-xs">{application.name}</span>
|
||||
</div>
|
||||
{#if application.gitSource?.htmlUrl && application.repository && application.branch}
|
||||
<a
|
||||
href="{application.gitSource.htmlUrl}/{application.repository}/tree/{application.branch}"
|
||||
target="_blank"
|
||||
class="w-10"
|
||||
>
|
||||
{#if application.gitSource?.type === 'gitlab'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<path
|
||||
fill="#FC6D26"
|
||||
d="M126.615 72.31l-7.034-21.647L105.64 7.76c-.716-2.206-3.84-2.206-4.556 0l-13.94 42.903H40.856L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664 1.385 72.31a4.792 4.792 0 001.74 5.358L64 121.894l60.874-44.227a4.793 4.793 0 001.74-5.357"
|
||||
/><path fill="#E24329" d="M64 121.894l23.144-71.23H40.856L64 121.893z" /><path
|
||||
fill="#FC6D26"
|
||||
d="M64 121.894l-23.144-71.23H8.42L64 121.893z"
|
||||
/><path
|
||||
fill="#FCA326"
|
||||
d="M8.42 50.663L1.384 72.31a4.79 4.79 0 001.74 5.357L64 121.894 8.42 50.664z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M8.42 50.663h32.436L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664z"
|
||||
/><path fill="#FC6D26" d="M64 121.894l23.144-71.23h32.437L64 121.893z" /><path
|
||||
fill="#FCA326"
|
||||
d="M119.58 50.663l7.035 21.647a4.79 4.79 0 01-1.74 5.357L64 121.894l55.58-71.23z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M119.58 50.663H87.145l13.94-42.902c.717-2.206 3.84-2.206 4.557 0l13.94 42.903z"
|
||||
/>
|
||||
</svg>
|
||||
{:else if application.gitSource?.type === 'github'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<g fill="#ffffff"
|
||||
><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M64 5.103c-33.347 0-60.388 27.035-60.388 60.388 0 26.682 17.303 49.317 41.297 57.303 3.017.56 4.125-1.31 4.125-2.905 0-1.44-.056-6.197-.082-11.243-16.8 3.653-20.345-7.125-20.345-7.125-2.747-6.98-6.705-8.836-6.705-8.836-5.48-3.748.413-3.67.413-3.67 6.063.425 9.257 6.223 9.257 6.223 5.386 9.23 14.127 6.562 17.573 5.02.542-3.903 2.107-6.568 3.834-8.076-13.413-1.525-27.514-6.704-27.514-29.843 0-6.593 2.36-11.98 6.223-16.21-.628-1.52-2.695-7.662.584-15.98 0 0 5.07-1.623 16.61 6.19C53.7 35 58.867 34.327 64 34.304c5.13.023 10.3.694 15.127 2.033 11.526-7.813 16.59-6.19 16.59-6.19 3.287 8.317 1.22 14.46.593 15.98 3.872 4.23 6.215 9.617 6.215 16.21 0 23.194-14.127 28.3-27.574 29.796 2.167 1.874 4.097 5.55 4.097 11.183 0 8.08-.07 14.583-.07 16.572 0 1.607 1.088 3.49 4.148 2.897 23.98-7.994 41.263-30.622 41.263-57.294C124.388 32.14 97.35 5.104 64 5.104z"
|
||||
/><path
|
||||
d="M26.484 91.806c-.133.3-.605.39-1.035.185-.44-.196-.685-.605-.543-.906.13-.31.603-.395 1.04-.188.44.197.69.61.537.91zm2.446 2.729c-.287.267-.85.143-1.232-.28-.396-.42-.47-.983-.177-1.254.298-.266.844-.14 1.24.28.394.426.472.984.17 1.255zM31.312 98.012c-.37.258-.976.017-1.35-.52-.37-.538-.37-1.183.01-1.44.373-.258.97-.025 1.35.507.368.545.368 1.19-.01 1.452zm3.261 3.361c-.33.365-1.036.267-1.552-.23-.527-.487-.674-1.18-.343-1.544.336-.366 1.045-.264 1.564.23.527.486.686 1.18.333 1.543zm4.5 1.951c-.147.473-.825.688-1.51.486-.683-.207-1.13-.76-.99-1.238.14-.477.823-.7 1.512-.485.683.206 1.13.756.988 1.237zm4.943.361c.017.498-.563.91-1.28.92-.723.017-1.308-.387-1.315-.877 0-.503.568-.91 1.29-.924.717-.013 1.306.387 1.306.88zm4.598-.782c.086.485-.413.984-1.126 1.117-.7.13-1.35-.172-1.44-.653-.086-.498.422-.997 1.122-1.126.714-.123 1.354.17 1.444.663zm0 0"
|
||||
/></g
|
||||
>
|
||||
</svg>
|
||||
{/if}
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="flex flex-row justify-center space-x-2 px-10 pt-6">
|
||||
{#if logs.length === 0}
|
||||
<div class="text-xl font-bold tracking-tighter">{$t('application.build.waiting_logs')}</div>
|
||||
|
||||
@ -29,6 +29,7 @@
|
||||
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
|
||||
import Tooltip from '$lib/components/Tooltip.svelte';
|
||||
import DeleteIcon from '$lib/components/DeleteIcon.svelte';
|
||||
import Explainer from '$lib/components/Explainer.svelte';
|
||||
|
||||
const { id } = $page.params;
|
||||
let loadBuildingStatusInterval: any = null;
|
||||
@ -119,7 +120,7 @@
|
||||
return 'error';
|
||||
} finally {
|
||||
numberOfGetStatus--;
|
||||
status = status
|
||||
status = status;
|
||||
}
|
||||
}
|
||||
async function restartPreview(preview: any) {
|
||||
@ -176,56 +177,12 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex items-center space-x-2 p-5 px-6 font-bold">
|
||||
<div class="flex flex-col justify-center py-4 text-center">
|
||||
<h1 class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block font-bold mb-4">
|
||||
Preview Deployments
|
||||
</h1>
|
||||
<span class="text-xs">{application?.name}</span>
|
||||
</div>
|
||||
{#if application.gitSource?.htmlUrl && application.repository && application.branch}
|
||||
<a
|
||||
href="{application.gitSource.htmlUrl}/{application.repository}/tree/{application.branch}"
|
||||
target="_blank"
|
||||
class="w-10"
|
||||
>
|
||||
{#if application.gitSource?.type === 'gitlab'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<path
|
||||
fill="#FC6D26"
|
||||
d="M126.615 72.31l-7.034-21.647L105.64 7.76c-.716-2.206-3.84-2.206-4.556 0l-13.94 42.903H40.856L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664 1.385 72.31a4.792 4.792 0 001.74 5.358L64 121.894l60.874-44.227a4.793 4.793 0 001.74-5.357"
|
||||
/><path fill="#E24329" d="M64 121.894l23.144-71.23H40.856L64 121.893z" /><path
|
||||
fill="#FC6D26"
|
||||
d="M64 121.894l-23.144-71.23H8.42L64 121.893z"
|
||||
/><path
|
||||
fill="#FCA326"
|
||||
d="M8.42 50.663L1.384 72.31a4.79 4.79 0 001.74 5.357L64 121.894 8.42 50.664z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M8.42 50.663h32.436L26.916 7.76c-.717-2.206-3.84-2.206-4.557 0L8.42 50.664z"
|
||||
/><path fill="#FC6D26" d="M64 121.894l23.144-71.23h32.437L64 121.893z" /><path
|
||||
fill="#FCA326"
|
||||
d="M119.58 50.663l7.035 21.647a4.79 4.79 0 01-1.74 5.357L64 121.894l55.58-71.23z"
|
||||
/><path
|
||||
fill="#E24329"
|
||||
d="M119.58 50.663H87.145l13.94-42.902c.717-2.206 3.84-2.206 4.557 0l13.94 42.903z"
|
||||
/>
|
||||
</svg>
|
||||
{:else if application.gitSource?.type === 'github'}
|
||||
<svg viewBox="0 0 128 128" class="icons">
|
||||
<g fill="#ffffff"
|
||||
><path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M64 5.103c-33.347 0-60.388 27.035-60.388 60.388 0 26.682 17.303 49.317 41.297 57.303 3.017.56 4.125-1.31 4.125-2.905 0-1.44-.056-6.197-.082-11.243-16.8 3.653-20.345-7.125-20.345-7.125-2.747-6.98-6.705-8.836-6.705-8.836-5.48-3.748.413-3.67.413-3.67 6.063.425 9.257 6.223 9.257 6.223 5.386 9.23 14.127 6.562 17.573 5.02.542-3.903 2.107-6.568 3.834-8.076-13.413-1.525-27.514-6.704-27.514-29.843 0-6.593 2.36-11.98 6.223-16.21-.628-1.52-2.695-7.662.584-15.98 0 0 5.07-1.623 16.61 6.19C53.7 35 58.867 34.327 64 34.304c5.13.023 10.3.694 15.127 2.033 11.526-7.813 16.59-6.19 16.59-6.19 3.287 8.317 1.22 14.46.593 15.98 3.872 4.23 6.215 9.617 6.215 16.21 0 23.194-14.127 28.3-27.574 29.796 2.167 1.874 4.097 5.55 4.097 11.183 0 8.08-.07 14.583-.07 16.572 0 1.607 1.088 3.49 4.148 2.897 23.98-7.994 41.263-30.622 41.263-57.294C124.388 32.14 97.35 5.104 64 5.104z"
|
||||
/><path
|
||||
d="M26.484 91.806c-.133.3-.605.39-1.035.185-.44-.196-.685-.605-.543-.906.13-.31.603-.395 1.04-.188.44.197.69.61.537.91zm2.446 2.729c-.287.267-.85.143-1.232-.28-.396-.42-.47-.983-.177-1.254.298-.266.844-.14 1.24.28.394.426.472.984.17 1.255zM31.312 98.012c-.37.258-.976.017-1.35-.52-.37-.538-.37-1.183.01-1.44.373-.258.97-.025 1.35.507.368.545.368 1.19-.01 1.452zm3.261 3.361c-.33.365-1.036.267-1.552-.23-.527-.487-.674-1.18-.343-1.544.336-.366 1.045-.264 1.564.23.527.486.686 1.18.333 1.543zm4.5 1.951c-.147.473-.825.688-1.51.486-.683-.207-1.13-.76-.99-1.238.14-.477.823-.7 1.512-.485.683.206 1.13.756.988 1.237zm4.943.361c.017.498-.563.91-1.28.92-.723.017-1.308-.387-1.315-.877 0-.503.568-.91 1.29-.924.717-.013 1.306.387 1.306.88zm4.598-.782c.086.485-.413.984-1.126 1.117-.7.13-1.35-.172-1.44-.653-.086-.498.422-.997 1.122-1.126.714-.123 1.354.17 1.444.663zm0 0"
|
||||
/></g
|
||||
>
|
||||
</svg>
|
||||
{/if}
|
||||
</a>
|
||||
{/if}
|
||||
<div class="flex justify-center">
|
||||
<SimpleExplainer
|
||||
text={applicationSecrets && applicationSecrets.length === 0
|
||||
? "To have Preview Secerts, please add them to the main application. <br><br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."
|
||||
: "These values overwrite application secrets in PR/MR deployments. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."}
|
||||
/>
|
||||
</div>
|
||||
{#if loading.init}
|
||||
<div class="mx-auto max-w-6xl px-6 pt-4">
|
||||
@ -233,21 +190,8 @@
|
||||
</div>
|
||||
{:else}
|
||||
<div class="mx-auto max-w-6xl px-6 pt-4">
|
||||
<div class="flex justify-center py-4 text-center">
|
||||
<SimpleExplainer
|
||||
customClass="w-full"
|
||||
text={applicationSecrets.length === 0
|
||||
? "You can add secrets to PR/MR deployments. Please add secrets to the application first. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."
|
||||
: "These values overwrite application secrets in PR/MR deployments. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."}
|
||||
/>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<SimpleExplainer
|
||||
customClass="w-full"
|
||||
text={'If your preview is not shown, try load them directly from Docker Engine.<br>(Changed previews process flow in <span class="font-bold text-white">v3.10.4</span>)'}
|
||||
/>
|
||||
<button class="btn btn-sm bg-coollabs" on:click={loadPreviewsFromDocker}
|
||||
>Fetch Previews</button
|
||||
<button class="btn btn-sm bg-coollabs" on:click={loadPreviewsFromDocker}>Load Previews</button
|
||||
>
|
||||
</div>
|
||||
{#if applicationSecrets.length !== 0}
|
||||
@ -427,10 +371,6 @@
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex-col">
|
||||
<div class="text-center font-bold text-xl pb-10">Previews will shown here.</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@ -68,9 +68,6 @@
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-6xl px-6 pt-4">
|
||||
<h1 class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block font-bold mb-4">
|
||||
Secrets
|
||||
</h1>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="mx-auto border-separate text-left">
|
||||
<thead>
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
const response = await get(`/applications/${params.id}/storages`);
|
||||
return {
|
||||
props: {
|
||||
application: stuff.application,
|
||||
...response
|
||||
}
|
||||
};
|
||||
@ -19,13 +18,12 @@
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
export let application: any;
|
||||
export let persistentStorages: any;
|
||||
import { page } from '$app/stores';
|
||||
import Storage from './_Storage.svelte';
|
||||
import { get } from '$lib/api';
|
||||
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
|
||||
import { t } from '$lib/translations';
|
||||
import Explainer from '$lib/components/Explainer.svelte';
|
||||
|
||||
const { id } = $page.params;
|
||||
async function refreshStorage() {
|
||||
@ -35,17 +33,11 @@
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-6xl rounded-xl px-6 pt-4">
|
||||
|
||||
<div class="flex flex-col justify-center py-4 text-center">
|
||||
<h1 class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block font-bold mb-4">
|
||||
Persistent Storage
|
||||
</h1>
|
||||
<SimpleExplainer customClass="w-full" text={$t('application.storage.persistent_storage_explainer')} />
|
||||
</div>
|
||||
|
||||
<table class="mx-auto border-separate text-left">
|
||||
<thead>
|
||||
<tr class="h-12">
|
||||
<th scope="col">{$t('forms.path')}</th>
|
||||
<th scope="col">{$t('forms.path')} <Explainer explanation={$t('application.storage.persistent_storage_explainer')} /></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
@ -7,11 +7,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<h1 class="title">CouchDB</h1>
|
||||
</div>
|
||||
<div class="space-y-2 lg:px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="defaultDatabase" class="text-base font-bold text-stone-100"
|
||||
>{$t('database.default_database')}</label
|
||||
>
|
||||
<label for="defaultDatabase">{$t('database.default_database')}</label>
|
||||
<CopyPasswordField
|
||||
required
|
||||
readonly={database.defaultDatabase}
|
||||
@ -23,7 +21,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
|
||||
<label for="dbUser">{$t('forms.user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -34,9 +32,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
|
||||
>{$t('forms.password')}</label
|
||||
>
|
||||
<label for="dbUserPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -48,7 +44,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
|
||||
<label for="rootUser">{$t('forms.root_user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -59,9 +55,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
|
||||
>{$t('forms.roots_password')}</label
|
||||
>
|
||||
<label for="rootUserPassword">{$t('forms.roots_password')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
|
||||
@ -107,22 +107,22 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-4xl p-4">
|
||||
<div class="mx-auto max-w-6xl p-4">
|
||||
<form on:submit|preventDefault={handleSubmit} class="py-4">
|
||||
<div class="flex flex-col lg:flex-row justify-between lg:space-x-1 space-y-3 pb-5 lg:items-center items-start">
|
||||
<div class="flex space-x-1 pb-5 items-center">
|
||||
<h1 class="title">{$t('general')}</h1>
|
||||
{#if $appSession.isAdmin}
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-sm w-full lg:w-auto"
|
||||
class="btn btn-sm"
|
||||
class:loading
|
||||
class:bg-databases={!loading}
|
||||
disabled={loading}>{$t('forms.save')}</button
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max lg:px-10">
|
||||
<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max lg:px-10 px-2">
|
||||
<label for="name">{$t('forms.name')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
readonly={!$appSession.isAdmin}
|
||||
@ -131,9 +131,7 @@
|
||||
bind:value={database.name}
|
||||
required
|
||||
/>
|
||||
<label for="destination" class="text-base font-bold text-stone-100"
|
||||
>{$t('application.destination')}</label
|
||||
>
|
||||
<label for="destination">{$t('application.destination')}</label>
|
||||
{#if database.destinationDockerId}
|
||||
<div class="no-underline">
|
||||
<input
|
||||
@ -145,7 +143,7 @@
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<label for="version" class="text-base font-bold text-stone-100">Version / Tag</label>
|
||||
<label for="version">Version / Tag</label>
|
||||
<a
|
||||
href={$appSession.isAdmin && !$status.database.isRunning
|
||||
? `/databases/${id}/configuration/version?from=/databases/${id}`
|
||||
@ -160,7 +158,7 @@
|
||||
class:cursor-pointer={!$status.database.isRunning}
|
||||
/></a
|
||||
>
|
||||
<label for="host" class="text-base font-bold text-stone-100">{$t('forms.host')}</label>
|
||||
<label for="host">{$t('forms.host')}</label>
|
||||
<CopyPasswordField
|
||||
placeholder={$t('forms.generated_automatically_after_start')}
|
||||
isPasswordField={false}
|
||||
@ -170,14 +168,18 @@
|
||||
name="host"
|
||||
value={database.id}
|
||||
/>
|
||||
<label for="publicPort" class="text-base font-bold text-stone-100">{$t('forms.port')}</label>
|
||||
<label for="publicPort">{$t('forms.port')}</label>
|
||||
<CopyPasswordField
|
||||
placeholder={$t('database.generated_automatically_after_set_to_public')}
|
||||
id="publicPort"
|
||||
readonly
|
||||
disabled
|
||||
name="publicPort"
|
||||
value={publicLoading ? 'Loading...' : $status.database.isPublic ? database.publicPort : privatePort}
|
||||
value={publicLoading
|
||||
? 'Loading...'
|
||||
: $status.database.isPublic
|
||||
? database.publicPort
|
||||
: privatePort}
|
||||
/>
|
||||
</div>
|
||||
{#if database.type === 'mysql'}
|
||||
@ -195,9 +197,9 @@
|
||||
{:else if database.type === 'edgedb'}
|
||||
<EdgeDB {database} />
|
||||
{/if}
|
||||
<div class="flex flex-col space-y-3 mt-5">
|
||||
<div class="flex flex-col space-y-2 mt-5">
|
||||
<div>
|
||||
<label for="url" class="text-base font-bold text-stone-100"
|
||||
<label class="px-2" for="url"
|
||||
>{$t('database.connection_string')}
|
||||
{#if !$status.database.isPublic && database.destinationDocker.remoteEngine}
|
||||
<Explainer
|
||||
@ -206,7 +208,7 @@
|
||||
{/if}</label
|
||||
>
|
||||
</div>
|
||||
<div class="lg:px-10">
|
||||
<div class="lg:px-10 px-2">
|
||||
<CopyPasswordField
|
||||
textarea={true}
|
||||
placeholder={$t('forms.generated_automatically_after_start')}
|
||||
@ -223,7 +225,7 @@
|
||||
<div class="flex space-x-1 pb-5 font-bold">
|
||||
<h1 class="title">{$t('application.features')}</h1>
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max lg:px-10">
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max lg:px-10 px-2">
|
||||
<Setting
|
||||
id="isPublic"
|
||||
loading={publicLoading}
|
||||
|
||||
@ -9,11 +9,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">EdgeDB</div>
|
||||
</div>
|
||||
<div class="space-y-2 px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="defaultDatabase" class="text-base font-bold text-stone-100"
|
||||
>{$t('database.default_database')}</label
|
||||
>
|
||||
<label for="defaultDatabase">{$t('database.default_database')}</label>
|
||||
<CopyPasswordField
|
||||
required
|
||||
readonly={database.defaultDatabase}
|
||||
@ -25,7 +23,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
|
||||
<label for="rootUser">{$t('forms.root_user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -36,7 +34,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100"
|
||||
<label for="rootUser"
|
||||
>Root Password <Explainer
|
||||
explanation="Could be changed while the database is running."
|
||||
/></label
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<h1 class="title">MariaDB</h1>
|
||||
</div>
|
||||
<div class="space-y-2 lg:px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="defaultDatabase" class="text-base font-bold text-stone-100"
|
||||
<label for="defaultDatabase"
|
||||
>{$t('database.default_database')}</label
|
||||
>
|
||||
<CopyPasswordField
|
||||
@ -25,7 +25,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
|
||||
<label for="dbUser" >{$t('forms.user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -36,7 +36,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="dbUserPassword"
|
||||
>{$t('forms.password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
@ -51,7 +51,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
|
||||
<label for="rootUser" >{$t('forms.root_user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -62,7 +62,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="rootUserPassword"
|
||||
>{$t('forms.roots_password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<h1 class="title">MongoDB</h1>
|
||||
</div>
|
||||
<div class="space-y-2 lg:px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
|
||||
<label for="rootUser">{$t('forms.root_user')}</label>
|
||||
<CopyPasswordField
|
||||
placeholder={$t('forms.generated_automatically_after_start')}
|
||||
id="rootUser"
|
||||
@ -22,7 +22,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="rootUserPassword"
|
||||
>{$t('forms.roots_password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
|
||||
@ -9,11 +9,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<h1 class="title">MySQL</h1>
|
||||
</div>
|
||||
<div class="space-y-2 lg:px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="defaultDatabase" class="text-base font-bold text-stone-100"
|
||||
>{$t('database.default_database')}</label
|
||||
>
|
||||
<label for="defaultDatabase">{$t('database.default_database')}</label>
|
||||
<CopyPasswordField
|
||||
required
|
||||
readonly={database.defaultDatabase}
|
||||
@ -25,7 +23,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
|
||||
<label for="dbUser">{$t('forms.user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -36,7 +34,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="dbUserPassword"
|
||||
>{$t('forms.password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
@ -51,7 +49,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100">{$t('forms.root_user')}</label>
|
||||
<label for="rootUser">{$t('forms.root_user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -62,7 +60,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="rootUserPassword"
|
||||
>{$t('forms.roots_password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
|
||||
@ -9,11 +9,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<h1 class="title">PostgreSQL</h1>
|
||||
</div>
|
||||
<div class="space-y-2 lg:px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="defaultDatabase" class="text-base font-bold text-stone-100"
|
||||
>{$t('database.default_database')}</label
|
||||
>
|
||||
<label for="defaultDatabase">{$t('database.default_database')}</label>
|
||||
<CopyPasswordField
|
||||
required
|
||||
readonly={database.defaultDatabase}
|
||||
@ -25,7 +23,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="rootUser" class="text-base font-bold text-stone-100"
|
||||
<label for="rootUser"
|
||||
>Postgres User Password <Explainer
|
||||
explanation="Could be changed while the database is running."
|
||||
/></label
|
||||
@ -41,7 +39,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
|
||||
<label for="dbUser">{$t('forms.user')}</label>
|
||||
<CopyPasswordField
|
||||
readonly
|
||||
disabled
|
||||
@ -52,7 +50,7 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="dbUserPassword"
|
||||
>{$t('forms.password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<h1 class="title">Redis</h1>
|
||||
</div>
|
||||
<div class="space-y-2 lg:px-10">
|
||||
<div class="space-y-2 lg:px-10 px-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
|
||||
<label for="dbUserPassword"
|
||||
>{$t('forms.password')}
|
||||
<Explainer explanation="Could be changed while the database is running." /></label
|
||||
>
|
||||
|
||||
@ -150,25 +150,33 @@
|
||||
</script>
|
||||
|
||||
{#if id !== 'new'}
|
||||
<nav class="header justify-center lg:justify-between">
|
||||
<div class="hidden items-center space-x-2 p-5 px-6 font-bold lg:flex">
|
||||
<div class="flex flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
<nav class="header lg:flex-row flex-col-reverse">
|
||||
<div class="flex flex-row space-x-2 font-bold pt-10 lg:pt-0">
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<div class="title">
|
||||
{#if $page.url.pathname === `/databases/${id}`}
|
||||
Configurations
|
||||
{:else if $page.url.pathname === `/databases/${id}/logs`}
|
||||
Database Logs
|
||||
{:else if $page.url.pathname === `/databases/${id}/configuration/type`}
|
||||
Select a Database Type
|
||||
{:else if $page.url.pathname === `/databases/${id}/configuration/version`}
|
||||
Select a Database Version
|
||||
{:else if $page.url.pathname === `/databases/${id}/configuration/destination`}
|
||||
Select a Destination
|
||||
{/if}
|
||||
</div>
|
||||
<span class="text-xs">{database.name}</span>
|
||||
</div>
|
||||
<DatabaseLinks {database} />
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-row flex-wrap space-x-4 space-y-3 justify-center lg:justify-start py-2 lg:py-0"
|
||||
>
|
||||
<div class="lg:block hidden flex-1" />
|
||||
<div class="flex flex-row flex-wrap space-x-3 justify-center lg:justify-start lg:py-0">
|
||||
{#if database.type && database.destinationDockerId && database.version}
|
||||
{#if $status.database.isExited}
|
||||
<a
|
||||
id="exited"
|
||||
href={!$status.database.isRunning ? `/databases/${id}/logs` : null}
|
||||
class="icons bg-transparent text-sm flex items-center text-red-500 tooltip-error"
|
||||
class="icons bg-transparent text-red-500 tooltip-error"
|
||||
sveltekit:prefetch
|
||||
>
|
||||
<svg
|
||||
@ -192,9 +200,7 @@
|
||||
<Tooltip triggeredBy="#exited">{'Service exited with an error!'}</Tooltip>
|
||||
{/if}
|
||||
{#if $status.database.initialLoading}
|
||||
<button
|
||||
class="icons flex animate-spin items-center space-x-2 bg-transparent text-sm duration-500 ease-in-out"
|
||||
>
|
||||
<button class="icons flex animate-spin duration-500 ease-in-out">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="h-6 w-6"
|
||||
@ -220,7 +226,7 @@
|
||||
on:click={stopDatabase}
|
||||
type="submit"
|
||||
disabled={!$appSession.isAdmin}
|
||||
class="icons bg-transparent text-sm flex items-center space-x-2 text-red-500 mt-3"
|
||||
class="icons bg-transparent text-red-500"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@ -346,7 +352,7 @@
|
||||
>
|
||||
{/if}
|
||||
|
||||
<Tooltip triggeredBy="#delete">{'Delete'}</Tooltip>
|
||||
<Tooltip triggeredBy="#delete" placement="left">Delete</Tooltip>
|
||||
</div>
|
||||
</nav>
|
||||
{/if}
|
||||
|
||||
@ -53,11 +53,6 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">
|
||||
{$t('application.configuration.configure_destination')}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
{#if !destinations || destinations.length === 0}
|
||||
<div class="flex-col">
|
||||
|
||||
@ -47,10 +47,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">{$t('database.select_database_type')}</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap justify-center">
|
||||
{#each types as type}
|
||||
<div class="p-2">
|
||||
|
||||
@ -46,9 +46,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">{$t('database.select_database_version')}</div>
|
||||
</div>
|
||||
{#if from}
|
||||
<div class="pb-10 text-center">
|
||||
Warning: you are about to change the version of this database.<br />This could cause problem
|
||||
|
||||
@ -48,33 +48,24 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex items-center space-x-2 p-5 font-bold lg:hidden">
|
||||
<div class="flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
</div>
|
||||
<span class="text-xs">{database.name}</span>
|
||||
</div>
|
||||
<DatabaseLinks {database} />
|
||||
</div>
|
||||
{#if $status.database.isRunning}
|
||||
<div class="mx-auto max-w-6xl p-5">
|
||||
<div class="text-center">
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used Memory / Memory Limit</div>
|
||||
<div class="stat-value text-xl">{usage?.MemUsage}</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto max-w-4xl p-5">
|
||||
<div class="text-2xl font-bold">Database Usage</div>
|
||||
<div class="text-center">
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used Memory / Memory Limit</div>
|
||||
<div class="stat-value text-xl">{usage?.MemUsage}</div>
|
||||
</div>
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used CPU</div>
|
||||
<div class="stat-value text-xl">{usage?.CPUPerc}</div>
|
||||
</div>
|
||||
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used CPU</div>
|
||||
<div class="stat-value text-xl">{usage?.CPUPerc}</div>
|
||||
</div>
|
||||
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Network IO</div>
|
||||
<div class="stat-value text-xl">{usage?.NetIO}</div>
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Network IO</div>
|
||||
<div class="stat-value text-xl">{usage?.NetIO}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
<Databases bind:database {privatePort} />
|
||||
|
||||
@ -91,14 +91,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex h-20 items-center space-x-2 p-5 px-6 font-bold">
|
||||
<div class="-mb-5 flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Database Logs
|
||||
</div>
|
||||
<span class="text-xs">{database.name}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-row justify-center space-x-2 px-10 pt-6">
|
||||
{#if logs.length === 0}
|
||||
<div class="text-xl font-bold tracking-tighter">{$t('application.build.waiting_logs')}</div>
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto max-w-4xl px-6">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
{#if destination.remoteEngine}
|
||||
<RemoteDocker bind:destination {settings} {state} />
|
||||
{:else}
|
||||
|
||||
@ -127,7 +127,7 @@
|
||||
<br />
|
||||
|
||||
{#if invitations.length > 0}
|
||||
<div class="mx-auto max-w-4xl px-6 py-4">
|
||||
<div class="mx-auto max-w-6xl px-6 py-4">
|
||||
<div class="title font-bold">Pending invitations</div>
|
||||
<div class="pt-10 text-center">
|
||||
{#each invitations as invitation}
|
||||
@ -149,7 +149,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="mx-auto max-w-4xl px-6 py-4">
|
||||
<div class="mx-auto max-w-6xl px-6 py-4">
|
||||
{#if $appSession.teamId === '0' && accounts.length > 0}
|
||||
<div class="title font-bold">Accounts</div>
|
||||
{:else}
|
||||
@ -189,7 +189,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto max-w-4xl px-6">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
<div class="title font-bold">Teams</div>
|
||||
<div class="flex-col items-center justify-center pt-10">
|
||||
<div class="flex flex-row flex-wrap justify-center px-2 pb-10 md:flex-row">
|
||||
|
||||
@ -87,7 +87,7 @@
|
||||
<span class="arrow-right-applications px-1 text-fuchsia-500">></span>
|
||||
<span class="pr-2">{team.name}</span>
|
||||
</div>
|
||||
<div class="mx-auto max-w-4xl px-6">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
<form on:submit|preventDefault={handleSubmit} class=" py-4">
|
||||
<div class="flex space-x-1 pb-5">
|
||||
<div class="title font-bold">{$t('index.settings')}</div>
|
||||
|
||||
@ -28,8 +28,7 @@
|
||||
export let destinations: any;
|
||||
|
||||
let filtered: any = setInitials();
|
||||
import { get, post } from '$lib/api';
|
||||
import Usage from '$lib/components/Usage.svelte';
|
||||
import { get } from '$lib/api';
|
||||
import { t } from '$lib/translations';
|
||||
import { asyncSleep, getRndInteger } from '$lib/common';
|
||||
import { appSession, search, addToast} from '$lib/store';
|
||||
@ -274,16 +273,13 @@
|
||||
|
||||
</script>
|
||||
|
||||
<nav class="header p-7">
|
||||
<nav class="header">
|
||||
<h1 class="mr-4 text-2xl font-bold">{$t('index.dashboard')}</h1>
|
||||
{#if $appSession.isAdmin && (applications.length !== 0 || destinations.length !== 0 || databases.length !== 0 || services.length !== 0 || gitSources.length !== 0 || destinations.length !== 0)}
|
||||
<NewResource />
|
||||
{/if}
|
||||
</nav>
|
||||
<div class="container lg:mx-auto lg:p-0 px-8 pt-5">
|
||||
<!-- {#if $appSession.teamId === '0'}
|
||||
<Usage />
|
||||
{/if} -->
|
||||
{#if applications.length !== 0 || destinations.length !== 0 || databases.length !== 0 || services.length !== 0 || gitSources.length !== 0 || destinations.length !== 0}
|
||||
<div class="form-control">
|
||||
<div class="input-group flex w-full">
|
||||
|
||||
@ -10,117 +10,84 @@
|
||||
<div class="title">Appwrite</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="opensslKeyV1">Encryption Key</label>
|
||||
<CopyPasswordField
|
||||
name="opensslKeyV1"
|
||||
id="opensslKeyV1"
|
||||
isPasswordField
|
||||
value={service.appwrite.opensslKeyV1}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="opensslKeyV1">Encryption Key</label>
|
||||
<CopyPasswordField
|
||||
name="opensslKeyV1"
|
||||
id="opensslKeyV1"
|
||||
isPasswordField
|
||||
value={service.appwrite.opensslKeyV1}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="executorSecret">Executor Secret</label>
|
||||
<CopyPasswordField
|
||||
name="executorSecret"
|
||||
id="executorSecret"
|
||||
isPasswordField
|
||||
value={service.appwrite.executorSecret}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="executorSecret">Executor Secret</label>
|
||||
<CopyPasswordField
|
||||
name="executorSecret"
|
||||
id="executorSecret"
|
||||
isPasswordField
|
||||
value={service.appwrite.executorSecret}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- <div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">Redis</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="redisPassword">Password</label>
|
||||
<CopyPasswordField
|
||||
name="redisPassword"
|
||||
id="redisPassword"
|
||||
isPasswordField
|
||||
value={service.appwrite.redisPassword}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div> -->
|
||||
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">MariaDB</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbHost">MariaDB Host</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbHost"
|
||||
id="mariadbHost"
|
||||
value={service.appwrite.mariadbHost}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbPort">MariaDB Port</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbPort"
|
||||
id="mariadbPort"
|
||||
value={service.appwrite.mariadbPort}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div> -->
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbUser"
|
||||
id="mariadbUser"
|
||||
value={service.appwrite.mariadbUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="mariadbPassword"
|
||||
value={service.appwrite.mariadbPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbRootUser">Root User</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbRootUser"
|
||||
id="mariadbRootUser"
|
||||
value={service.appwrite.mariadbRootUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbRootUserPassword">Root Password</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbRootUserPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="mariadbRootUserPassword"
|
||||
value={service.appwrite.mariadbRootUserPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbDatabase"
|
||||
id="mariadbDatabase"
|
||||
value={service.appwrite.mariadbDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbUser"
|
||||
id="mariadbUser"
|
||||
value={service.appwrite.mariadbUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2 ">
|
||||
<label for="mariadbPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="mariadbPassword"
|
||||
value={service.appwrite.mariadbPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbRootUser">Root User</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbRootUser"
|
||||
id="mariadbRootUser"
|
||||
value={service.appwrite.mariadbRootUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2 ">
|
||||
<label for="mariadbRootUserPassword">Root Password</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbRootUserPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="mariadbRootUserPassword"
|
||||
value={service.appwrite.mariadbRootUserPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbDatabase"
|
||||
id="mariadbDatabase"
|
||||
value={service.appwrite.mariadbDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -21,169 +21,174 @@
|
||||
<div class="title">Fider</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="jwtSecret">JWT Secret</label>
|
||||
<CopyPasswordField
|
||||
name="jwtSecret"
|
||||
id="jwtSecret"
|
||||
isPasswordField
|
||||
value={service.fider.jwtSecret}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="jwtSecret">JWT Secret</label>
|
||||
<CopyPasswordField
|
||||
name="jwtSecret"
|
||||
id="jwtSecret"
|
||||
isPasswordField
|
||||
value={service.fider.jwtSecret}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailNoreply">Noreply Email</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailNoreply"
|
||||
id="emailNoreply"
|
||||
type="email"
|
||||
required
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailNoreply}
|
||||
placeholder="{$t('forms.eg')}: noreply@yourdomain.com"
|
||||
/>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailNoreply">Noreply Email</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailNoreply"
|
||||
id="emailNoreply"
|
||||
type="email"
|
||||
required
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailNoreply}
|
||||
placeholder="{$t('forms.eg')}: noreply@yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">Email</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailMailgunApiKey">Mailgun API Key</label>
|
||||
<CopyPasswordField
|
||||
name="emailMailgunApiKey"
|
||||
id="emailMailgunApiKey"
|
||||
isPasswordField
|
||||
bind:value={service.fider.emailMailgunApiKey}
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
placeholder="{$t('forms.eg')}: key-yourkeygoeshere"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailMailgunDomain">Mailgun Domain</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailMailgunDomain"
|
||||
id="emailMailgunDomain"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailMailgunDomain}
|
||||
placeholder="{$t('forms.eg')}: yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailMailgunRegion">Mailgun Region</label>
|
||||
<div class="custom-select-wrapper">
|
||||
<Select
|
||||
id="baseBuildImages"
|
||||
items={mailgunRegions}
|
||||
showIndicator
|
||||
on:select={(event) => (service.fider.emailMailgunRegion = event.detail.value)}
|
||||
value={service.fider.emailMailgunRegion || 'EU'}
|
||||
isClearable={false}
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailMailgunApiKey">Mailgun API Key</label>
|
||||
<CopyPasswordField
|
||||
name="emailMailgunApiKey"
|
||||
id="emailMailgunApiKey"
|
||||
isPasswordField
|
||||
bind:value={service.fider.emailMailgunApiKey}
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
placeholder="{$t('forms.eg')}: key-yourkeygoeshere"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex space-x-1 py-5 lg:px-10 font-bold">
|
||||
<div class="text-lg">Or</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpHost">SMTP Host</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpHost"
|
||||
id="emailSmtpHost"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpHost}
|
||||
placeholder="{$t('forms.eg')}: smtp.yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpPort">SMTP Port</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpPort"
|
||||
id="emailSmtpPort"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpPort}
|
||||
placeholder="{$t('forms.eg')}: 587"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpUser">SMTP User</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpUser"
|
||||
id="emailSmtpUser"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpUser}
|
||||
placeholder="{$t('forms.eg')}: user@yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpPassword">SMTP Password</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpPassword"
|
||||
id="emailSmtpPassword"
|
||||
isPasswordField
|
||||
bind:value={service.fider.emailSmtpPassword}
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
placeholder="{$t('forms.eg')}: s0m3p4ssw0rd"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpEnableStartTls">SMTP Start TLS</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpEnableStartTls"
|
||||
id="emailSmtpEnableStartTls"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpEnableStartTls}
|
||||
placeholder="{$t('forms.eg')}: true"
|
||||
/>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailMailgunDomain">Mailgun Domain</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailMailgunDomain"
|
||||
id="emailMailgunDomain"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailMailgunDomain}
|
||||
placeholder="{$t('forms.eg')}: yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailMailgunRegion">Mailgun Region</label>
|
||||
<div class="custom-select-wrapper">
|
||||
<Select
|
||||
id="baseBuildImages"
|
||||
items={mailgunRegions}
|
||||
showIndicator
|
||||
on:select={(event) => (service.fider.emailMailgunRegion = event.detail.value)}
|
||||
value={service.fider.emailMailgunRegion || 'EU'}
|
||||
isClearable={false}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex space-x-1 py-5 lg:px-10 px-2 font-bold">
|
||||
<div class="text-lg">Or</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpHost">SMTP Host</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpHost"
|
||||
id="emailSmtpHost"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpHost}
|
||||
placeholder="{$t('forms.eg')}: smtp.yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpPort">SMTP Port</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpPort"
|
||||
id="emailSmtpPort"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpPort}
|
||||
placeholder="{$t('forms.eg')}: 587"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpUser">SMTP User</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpUser"
|
||||
id="emailSmtpUser"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpUser}
|
||||
placeholder="{$t('forms.eg')}: user@yourdomain.com"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpPassword">SMTP Password</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpPassword"
|
||||
id="emailSmtpPassword"
|
||||
isPasswordField
|
||||
bind:value={service.fider.emailSmtpPassword}
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
placeholder="{$t('forms.eg')}: s0m3p4ssw0rd"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpEnableStartTls">SMTP Start TLS</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="emailSmtpEnableStartTls"
|
||||
id="emailSmtpEnableStartTls"
|
||||
readonly={readOnly}
|
||||
disabled={readOnly}
|
||||
bind:value={service.fider.emailSmtpEnableStartTls}
|
||||
placeholder="{$t('forms.eg')}: true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">PostgreSQL</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.fider.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
value={service.fider.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
value={service.fider.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.fider.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
value={service.fider.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
value={service.fider.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -8,12 +8,13 @@
|
||||
|
||||
<div class="flex space-x-1 py-5">
|
||||
<div class="title">
|
||||
Ghost <Explainer explanation="You can change these values in the Ghost admin panel." />
|
||||
Ghost <Explainer explanation="You can change these values in the <span class='text-settings'>Ghost admin panel<span>." />
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="email">{$t('forms.default_email_address')}</label>
|
||||
<input
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="email">{$t('forms.default_email_address')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="email"
|
||||
id="email"
|
||||
@ -24,8 +25,8 @@
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="defaultPassword">{$t('forms.default_password')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="defaultPassword">{$t('forms.default_password')}</label>
|
||||
<CopyPasswordField
|
||||
id="defaultPassword"
|
||||
isPasswordField
|
||||
@ -35,11 +36,13 @@
|
||||
value={service.ghost.defaultPassword}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">MariaDB</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbUser">{$t('forms.username')}</label>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="mariadbUser"
|
||||
id="mariadbUser"
|
||||
@ -48,8 +51,8 @@
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbPassword">{$t('forms.password')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbPassword"
|
||||
isPasswordField
|
||||
@ -59,9 +62,9 @@
|
||||
value={service.ghost.mariadbPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbDatabase">{$t('index.database')}</label>
|
||||
<input
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbDatabase">{$t('index.database')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="mariadbDatabase"
|
||||
id="mariadbDatabase"
|
||||
@ -72,8 +75,8 @@
|
||||
placeholder="{$t('forms.eg')}: ghost_db"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbRootUser">{$t('forms.root_db_user')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbRootUser">{$t('forms.root_db_user')}</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbRootUser"
|
||||
readonly
|
||||
@ -82,8 +85,8 @@
|
||||
value={service.ghost.mariadbRootUser}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mariadbRootUserPassword">{$t('forms.root_db_password')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mariadbRootUserPassword">{$t('forms.root_db_password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mariadbRootUserPassword"
|
||||
isPasswordField
|
||||
@ -93,3 +96,4 @@
|
||||
value={service.ghost.mariadbRootUserPassword}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -53,7 +53,7 @@
|
||||
<div class="title">GlitchTip</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<Setting
|
||||
id="enableOpenUserRegistration"
|
||||
bind:setting={service.glitchTip.enableOpenUserRegistration}
|
||||
@ -74,171 +74,173 @@
|
||||
<div class="flex space-x-1 py-2 font-bold">
|
||||
<div class="subtitle">Email settings</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<Setting
|
||||
id="emailSmtpUseTls"
|
||||
bind:setting={service.glitchTip.emailSmtpUseTls}
|
||||
{loading}
|
||||
disabled={$status.service.isRunning}
|
||||
on:click={() => changeSettings('emailSmtpUseTls')}
|
||||
title="Use TLS for SMTP"
|
||||
description={''}
|
||||
/>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<Setting
|
||||
id="emailSmtpUseTls"
|
||||
bind:setting={service.glitchTip.emailSmtpUseTls}
|
||||
{loading}
|
||||
disabled={$status.service.isRunning}
|
||||
on:click={() => changeSettings('emailSmtpUseTls')}
|
||||
title="Use TLS for SMTP"
|
||||
description={''}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<Setting
|
||||
id="emailSmtpUseSsl"
|
||||
bind:setting={service.glitchTip.emailSmtpUseSsl}
|
||||
{loading}
|
||||
disabled={$status.service.isRunning}
|
||||
on:click={() => changeSettings('emailSmtpUseSsl')}
|
||||
title="Use SSL for SMTP"
|
||||
description={''}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="defaultEmailFrom">Default Email From</label>
|
||||
<CopyPasswordField
|
||||
required
|
||||
name="defaultEmailFrom"
|
||||
id="defaultEmailFrom"
|
||||
bind:value={service.glitchTip.defaultEmailFrom}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<Setting
|
||||
id="emailSmtpUseSsl"
|
||||
bind:setting={service.glitchTip.emailSmtpUseSsl}
|
||||
{loading}
|
||||
disabled={$status.service.isRunning}
|
||||
on:click={() => changeSettings('emailSmtpUseSsl')}
|
||||
title="Use SSL for SMTP"
|
||||
description={''}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="defaultEmailFrom">Default Email From</label>
|
||||
<CopyPasswordField
|
||||
required
|
||||
name="defaultEmailFrom"
|
||||
id="defaultEmailFrom"
|
||||
bind:value={service.glitchTip.defaultEmailFrom}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpHost">SMTP Host</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpHost"
|
||||
id="emailSmtpHost"
|
||||
bind:value={service.glitchTip.emailSmtpHost}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpHost">SMTP Host</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpHost"
|
||||
id="emailSmtpHost"
|
||||
bind:value={service.glitchTip.emailSmtpHost}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpPort">SMTP Port</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpPort"
|
||||
id="emailSmtpPort"
|
||||
bind:value={service.glitchTip.emailSmtpPort}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpPort">SMTP Port</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpPort"
|
||||
id="emailSmtpPort"
|
||||
bind:value={service.glitchTip.emailSmtpPort}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpUser">SMTP User</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpUser"
|
||||
id="emailSmtpUser"
|
||||
bind:value={service.glitchTip.emailSmtpUser}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpUser">SMTP User</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpUser"
|
||||
id="emailSmtpUser"
|
||||
bind:value={service.glitchTip.emailSmtpUser}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailSmtpPassword">SMTP Password</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpPassword"
|
||||
id="emailSmtpPassword"
|
||||
bind:value={service.glitchTip.emailSmtpPassword}
|
||||
isPasswordField
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailSmtpPassword">SMTP Password</label>
|
||||
<CopyPasswordField
|
||||
name="emailSmtpPassword"
|
||||
id="emailSmtpPassword"
|
||||
bind:value={service.glitchTip.emailSmtpPassword}
|
||||
isPasswordField
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="emailBackend">Email Backend</label>
|
||||
<CopyPasswordField
|
||||
name="emailBackend"
|
||||
id="emailBackend"
|
||||
bind:value={service.glitchTip.emailBackend}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="emailBackend">Email Backend</label>
|
||||
<CopyPasswordField
|
||||
name="emailBackend"
|
||||
id="emailBackend"
|
||||
bind:value={service.glitchTip.emailBackend}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mailgunApiKey">Mailgun API Key</label>
|
||||
<CopyPasswordField
|
||||
name="mailgunApiKey"
|
||||
id="mailgunApiKey"
|
||||
bind:value={service.glitchTip.mailgunApiKey}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mailgunApiKey">Mailgun API Key</label>
|
||||
<CopyPasswordField
|
||||
name="mailgunApiKey"
|
||||
id="mailgunApiKey"
|
||||
bind:value={service.glitchTip.mailgunApiKey}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="sendgridApiKey">SendGrid API Key</label>
|
||||
<CopyPasswordField
|
||||
name="sendgridApiKey"
|
||||
id="sendgridApiKey"
|
||||
bind:value={service.glitchTip.sendgridApiKey}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="sendgridApiKey">SendGrid API Key</label>
|
||||
<CopyPasswordField
|
||||
name="sendgridApiKey"
|
||||
id="sendgridApiKey"
|
||||
bind:value={service.glitchTip.sendgridApiKey}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex space-x-1 py-2 font-bold">
|
||||
<div class="subtitle">Default User & Superuser</div>
|
||||
</div>
|
||||
<div class="flex space-x-1 py-2 font-bold">
|
||||
<div class="subtitle">Default User & Superuser</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="defaultEmail">{$t('forms.email')}</label>
|
||||
<CopyPasswordField
|
||||
name="defaultEmail"
|
||||
id="defaultEmail"
|
||||
bind:value={service.glitchTip.defaultEmail}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="defaultEmail">{$t('forms.email')}</label>
|
||||
<CopyPasswordField
|
||||
name="defaultEmail"
|
||||
id="defaultEmail"
|
||||
bind:value={service.glitchTip.defaultEmail}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="defaultUsername">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="defaultUsername"
|
||||
id="defaultUsername"
|
||||
bind:value={service.glitchTip.defaultUsername}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="defaultPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
name="defaultPassword"
|
||||
id="defaultPassword"
|
||||
bind:value={service.glitchTip.defaultPassword}
|
||||
readonly
|
||||
disabled
|
||||
isPasswordField
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="defaultUsername">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="defaultUsername"
|
||||
id="defaultUsername"
|
||||
bind:value={service.glitchTip.defaultUsername}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="defaultPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
name="defaultPassword"
|
||||
id="defaultPassword"
|
||||
bind:value={service.glitchTip.defaultPassword}
|
||||
readonly
|
||||
disabled
|
||||
isPasswordField
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">PostgreSQL</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
bind:value={service.glitchTip.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
bind:value={service.glitchTip.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
bind:value={service.glitchTip.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
bind:value={service.glitchTip.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
bind:value={service.glitchTip.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
bind:value={service.glitchTip.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -8,8 +8,8 @@
|
||||
<div class="title">Hasura</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="graphQLAdminPassword">GraphQL Admin Password</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="graphQLAdminPassword">GraphQL Admin Password</label>
|
||||
<CopyPasswordField
|
||||
name="graphQLAdminPassword"
|
||||
id="graphQLAdminPassword"
|
||||
@ -24,34 +24,36 @@
|
||||
<div class="title">PostgreSQL</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.hasura.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
value={service.hasura.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
value={service.hasura.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.hasura.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
value={service.hasura.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
value={service.hasura.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -7,8 +7,8 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">MeiliSearch</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="masterKey">{$t('forms.admin_api_key')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="masterKey">{$t('forms.admin_api_key')}</label>
|
||||
<CopyPasswordField
|
||||
id="masterKey"
|
||||
isPasswordField
|
||||
|
||||
@ -8,39 +8,42 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">MinIO</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="rootUser">{$t('forms.root_user')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="rootUser"
|
||||
id="rootUser"
|
||||
placeholder={$t('forms.username')}
|
||||
value={service.minio.rootUser}
|
||||
disabled
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="rootUserPassword">{$t('forms.roots_password')}</label>
|
||||
<CopyPasswordField
|
||||
id="rootUserPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="rootUserPassword"
|
||||
value={service.minio.rootUserPassword}
|
||||
/>
|
||||
</div>
|
||||
{#if !service.minio.apiFqdn}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="publicPort">{$t('forms.api_port')}</label>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="rootUser">{$t('forms.root_user')}</label>
|
||||
<input
|
||||
name="publicPort"
|
||||
id="publicPort"
|
||||
value={service.minio.publicPort}
|
||||
class="w-full"
|
||||
name="rootUser"
|
||||
id="rootUser"
|
||||
placeholder={$t('forms.username')}
|
||||
value={service.minio.rootUser}
|
||||
disabled
|
||||
readonly
|
||||
placeholder={$t('forms.generated_automatically_after_start')}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="rootUserPassword">{$t('forms.roots_password')}</label>
|
||||
<CopyPasswordField
|
||||
id="rootUserPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="rootUserPassword"
|
||||
value={service.minio.rootUserPassword}
|
||||
/>
|
||||
</div>
|
||||
{#if !service.minio.apiFqdn}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="publicPort">{$t('forms.api_port')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="publicPort"
|
||||
id="publicPort"
|
||||
value={service.minio.publicPort}
|
||||
disabled
|
||||
readonly
|
||||
placeholder={$t('forms.generated_automatically_after_start')}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
@ -10,96 +10,94 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">Plausible Analytics</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="scriptName"
|
||||
>Script Name <Explainer
|
||||
explanation="Useful if you would like to rename the collector script to prevent it blocked by AdBlockers."
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
name="scriptName"
|
||||
id="scriptName"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
placeholder="plausible.js"
|
||||
bind:value={service.plausibleAnalytics.scriptName}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="email">{$t('forms.email')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="email"
|
||||
id="email"
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
readonly={readOnly}
|
||||
placeholder={$t('forms.email')}
|
||||
bind:value={service.plausibleAnalytics.email}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="username">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="username"
|
||||
id="username"
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
readonly={readOnly}
|
||||
placeholder={$t('forms.username')}
|
||||
bind:value={service.plausibleAnalytics.username}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="password">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="password"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="password"
|
||||
value={service.plausibleAnalytics.password}
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="scriptName"
|
||||
>Script Name <Explainer
|
||||
explanation="Useful if you would like to rename the collector script to prevent it blocked by AdBlockers."
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
name="scriptName"
|
||||
id="scriptName"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={!$appSession.isAdmin || $status.service.isRunning || $status.service.initialLoading}
|
||||
placeholder="plausible.js"
|
||||
bind:value={service.plausibleAnalytics.scriptName}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="email">{$t('forms.email')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="email"
|
||||
id="email"
|
||||
disabled={!$appSession.isAdmin || $status.service.isRunning || $status.service.initialLoading}
|
||||
readonly={readOnly}
|
||||
placeholder={$t('forms.email')}
|
||||
bind:value={service.plausibleAnalytics.email}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="username">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="username"
|
||||
id="username"
|
||||
disabled={!$appSession.isAdmin || $status.service.isRunning || $status.service.initialLoading}
|
||||
readonly={readOnly}
|
||||
placeholder={$t('forms.username')}
|
||||
bind:value={service.plausibleAnalytics.username}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="password">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="password"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="password"
|
||||
value={service.plausibleAnalytics.password}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">PostgreSQL</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.plausibleAnalytics.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
value={service.plausibleAnalytics.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
value={service.plausibleAnalytics.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlUser">{$t('forms.username')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.plausibleAnalytics.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
readonly
|
||||
disabled
|
||||
name="postgresqlPassword"
|
||||
value={service.plausibleAnalytics.postgresqlPassword}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlDatabase">{$t('index.database')}</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlDatabase"
|
||||
id="postgresqlDatabase"
|
||||
value={service.plausibleAnalytics.postgresqlDatabase}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -8,8 +8,8 @@
|
||||
<div class="title">SearXNG</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="secretKey">Secret Key</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="secretKey">Secret Key</label>
|
||||
<CopyPasswordField
|
||||
name="secretKey"
|
||||
id="secretKey"
|
||||
@ -23,8 +23,8 @@
|
||||
<div class="title">Redis</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="redisPassword">{$t('forms.password')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="redisPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
name="redisPassword"
|
||||
id="redisPassword"
|
||||
|
||||
@ -178,44 +178,44 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-4xl px-6 pb-12">
|
||||
<div class="mx-auto max-w-6xl px-6 pb-12">
|
||||
<form on:submit|preventDefault={handleSubmit} class="py-4">
|
||||
<div class="flex flex-col lg:flex-row justify-between lg:space-x-1 space-y-3 pb-5 items-center">
|
||||
<div class="title">{$t('general')}</div>
|
||||
<div class="flex space-x-1 pb-5 items-center">
|
||||
<h1 class="title">{$t('general')}</h1>
|
||||
<div class="flex flex-row space-y-3 items-center">
|
||||
{#if $appSession.isAdmin}
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-sm"
|
||||
class:bg-orange-600={forceSave}
|
||||
class:hover:bg-orange-400={forceSave}
|
||||
class:loading={loading.save}
|
||||
class:bg-services={!loading.save}
|
||||
disabled={loading.save}
|
||||
>{loading.save
|
||||
? $t('forms.save')
|
||||
: forceSave
|
||||
? $t('forms.confirm_continue')
|
||||
: $t('forms.save')}</button
|
||||
>
|
||||
{/if}
|
||||
{#if service.type === 'plausibleanalytics' && $status.service.isRunning}
|
||||
<button
|
||||
class="btn btn-sm"
|
||||
on:click|preventDefault={setEmailsToVerified}
|
||||
disabled={loading.verification}
|
||||
class:loading={loading.verification}
|
||||
>{loading.verification
|
||||
? $t('forms.verifying')
|
||||
: $t('forms.verify_emails_without_smtp')}</button
|
||||
>
|
||||
<button
|
||||
class="btn btn-sm"
|
||||
on:click|preventDefault={cleanupLogs}
|
||||
disabled={loading.cleanup}
|
||||
class:loading={loading.cleanup}>Cleanup Unnecessary Database Logs</button
|
||||
>
|
||||
{/if}
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-sm"
|
||||
class:bg-orange-600={forceSave}
|
||||
class:hover:bg-orange-400={forceSave}
|
||||
class:loading={loading.save}
|
||||
class:bg-services={!loading.save}
|
||||
disabled={loading.save}
|
||||
>{loading.save
|
||||
? $t('forms.save')
|
||||
: forceSave
|
||||
? $t('forms.confirm_continue')
|
||||
: $t('forms.save')}</button
|
||||
>
|
||||
{/if}
|
||||
{#if service.type === 'plausibleanalytics' && $status.service.isRunning}
|
||||
<button
|
||||
class="btn btn-sm"
|
||||
on:click|preventDefault={setEmailsToVerified}
|
||||
disabled={loading.verification}
|
||||
class:loading={loading.verification}
|
||||
>{loading.verification
|
||||
? $t('forms.verifying')
|
||||
: $t('forms.verify_emails_without_smtp')}</button
|
||||
>
|
||||
<button
|
||||
class="btn btn-sm"
|
||||
on:click|preventDefault={cleanupLogs}
|
||||
disabled={loading.cleanup}
|
||||
class:loading={loading.cleanup}>Cleanup Unnecessary Database Logs</button
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -228,91 +228,94 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="grid gap-4 grid-cols-2 grid-rows-1 lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="name" >{$t('forms.name')}</label>
|
||||
<div>
|
||||
<input
|
||||
readonly={!$appSession.isAdmin}
|
||||
name="name"
|
||||
id="name"
|
||||
bind:value={service.name}
|
||||
required
|
||||
/>
|
||||
<div class="grid gap-4 grid-cols-1 grid-rows-1 lg:px-10 px-2">
|
||||
<div class="mt-2 grid grid-cols-2 items-center">
|
||||
<label for="name">{$t('forms.name')}</label>
|
||||
<input name="name" id="name" class="w-full" bind:value={service.name} required />
|
||||
</div>
|
||||
<label class="text-base font-bold text-stone-100" for="version">Version / Tag</label>
|
||||
<a
|
||||
href={$appSession.isAdmin && !$status.service.isRunning && !$status.service.initialLoading
|
||||
? `/services/${id}/configuration/version?from=/services/${id}`
|
||||
: ''}
|
||||
class="no-underline"
|
||||
>
|
||||
<input
|
||||
value={service.version}
|
||||
id="service"
|
||||
readonly
|
||||
disabled={$status.service.isRunning || $status.service.initialLoading}
|
||||
class:cursor-pointer={!$status.service.isRunning}
|
||||
/></a
|
||||
>
|
||||
<label class="text-base font-bold text-stone-100" for="destination"
|
||||
>{$t('application.destination')}</label
|
||||
>
|
||||
<div>
|
||||
{#if service.destinationDockerId}
|
||||
<div class="no-underline">
|
||||
<input
|
||||
value={service.destinationDocker.name}
|
||||
id="destination"
|
||||
disabled
|
||||
class="bg-transparent "
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="version">Version / Tag</label>
|
||||
<a
|
||||
href={$appSession.isAdmin && !$status.service.isRunning && !$status.service.initialLoading
|
||||
? `/services/${id}/configuration/version?from=/services/${id}`
|
||||
: ''}
|
||||
class="no-underline"
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
value={service.version}
|
||||
id="service"
|
||||
readonly
|
||||
disabled={$status.service.isRunning || $status.service.initialLoading}
|
||||
class:cursor-pointer={!$status.service.isRunning}
|
||||
/></a
|
||||
>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="destination">{$t('application.destination')}</label>
|
||||
<div>
|
||||
{#if service.destinationDockerId}
|
||||
<div class="no-underline">
|
||||
<input
|
||||
value={service.destinationDocker.name}
|
||||
id="destination"
|
||||
disabled
|
||||
class="bg-transparent w-full"
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{#if service.type === 'minio'}
|
||||
<label class="text-base font-bold text-stone-100" for="fqdn">Console URL</label>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="fqdn">Console URL</label>
|
||||
|
||||
<CopyPasswordField
|
||||
placeholder="eg: https://console.min.io"
|
||||
readonly={isDisabled}
|
||||
disabled={isDisabled}
|
||||
name="fqdn"
|
||||
id="fqdn"
|
||||
pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
|
||||
bind:value={service.fqdn}
|
||||
required
|
||||
/>
|
||||
<label class="text-base font-bold text-stone-100" for="apiFqdn"
|
||||
>API URL <Explainer explanation={$t('application.https_explainer')} /></label
|
||||
>
|
||||
<CopyPasswordField
|
||||
placeholder="eg: https://min.io"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={isDisabled}
|
||||
name="apiFqdn"
|
||||
id="apiFqdn"
|
||||
pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
|
||||
bind:value={service.minio.apiFqdn}
|
||||
required
|
||||
/>
|
||||
<CopyPasswordField
|
||||
placeholder="eg: https://console.min.io"
|
||||
readonly={isDisabled}
|
||||
disabled={isDisabled}
|
||||
name="fqdn"
|
||||
id="fqdn"
|
||||
pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
|
||||
bind:value={service.fqdn}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="apiFqdn"
|
||||
>API URL <Explainer explanation={$t('application.https_explainer')} /></label
|
||||
>
|
||||
<CopyPasswordField
|
||||
placeholder="eg: https://min.io"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={isDisabled}
|
||||
name="apiFqdn"
|
||||
id="apiFqdn"
|
||||
pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
|
||||
bind:value={service.minio.apiFqdn}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
{:else}
|
||||
<label class="text-base font-bold text-stone-100" for="fqdn"
|
||||
>{$t('application.url_fqdn')}
|
||||
<Explainer explanation={$t('application.https_explainer')} />
|
||||
</label>
|
||||
<CopyPasswordField
|
||||
placeholder="eg: https://analytics.coollabs.io"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
name="fqdn"
|
||||
id="fqdn"
|
||||
pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
|
||||
bind:value={service.fqdn}
|
||||
required
|
||||
/>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="fqdn"
|
||||
>{$t('application.url_fqdn')}
|
||||
<Explainer explanation={$t('application.https_explainer')} />
|
||||
</label>
|
||||
<CopyPasswordField
|
||||
placeholder="eg: https://analytics.coollabs.io"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
name="fqdn"
|
||||
id="fqdn"
|
||||
pattern="^https?://([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{'{'}2,{'}'}$"
|
||||
bind:value={service.fqdn}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{#if forceSave}
|
||||
@ -348,31 +351,36 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="grid gap-4 grid-cols-2 grid-rows-1 lg:px-10">
|
||||
<Setting
|
||||
id="dualCerts"
|
||||
disabled={$status.service.isRunning}
|
||||
dataTooltip={$t('forms.must_be_stopped_to_modify')}
|
||||
bind:setting={dualCerts}
|
||||
title={$t('application.ssl_www_and_non_www')}
|
||||
description={$t('services.generate_www_non_www_ssl')}
|
||||
on:click={() => !$status.service.isRunning && changeSettings('dualCerts')}
|
||||
/>
|
||||
<label class="text-base font-bold text-stone-100" for="exposePort"
|
||||
>Exposed Port <Explainer
|
||||
explanation={'You can expose your application to a port on the host system.<br><br>Useful if you would like to use your own reverse proxy or tunnel and also in development mode. Otherwise leave empty.'}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
name="exposePort"
|
||||
id="exposePort"
|
||||
bind:value={service.exposePort}
|
||||
placeholder="12345"
|
||||
/>
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 px-2 pt-4">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="exposePort"
|
||||
>Exposed Port <Explainer
|
||||
explanation={'You can expose your application to a port on the host system.<br><br>Useful if you would like to use your own reverse proxy or tunnel and also in development mode. Otherwise leave empty.'}
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
readonly={!$appSession.isAdmin && !$status.service.isRunning}
|
||||
disabled={!$appSession.isAdmin ||
|
||||
$status.service.isRunning ||
|
||||
$status.service.initialLoading}
|
||||
name="exposePort"
|
||||
id="exposePort"
|
||||
bind:value={service.exposePort}
|
||||
placeholder="12345"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<Setting
|
||||
id="dualCerts"
|
||||
disabled={$status.service.isRunning}
|
||||
dataTooltip={$t('forms.must_be_stopped_to_modify')}
|
||||
bind:setting={dualCerts}
|
||||
title={$t('application.ssl_www_and_non_www')}
|
||||
description={$t('services.generate_www_non_www_ssl')}
|
||||
on:click={() => !$status.service.isRunning && changeSettings('dualCerts')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{#if service.type === 'plausibleanalytics'}
|
||||
<PlausibleAnalytics bind:service {readOnly} />
|
||||
|
||||
@ -7,23 +7,33 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">Umami</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="adminUser">Admin User</label>
|
||||
<input name="adminUser" id="adminUser" placeholder="admin" value="admin" disabled readonly />
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="umamiAdminPassword"
|
||||
>Initial Admin Password <Explainer
|
||||
explanation="It could be changed in Umami. <br>This is just the password set initially after the first start."
|
||||
/></label
|
||||
>
|
||||
<CopyPasswordField
|
||||
isPasswordField
|
||||
name="umamiAdminPassword"
|
||||
id="umamiAdminPassword"
|
||||
placeholder="admin"
|
||||
value={service.umami.umamiAdminPassword}
|
||||
disabled
|
||||
readonly
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="adminUser">Admin User</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="adminUser"
|
||||
id="adminUser"
|
||||
placeholder="admin"
|
||||
value="admin"
|
||||
disabled
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="umamiAdminPassword"
|
||||
>Initial Admin Password <Explainer
|
||||
explanation="It could be changed in Umami. <br>This is just the password set initially after the first start."
|
||||
/></label
|
||||
>
|
||||
<CopyPasswordField
|
||||
isPasswordField
|
||||
name="umamiAdminPassword"
|
||||
id="umamiAdminPassword"
|
||||
placeholder="admin"
|
||||
value={service.umami.umamiAdminPassword}
|
||||
disabled
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -8,8 +8,8 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">VSCode Server</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="password">{$t('forms.password')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="password">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="password"
|
||||
isPasswordField
|
||||
|
||||
@ -7,8 +7,8 @@
|
||||
<div class="title">Weblate</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="adminPassword">Admin password</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="adminPassword">Admin password</label>
|
||||
<CopyPasswordField
|
||||
name="adminPassword"
|
||||
id="adminPassword"
|
||||
@ -22,45 +22,46 @@
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">PostgreSQL</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlHost">PostgreSQL Host</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlHost"
|
||||
id="postgresqlHost"
|
||||
value={service.weblate.postgresqlHost}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlPort">PostgreSQL Port</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlPort"
|
||||
id="postgresqlPort"
|
||||
value={service.weblate.postgresqlPort}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlUser">PostgreSQL User</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.weblate.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="postgresqlPassword">PostgreSQL Password</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlPassword"
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
value={service.weblate.postgresqlPassword}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlHost">PostgreSQL Host</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlHost"
|
||||
id="postgresqlHost"
|
||||
value={service.weblate.postgresqlHost}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlPort">PostgreSQL Port</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlPort"
|
||||
id="postgresqlPort"
|
||||
value={service.weblate.postgresqlPort}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlUser">PostgreSQL User</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlUser"
|
||||
id="postgresqlUser"
|
||||
value={service.weblate.postgresqlUser}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="postgresqlPassword">PostgreSQL Password</label>
|
||||
<CopyPasswordField
|
||||
name="postgresqlPassword"
|
||||
id="postgresqlPassword"
|
||||
isPasswordField
|
||||
value={service.weblate.postgresqlPassword}
|
||||
readonly
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -21,9 +21,7 @@
|
||||
|
||||
function generateUrl(publicPort: any) {
|
||||
return browser
|
||||
? `sftp://${
|
||||
settings?.fqdn ? getDomain(settings.fqdn) : ipv4 || ipv6
|
||||
}:${publicPort}`
|
||||
? `sftp://${settings?.fqdn ? getDomain(settings.fqdn) : ipv4 || ipv6}:${publicPort}`
|
||||
: 'Loading...';
|
||||
}
|
||||
async function changeSettings(name: any) {
|
||||
@ -72,9 +70,10 @@
|
||||
<div class="title">Wordpress</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="extraConfig">{$t('forms.extra_config')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="extraConfig">{$t('forms.extra_config')}</label>
|
||||
<textarea
|
||||
class="w-full"
|
||||
bind:value={service.wordpress.extraConfig}
|
||||
disabled={$status.service.isRunning || $status.service.initialLoading}
|
||||
readonly={$status.service.isRunning}
|
||||
@ -91,7 +90,7 @@ define('SUBDOMAIN_INSTALL', false);`
|
||||
: 'N/A'}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<Setting
|
||||
id="ftpEnabled"
|
||||
bind:setting={service.wordpress.ftpEnabled}
|
||||
@ -103,16 +102,16 @@ define('SUBDOMAIN_INSTALL', false);`
|
||||
/>
|
||||
</div>
|
||||
{#if service.wordpress.ftpEnabled}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="ftpUrl">sFTP Connection URI</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="ftpUrl">sFTP Connection URI</label>
|
||||
<CopyPasswordField id="ftpUrl" readonly disabled name="ftpUrl" value={ftpUrl} />
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="ftpUser">User</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="ftpUser">User</label>
|
||||
<CopyPasswordField id="ftpUser" readonly disabled name="ftpUser" value={ftpUser} />
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="ftpPassword">Password</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="ftpPassword">Password</label>
|
||||
<CopyPasswordField
|
||||
id="ftpPassword"
|
||||
isPasswordField
|
||||
@ -126,99 +125,104 @@ define('SUBDOMAIN_INSTALL', false);`
|
||||
<div class="flex space-x-1 py-5 font-bold">
|
||||
<div class="title">MySQL</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<Setting
|
||||
id="ownMysql"
|
||||
dataTooltip={$t('forms.must_be_stopped_to_modify')}
|
||||
bind:setting={service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning}
|
||||
on:click={() => !$status.service.isRunning && changeSettings('ownMysql')}
|
||||
title="Use your own MySQL server"
|
||||
description="Enables the use of your own MySQL server. If you don't have one, you can use the one provided by Coolify."
|
||||
/>
|
||||
</div>
|
||||
{#if service.wordpress.ownMysql}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlHost">Host</label>
|
||||
<input
|
||||
name="mysqlHost"
|
||||
id="mysqlHost"
|
||||
required
|
||||
readonly={$status.service.isRunning}
|
||||
<div class="space-y-2">
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<Setting
|
||||
id="ownMysql"
|
||||
dataTooltip={$t('forms.must_be_stopped_to_modify')}
|
||||
bind:setting={service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning}
|
||||
bind:value={service.wordpress.mysqlHost}
|
||||
placeholder="{$t('forms.eg')}: db.coolify.io"
|
||||
on:click={() => !$status.service.isRunning && changeSettings('ownMysql')}
|
||||
title="Use your own MySQL server"
|
||||
description="Enables the use of your own MySQL server. If you don't have one, you can use the one provided by Coolify."
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlPort">Port</label>
|
||||
{#if service.wordpress.ownMysql}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlHost">Host</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="mysqlHost"
|
||||
id="mysqlHost"
|
||||
required
|
||||
readonly={$status.service.isRunning}
|
||||
disabled={$status.service.isRunning}
|
||||
bind:value={service.wordpress.mysqlHost}
|
||||
placeholder="{$t('forms.eg')}: db.coolify.io"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlPort">Port</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="mysqlPort"
|
||||
id="mysqlPort"
|
||||
required
|
||||
readonly={$status.service.isRunning}
|
||||
disabled={$status.service.isRunning}
|
||||
bind:value={service.wordpress.mysqlPort}
|
||||
placeholder="{$t('forms.eg')}: 3306"
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlDatabase">{$t('index.database')}</label>
|
||||
<input
|
||||
name="mysqlPort"
|
||||
id="mysqlPort"
|
||||
class="w-full"
|
||||
name="mysqlDatabase"
|
||||
id="mysqlDatabase"
|
||||
required
|
||||
readonly={$status.service.isRunning}
|
||||
disabled={$status.service.isRunning}
|
||||
bind:value={service.wordpress.mysqlPort}
|
||||
placeholder="{$t('forms.eg')}: 3306"
|
||||
readonly={readOnly && !service.wordpress.ownMysql}
|
||||
disabled={readOnly && !service.wordpress.ownMysql}
|
||||
bind:value={service.wordpress.mysqlDatabase}
|
||||
placeholder="{$t('forms.eg')}: wordpress_db"
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlDatabase">{$t('index.database')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="mysqlDatabase"
|
||||
id="mysqlDatabase"
|
||||
required
|
||||
readonly={readOnly && !service.wordpress.ownMysql}
|
||||
disabled={readOnly && !service.wordpress.ownMysql}
|
||||
bind:value={service.wordpress.mysqlDatabase}
|
||||
placeholder="{$t('forms.eg')}: wordpress_db"
|
||||
/>
|
||||
</div>
|
||||
{#if !service.wordpress.ownMysql}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlRootUser">{$t('forms.root_user')}</label>
|
||||
{#if !service.wordpress.ownMysql}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlRootUser">{$t('forms.root_user')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="mysqlRootUser"
|
||||
id="mysqlRootUser"
|
||||
placeholder="MySQL {$t('forms.root_user')}"
|
||||
value={service.wordpress.mysqlRootUser}
|
||||
readonly={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlRootUserPassword">{$t('forms.roots_password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mysqlRootUserPassword"
|
||||
isPasswordField
|
||||
readonly={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
name="mysqlRootUserPassword"
|
||||
value={service.wordpress.mysqlRootUserPassword}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlUser">{$t('forms.user')}</label>
|
||||
<input
|
||||
name="mysqlRootUser"
|
||||
id="mysqlRootUser"
|
||||
placeholder="MySQL {$t('forms.root_user')}"
|
||||
value={service.wordpress.mysqlRootUser}
|
||||
class="w-full"
|
||||
name="mysqlUser"
|
||||
id="mysqlUser"
|
||||
bind:value={service.wordpress.mysqlUser}
|
||||
readonly={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlRootUserPassword">{$t('forms.roots_password')}</label>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10 px-2">
|
||||
<label for="mysqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mysqlRootUserPassword"
|
||||
id="mysqlPassword"
|
||||
isPasswordField
|
||||
readonly={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
name="mysqlRootUserPassword"
|
||||
value={service.wordpress.mysqlRootUserPassword}
|
||||
name="mysqlPassword"
|
||||
bind:value={service.wordpress.mysqlPassword}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlUser">{$t('forms.user')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="mysqlUser"
|
||||
id="mysqlUser"
|
||||
bind:value={service.wordpress.mysqlUser}
|
||||
readonly={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center lg:px-10">
|
||||
<label class="text-base font-bold text-stone-100" for="mysqlPassword">{$t('forms.password')}</label>
|
||||
<CopyPasswordField
|
||||
id="mysqlPassword"
|
||||
isPasswordField
|
||||
readonly={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
disabled={$status.service.isRunning || !service.wordpress.ownMysql}
|
||||
name="mysqlPassword"
|
||||
bind:value={service.wordpress.mysqlPassword}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -56,7 +56,6 @@
|
||||
import { page } from '$app/stores';
|
||||
import DeleteIcon from '$lib/components/DeleteIcon.svelte';
|
||||
import { del, get, post } from '$lib/api';
|
||||
import { goto } from '$app/navigation';
|
||||
import { t } from '$lib/translations';
|
||||
import { errorNotification, handlerNotFoundLoad } from '$lib/common';
|
||||
import {
|
||||
@ -70,6 +69,7 @@
|
||||
import { onDestroy, onMount } from 'svelte';
|
||||
import Tooltip from '$lib/components/Tooltip.svelte';
|
||||
import ServiceLinks from './_ServiceLinks.svelte';
|
||||
import { goto } from '$app/navigation';
|
||||
const { id } = $page.params;
|
||||
|
||||
export let service: any;
|
||||
@ -86,7 +86,7 @@
|
||||
if (service.type && $status.service.isRunning)
|
||||
await post(`/services/${service.id}/${service.type}/stop`, {});
|
||||
await del(`/services/${service.id}`, { id: service.id });
|
||||
return await window.location.assign(`/`);
|
||||
return await goto('/');
|
||||
} catch (error) {
|
||||
return errorNotification(error);
|
||||
} finally {
|
||||
@ -156,19 +156,31 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<nav class="header">
|
||||
<div class="hidden items-center space-x-2 p-5 px-6 font-bold lg:flex">
|
||||
<div class="flex flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
<nav class="header lg:flex-row flex-col-reverse">
|
||||
<div class="flex flex-row space-x-2 font-bold pt-10 lg:pt-0">
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<div class="title">
|
||||
{#if $page.url.pathname === `/services/${id}`}
|
||||
Configurations
|
||||
{:else if $page.url.pathname === `/services/${id}/secrets`}
|
||||
Secrets
|
||||
{:else if $page.url.pathname === `/services/${id}/storages`}
|
||||
Persistent Storages
|
||||
{:else if $page.url.pathname === `/services/${id}/logs`}
|
||||
Service Logs
|
||||
{:else if $page.url.pathname === `/services/${id}/configuration/type`}
|
||||
Select a Service Type
|
||||
{:else if $page.url.pathname === `/services/${id}/configuration/version`}
|
||||
Select a Service Version
|
||||
{:else if $page.url.pathname === `/services/${id}/configuration/destination`}
|
||||
Select a Destination
|
||||
{/if}
|
||||
</div>
|
||||
<span class="text-xs">{service.name}</span>
|
||||
</div>
|
||||
<ServiceLinks {service} />
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-row flex-wrap space-x-4 space-y-3 justify-center lg:justify-start py-2 lg:py-0"
|
||||
>
|
||||
<div class="lg:block hidden flex-1" />
|
||||
<div class="flex flex-row flex-wrap space-x-3 justify-center lg:justify-start lg:py-0">
|
||||
{#if $location}
|
||||
<a
|
||||
id="open"
|
||||
@ -192,7 +204,7 @@
|
||||
</svg></a
|
||||
>
|
||||
<Tooltip triggeredBy="#open">Open</Tooltip>
|
||||
<div class="border border-stone-700 h-8" />
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
{/if}
|
||||
{#if $status.service.isExited}
|
||||
<a
|
||||
@ -291,8 +303,9 @@
|
||||
</button>
|
||||
<Tooltip triggeredBy="#start">Start</Tooltip>
|
||||
{/if}
|
||||
<div class="border border-stone-700 h-8" />
|
||||
|
||||
{#if service.type && service.destinationDockerId && service.version}
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
<a
|
||||
href="/services/{id}"
|
||||
sveltekit:prefetch
|
||||
@ -386,8 +399,8 @@
|
||||
</svg>
|
||||
</button></a
|
||||
>
|
||||
<Tooltip triggeredBy="#persistentstorage">Persistent Storage</Tooltip>
|
||||
<div class="border border-stone-700 h-8" />
|
||||
<Tooltip triggeredBy="#persistentstorage">Persistent Storages</Tooltip>
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
<a
|
||||
href={$isDeploymentEnabled && $status.service.isRunning ? `/services/${id}/logs` : null}
|
||||
sveltekit:prefetch
|
||||
@ -421,6 +434,7 @@
|
||||
>
|
||||
<Tooltip triggeredBy="#logs">Logs</Tooltip>
|
||||
{/if}
|
||||
<div class="hidden lg:block border border-coolgray-500 h-8" />
|
||||
<button
|
||||
id="delete"
|
||||
on:click={deleteService}
|
||||
@ -429,7 +443,7 @@
|
||||
class:hover:text-red-500={$appSession.isAdmin}
|
||||
class="icons bg-transparent text-sm"><DeleteIcon /></button
|
||||
>
|
||||
<Tooltip triggeredBy="#delete">Delete</Tooltip>
|
||||
<Tooltip triggeredBy="#delete" placement="left">Delete</Tooltip>
|
||||
</div>
|
||||
</nav>
|
||||
<slot />
|
||||
|
||||
@ -52,11 +52,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">
|
||||
{$t('application.configuration.configure_destination')}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
{#if !destinations || destinations.length === 0}
|
||||
<div class="flex-col">
|
||||
|
||||
@ -47,10 +47,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">{$t('forms.select_a_service')}</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap justify-center">
|
||||
{#each types as type}
|
||||
<div class="p-2">
|
||||
|
||||
@ -57,9 +57,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex space-x-1 p-6 font-bold">
|
||||
<div class="mr-4 text-2xl tracking-tight">{$t('forms.select_a_service_version')}</div>
|
||||
</div>
|
||||
{#if from}
|
||||
<div class="pb-10 text-center">
|
||||
Warning: you are about to change the version of this service.<br />This could cause problem
|
||||
|
||||
@ -50,32 +50,24 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex items-center space-x-2 p-5 px-6 font-bold lg:hidden">
|
||||
<div class="flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
</div>
|
||||
<span class="text-xs">{service.name}</span>
|
||||
</div>
|
||||
<ServiceLinks {service} />
|
||||
</div>
|
||||
<div class="mx-auto max-w-4xl px-6 py-4">
|
||||
<div class="text-2xl font-bold">Service Usage</div>
|
||||
<div class="text-center">
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used Memory / Memory Limit</div>
|
||||
<div class="stat-value text-xl">{usage?.MemUsage}</div>
|
||||
</div>
|
||||
{#if $status.service.isRunning}
|
||||
<div class="mx-auto max-w-6xl px-6 lg:my-0 my-4 lg:pt-0 pt-4 rounded">
|
||||
<div class="text-center">
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used Memory / Memory Limit</div>
|
||||
<div class="stat-value text-xl">{usage?.MemUsage}</div>
|
||||
</div>
|
||||
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used CPU</div>
|
||||
<div class="stat-value text-xl">{usage?.CPUPerc}</div>
|
||||
</div>
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Used CPU</div>
|
||||
<div class="stat-value text-xl">{usage?.CPUPerc}</div>
|
||||
</div>
|
||||
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Network IO</div>
|
||||
<div class="stat-value text-xl">{usage?.NetIO}</div>
|
||||
<div class="stat w-64">
|
||||
<div class="stat-title">Network IO</div>
|
||||
<div class="stat-value text-xl">{usage?.NetIO}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
<Services bind:service bind:readOnly bind:settings />
|
||||
|
||||
@ -203,10 +203,10 @@
|
||||
<div class="mt-5">
|
||||
<form on:submit|preventDefault={handleSubmit}>
|
||||
<div
|
||||
class="flex flex-col space-y-4 p-6 lg:p-0 lg:flex-row lg:space-y0 lg:space-x-4 w-full lg:justify-between lg:items-center mb-5"
|
||||
class="flex flex-col space-y-2 p-6 lg:p-0 lg:flex-row lg:space-y0 lg:space-x-4 w-full lg:justify-between lg:items-center mb-5"
|
||||
>
|
||||
<div class="title font-bold">{$t('index.global_settings')}</div>
|
||||
<div class="flex lg:flex-row lg:space-x-4 flex-col space-y-4 lg:space-y-0">
|
||||
<div class="flex lg:flex-row lg:space-x-4 flex-col space-y-2 lg:space-y-0">
|
||||
<button
|
||||
class="btn btn-sm bg-settings text-black"
|
||||
type="submit"
|
||||
|
||||
@ -65,7 +65,7 @@
|
||||
<Menu />
|
||||
<div class="flex flex-col mt-5">
|
||||
<div
|
||||
class="flex flex-col space-y-4 p-6 lg:p-0 lg:flex-row lg:space-y0 lg:space-x-4 w-full lg:justify-between lg:items-center mb-5"
|
||||
class="flex flex-col space-y-2 p-6 lg:p-0 lg:flex-row lg:space-y0 lg:space-x-4 w-full lg:justify-between lg:items-center mb-5"
|
||||
style="min-width: 83vw"
|
||||
>
|
||||
<div class="title font-bold">SSH Keys</div>
|
||||
|
||||
@ -90,7 +90,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-4xl lg:px-6 px-3">
|
||||
<div class="mx-auto max-w-6xl lg:px-6 px-3">
|
||||
{#if !source.githubAppId}
|
||||
<form on:submit|preventDefault={newGithubApp} class="py-4">
|
||||
<div class="grid gap-1 lg:grid-flow-col pb-7">
|
||||
@ -144,7 +144,7 @@
|
||||
<div class="flex lg:flex-row lg:justify-between flex-col space-y-3 w-full lg:items-center">
|
||||
<h1 class="title">{$t('general')}</h1>
|
||||
{#if $appSession.isAdmin}
|
||||
<div class="flex flex-col lg:flex-row lg:space-x-4 lg:w-fit space-y-4 lg:space-y-0 w-full">
|
||||
<div class="flex flex-col lg:flex-row lg:space-x-4 lg:w-fit space-y-2 lg:space-y-0 w-full">
|
||||
<button class="btn btn-sm bg-sources" type="submit" disabled={loading}
|
||||
>{loading ? 'Saving...' : 'Save'}</button
|
||||
>
|
||||
|
||||
@ -143,11 +143,11 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="mx-auto max-w-4xl px-6">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
<form on:submit|preventDefault={handleSubmit} class="py-4">
|
||||
<div class="flex lg:flex-row lg:justify-between flex-col space-y-3 w-full lg:items-center">
|
||||
<h1 class="title">General</h1>
|
||||
<div class="flex flex-col lg:flex-row lg:space-x-4 lg:w-fit space-y-4 lg:space-y-0 w-full">
|
||||
<div class="flex flex-col lg:flex-row lg:space-x-4 lg:w-fit space-y-2 lg:space-y-0 w-full">
|
||||
{#if $appSession.isAdmin}
|
||||
<button type="submit" class="btn btn-sm bg-sources" disabled={loading}
|
||||
>{loading ? $t('forms.saving') : $t('forms.save')}</button
|
||||
|
||||
@ -28,7 +28,7 @@ input, .input {
|
||||
@apply h-12 w-96 rounded border border-transparent bg-transparent bg-coolgray-200 p-2 text-xs tracking-tight text-white placeholder-stone-600 outline-none transition duration-150 hover:bg-coolgray-500 focus:bg-coolgray-500 disabled:border disabled:border-dashed disabled:border-coolgray-300 disabled:bg-transparent md:text-sm;
|
||||
}
|
||||
textarea {
|
||||
@apply min-w-[24rem] rounded border border-transparent bg-transparent bg-coolgray-200 p-2 text-xs tracking-tight text-white placeholder-stone-600 outline-none transition duration-150 hover:bg-coolgray-500 focus:bg-coolgray-500 disabled:border disabled:border-dashed disabled:border-coolgray-300 disabled:bg-transparent md:text-sm;
|
||||
@apply min-w-[14rem] rounded border border-transparent bg-transparent bg-coolgray-200 p-2 text-xs tracking-tight text-white placeholder-stone-600 outline-none transition duration-150 hover:bg-coolgray-500 focus:bg-coolgray-500 disabled:border disabled:border-dashed disabled:border-coolgray-300 disabled:bg-transparent md:text-sm;
|
||||
}
|
||||
|
||||
#svelte .custom-select-wrapper .selectContainer.disabled input {
|
||||
@ -40,7 +40,7 @@ textarea {
|
||||
}
|
||||
|
||||
#svelte .custom-select-wrapper .selectContainer {
|
||||
@apply h-12 w-96 rounded border border-coolgray-300 border-dashed bg-coolgray-200 p-2 px-0 text-xs tracking-tight outline-none transition duration-150 hover:bg-coolgray-500 focus:bg-coolgray-500 md:text-sm;
|
||||
@apply h-12 w-96 rounded border border-coolgray-300 bg-coolgray-200 p-2 px-0 text-xs tracking-tight outline-none transition duration-150 hover:bg-coolgray-500 focus:bg-coolgray-500 md:text-sm w-full;
|
||||
}
|
||||
|
||||
#svelte .listContainer {
|
||||
@ -82,7 +82,7 @@ select {
|
||||
}
|
||||
|
||||
label {
|
||||
@apply inline-block w-64 text-xs tracking-tight md:text-sm;
|
||||
@apply inline-block;
|
||||
}
|
||||
.btn {
|
||||
@apply text-white text-base min-w-fit;
|
||||
@ -97,7 +97,7 @@ a {
|
||||
}
|
||||
|
||||
.title {
|
||||
@apply mr-4 tracking-tight text-2xl font-bold;
|
||||
@apply text-lg lg:text-2xl font-bold;
|
||||
}
|
||||
.nav-main {
|
||||
@apply fixed top-0 left-0 min-h-screen w-16 min-w-[4rem] overflow-hidden border-r border-stone-800 bg-coolgray-200 scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200 xl:overflow-visible;
|
||||
@ -197,10 +197,10 @@ a {
|
||||
border: none;
|
||||
}
|
||||
|
||||
input {
|
||||
@apply w-48 lg:w-96;
|
||||
}
|
||||
|
||||
.header {
|
||||
@apply flex flex-row px-4 justify-between items-center bg-neutral-focus z-10 w-full mb-10;
|
||||
}
|
||||
@apply flex flex-row z-10 w-full py-5 px-5;
|
||||
}
|
||||
.burger {
|
||||
@apply block m-[2px] h-[3px] w-5 rounded
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user