Shiloh/lasthourcloud
Shiloh/lasthourcloud
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

wip: trpc

Browse Source
This commit is contained in:
Andras Bacsai 2023-01-13 15:21:54 +01:00
parent 97313e4180
commit 6efb02fa32
11 changed files with 1047 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
apps/client/src/lib/common.ts
View File

@ -3,6 +3,15 @@ import { addToast } from './store';
import Cookies from 'js-cookie';
export const asyncSleep = (delay: number) => new Promise((resolve) => setTimeout(resolve, delay));
export function dashify(str: string, options?: any): string {
if (typeof str !== 'string') return str;
return str
.trim()
.replace(/\W/g, (m) => (/[À-ž]/.test(m) ? m : '-'))
.replace(/^-+|-+$/g, '')
.replace(/-{2,}/g, (m) => (options && options.condense ? '-' : m))
.toLowerCase();
}
export function errorNotification(error: any | { message: string }): void {
if (error instanceof Error) {
console.error(error.message)

41
apps/client/src/routes/sources/[id]/+layout.svelte Normal file
View File

@ -0,0 +1,41 @@
<script lang="ts">
import type { LayoutData } from './$types';
export let data: LayoutData;
let source = data.source.data;
console.log(source)
import { page } from '$app/stores';
import { errorNotification } from '$lib/common';
import { appSession, trpc } from '$lib/store';
import * as Icons from '$lib/components/icons';
import { goto } from '$app/navigation';
import Tooltip from '$lib/components/Tooltip.svelte';
const { id } = $page.params;
async function deleteSource(name: string) {
const sure = confirm('Are you sure you want to delete ' + name + '?');
if (sure) {
try {
await trpc.sources.delete.mutate({ id });
await goto('/', { replaceState: true });
} catch (error) {
errorNotification(error);
}
}
}
</script>
{#if id !== 'new' && $appSession.teamId === '0'}
<nav class="nav-side">
<button
id="delete"
on:click={() => deleteSource(source.name)}
type="submit"
disabled={!$appSession.isAdmin}
class:hover:text-red-500={$appSession.isAdmin}
class="icons bg-transparent text-sm"><Icons.Delete /></button
>
</nav>
<Tooltip triggeredBy="#delete">Delete</Tooltip>
{/if}
<slot />

35
apps/client/src/routes/sources/[id]/+layout.ts Normal file
View File

@ -0,0 +1,35 @@
import { error } from '@sveltejs/kit';
import { trpc } from '$lib/store';
import type { LayoutLoad } from './$types';
import { redirect } from '@sveltejs/kit';
export const load: LayoutLoad = async ({ params, url }) => {
const { pathname } = new URL(url);
const { id } = params;
try {
const source = await trpc.sources.getSourceById.query({ id });
if (!source) {
throw redirect(307, '/sources');
}
// if (
// configurationPhase &&
// pathname !== `/applications/${params.id}/configuration/${configurationPhase}`
// ) {
// throw redirect(302, `/applications/${params.id}/configuration/${configurationPhase}`);
// }
return {
source
};
} catch (err) {
if (err instanceof Error) {
throw error(500, {
message: 'An unexpected error occurred, please try again later.' + '<br><br>' + err.message
});
}
throw error(500, {
message: 'An unexpected error occurred, please try again later.'
});
}
};

17
apps/client/src/routes/sources/[id]/+page.svelte Normal file
View File

@ -0,0 +1,17 @@
<script lang="ts">
import type { LayoutData } from './$types';
export let data: LayoutData;
let source = data.source;
let settings = data.settings;
import { page } from '$app/stores';
import Source from './components/Source.svelte';
import New from './components/New.svelte';
const { id } = $page.params;
</script>
{#if id === 'new'}
<New bind:source bind:settings />
{:else}
<Source bind:source bind:settings />
{/if}

264
apps/client/src/routes/sources/[id]/components/Github.svelte Normal file
View File

@ -0,0 +1,264 @@
<script lang="ts">
export let source: any;
export let settings: any;
import { page } from '$app/stores';
import { dashify, errorNotification, getAPIUrl, getDomain, getWebhookUrl } from '$lib/common';
import { addToast, appSession, trpc } from '$lib/store';
import Explainer from '$lib/components/Explainer.svelte';
import Setting from '$lib/components/Setting.svelte';
import { dev } from '$app/environment';
const { id } = $page.params;
$: selfHosted = source.htmlUrl !== 'https://github.com';
let loading = false;
async function handleSubmit() {
loading = true;
try {
await trpc.sources.save.mutate({
id: source.id,
name: source.name,
htmlUrl: source.htmlUrl.replace(/\/$/, ''),
apiUrl: source.apiUrl.replace(/\/$/, ''),
isSystemWide: source.isSystemWide
});
return addToast({
message: 'Configuration saved.',
type: 'success'
});
} catch (error) {
return errorNotification(error);
} finally {
loading = false;
}
}
async function newGithubApp() {
loading = true;
try {
const { id } = await trpc.sources.newGitHubApp.mutate({
id: source.id,
name: source.name,
htmlUrl: source.htmlUrl.replace(/\/$/, ''),
apiUrl: source.apiUrl.replace(/\/$/, ''),
organization: source.organization,
customPort: source.customPort,
isSystemWide: source.isSystemWide
});
const { organization, htmlUrl } = source;
const { fqdn, ipv4, ipv6 } = settings;
const host = dev ? getAPIUrl() : fqdn ? fqdn : `http://${ipv4 || ipv6}` || '';
const domain = getDomain(fqdn);
let url = 'settings/apps/new';
if (organization) url = `organizations/${organization}/settings/apps/new`;
const name = dashify(domain) || 'app';
const data = JSON.stringify({
name: `coolify-${name}`,
url: host,
hook_attributes: {
url: dev ? getWebhookUrl('github') : `${host}/webhooks/github/events`
},
redirect_url: `${host}/webhooks/github`,
callback_urls: [`${host}/login/github/app`],
public: false,
request_oauth_on_install: false,
setup_url: `${host}/webhooks/github/install?gitSourceId=${id}`,
setup_on_update: true,
default_permissions: {
contents: 'read',
metadata: 'read',
pull_requests: 'read',
emails: 'read'
},
default_events: ['pull_request', 'push']
});
const form = document.createElement('form');
form.setAttribute('method', 'post');
form.setAttribute('action', `${htmlUrl}/${url}?state=${id}`);
const input = document.createElement('input');
input.setAttribute('id', 'manifest');
input.setAttribute('name', 'manifest');
input.setAttribute('type', 'hidden');
input.setAttribute('value', data);
form.appendChild(input);
document.getElementsByTagName('body')[0].appendChild(form);
form.submit();
} catch (error) {
return errorNotification(error);
}
}
async function changeSettings(name: any, save: boolean) {
if ($appSession.teamId === '0') {
if (name === 'isSystemWide') {
source.isSystemWide = !source.isSystemWide;
}
if (save) {
await handleSubmit();
}
}
}
</script>
<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">
<h1 class="title">General</h1>
{#if !source.githubAppId}
<div class="w-full flex flex-rpw justify-end">
<button class="btn btn-sm bg-sources mt-5 w-full lg:w-fit" type="submit"
>Save & Redirect to GitHub</button
>
</div>
{/if}
</div>
<div class="grid gap-2 grid-cols-2 auto-rows-max">
<label for="name">Name</label>
<input class="w-full" name="name" id="name" required bind:value={source.name} />
<label for="htmlUrl">HTML URL</label>
<input class="w-full" name="htmlUrl" id="htmlUrl" required bind:value={source.htmlUrl} />
<label for="apiUrl">API URL</label>
<input class="w-full" name="apiUrl" id="apiUrl" required bind:value={source.apiUrl} />
<label for="customPort"
>Custom SSH Port <Explainer
explanation={'If you use a self-hosted version of Git, you can provide custom port for all the Git related actions.'}
/></label
>
<input
class="w-full"
name="customPort"
id="customPort"
disabled={!selfHosted || source.githubAppId}
readonly={!selfHosted || source.githubAppId}
required
value={source.customPort}
/>
<label for="organization" class="pt-2"
>Organization
<Explainer
explanation={"Fill it if you would like to use an organization's as your Git Source. Otherwise your user will be used."}
/></label
>
<input
class="w-full"
name="organization"
id="organization"
placeholder="eg: coollabsio"
bind:value={source.organization}
/>
<Setting
customClass="pt-4"
id="autodeploy"
isCenter={false}
bind:setting={source.isSystemWide}
on:click={() => changeSettings('isSystemWide', false)}
title="System Wide Git"
description="System Wide Git are available to all the users in your Coolify instance. <br><br> <span class='font-bold text-warning'>Use with caution, as it can be a security risk.</span>"
/>
</div>
</form>
{:else if source.githubApp?.installationId}
<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>
{#if $appSession.isAdmin && $appSession.teamId === '0'}
<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
>
<a
class="btn btn-sm"
href={`${source.htmlUrl}/${
source.htmlUrl === 'https://github.com' ? 'apps' : 'github-apps'
}/${source.githubApp.name}/installations/new`}>"Change GitHub App Settings"</a
>
</div>
{/if}
</div>
<div class="grid gap-2 grid-cols-2 auto-rows-max mt-4">
<label for="name">Name</label>
<input
class="w-full"
name="name"
id="name"
required
bind:value={source.name}
disabled={!$appSession.isAdmin}
/>
<label for="htmlUrl">HTML URL</label>
<input
class="w-full"
name="htmlUrl"
id="htmlUrl"
disabled={source.githubAppId}
readonly={source.githubAppId}
required
bind:value={source.htmlUrl}
/>
<label for="apiUrl">API URL</label>
<input
class="w-full"
name="apiUrl"
id="apiUrl"
required
disabled={source.githubAppId}
readonly={source.githubAppId}
bind:value={source.apiUrl}
/>
<label for="customPort"
>Custom SSH Port <Explainer
explanation="If you use a self-hosted version of Git, you can provide custom port for all the Git related actions."
/></label
>
<input
class="w-full"
name="customPort"
id="customPort"
disabled={!selfHosted}
readonly={!selfHosted}
required
value={source.customPort}
/>
<label for="organization" class="pt-2">Organization</label>
<input
class="w-full"
readonly
disabled
name="organization"
id="organization"
placeholder="eg: coollabsio"
bind:value={source.organization}
/>
{#if $appSession.isAdmin}
<Setting
customClass="pt-4"
id="autodeploy"
isCenter={false}
disabled={$appSession.teamId !== '0'}
bind:setting={source.isSystemWide}
on:click={() => changeSettings('isSystemWide', true)}
title="System Wide Git Source"
description="System Wide Git Sources are available to all the users in your Coolify instance. <br><br> <span class='font-bold text-warning'>Use with caution, as it can be a security risk.</span>"
/>
{/if}
</div>
</form>
{:else}
<div class="text-center">
<a
href={`${source.htmlUrl}/${
source.htmlUrl === 'https://github.com' ? 'apps' : 'github-apps'
}/${source.githubApp.name}/installations/new`}
>
<button class="box-selection bg-sources text-xl font-bold">Install Repositories</button></a
>
</div>
{/if}
</div>

333
apps/client/src/routes/sources/[id]/components/Gitlab.svelte Normal file
View File

@ -0,0 +1,333 @@
<script lang="ts">
export let source: any;
export let settings: any;
import { page } from '$app/stores';
import { onMount } from 'svelte';
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import { errorNotification, getAPIUrl } from '$lib/common';
import { addToast, appSession, trpc } from '$lib/store';
import Explainer from '$lib/components/Explainer.svelte';
import { dev } from '$app/environment';
const { id } = $page.params;
let url = settings.fqdn ? settings.fqdn : window.location.origin;
if (dev) {
url = getAPIUrl();
}
let loading = false;
let oauthIdEl: HTMLInputElement;
let applicationType: string;
if (!source.gitlabAppId) {
source.gitlabApp = {
oauthId: null,
groupName: null,
appId: null,
appSecret: null
};
}
$: selfHosted = source.htmlUrl !== 'https://gitlab.com';
onMount(() => {
oauthIdEl && oauthIdEl.focus();
});
async function handleSubmit() {
if (loading) return;
loading = true;
if (!source.gitlabAppId) {
// New GitLab App
try {
const { id } = await trpc.sources.newGitLabApp.mutate({
id: source.id,
type: 'gitlab',
name: source.name,
htmlUrl: source.htmlUrl.replace(/\/$/, ''),
apiUrl: source.apiUrl.replace(/\/$/, ''),
oauthId: source.gitlabApp.oauthId,
appId: source.gitlabApp.appId,
appSecret: source.gitlabApp.appSecret,
groupName: source.gitlabApp.groupName,
customPort: source.customPort,
customUser: source.customUser
});
const from = $page.url.searchParams.get('from');
if (from) {
return window.location.assign(from);
}
return window.location.assign(`/sources/${id}`);
} catch (error) {
return errorNotification(error);
} finally {
loading = false;
}
} else {
// Update GitLab App
try {
await trpc.sources.save.mutate({
id,
name: source.name,
htmlUrl: source.htmlUrl.replace(/\/$/, ''),
apiUrl: source.apiUrl.replace(/\/$/, ''),
customPort: source.customPort,
customUser: source.customUser
});
return addToast({
message: 'Configuration saved.',
type: 'success'
});
} catch (error) {
return errorNotification(error);
} finally {
loading = false;
}
}
}
async function changeSettings() {
const {
htmlUrl,
gitlabApp: { oauthId }
} = source;
const left = screen.width / 2 - 1020 / 2;
const top = screen.height / 2 - 1000 / 2;
const newWindow = open(
`${htmlUrl}/oauth/applications/${oauthId}`,
'GitLab',
'resizable=1, scrollbars=1, fullscreen=0, height=1000, width=1020,top=' +
top +
', left=' +
left +
', toolbar=0, menubar=0, status=0'
);
const timer = setInterval(() => {
if (newWindow?.closed) {
clearInterval(timer);
}
}, 100);
}
async function checkOauthId() {
if (source.gitlabApp?.oauthId) {
try {
// await post(`/sources/${id}/check`, {
// oauthId: source.gitlabApp?.oauthId
// });
} catch (error) {
source.gitlabApp.oauthId = null;
oauthIdEl.focus();
return errorNotification(error);
}
}
}
function newApp() {
switch (applicationType) {
case 'user':
window.open(`${source.htmlUrl}/-/profile/applications`);
break;
case 'group':
if (!source.gitlabApp.groupName) {
return addToast({
message: 'Please enter a group name first.',
type: 'error'
});
}
window.open(
`${source.htmlUrl}/groups/${source.gitlabApp.groupName}/-/settings/applications`
);
break;
case 'instance':
break;
default:
break;
}
}
</script>
<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-2 lg:space-y-0 w-full">
{#if $appSession.isAdmin}
<button type="submit" class="btn btn-sm bg-sources" disabled={loading}
>{loading ? 'Saving...' : 'Save'}</button
>
{#if source.gitlabAppId}
<button class="btn btn-sm" on:click|preventDefault={changeSettings}
>"Change GitLab App Settings"</button
>
{:else}
<button class="btn btn-sm" on:click|preventDefault|stopPropagation={newApp}
>Create new GitLab App manually</button
>
{/if}
{/if}
</div>
</div>
<div class="grid grid-flow-row gap-2 lg:px-10">
{#if !source.gitlabAppId}
<a
href="https://docs.coollabs.io/coolify/sources#how-to-integrate-with-gitlab"
class="font-bold "
target="_blank noreferrer"
rel="noopener noreferrer">Documentation and detailed instructions.</a
>
<div class="grid grid-cols-2 items-center">
<label for="type" class="text-base font-bold text-stone-100">Application Type</label>
<select name="type" id="type" class="lg:w-96 w-full" bind:value={applicationType}>
<option value="user">User owned application</option>
<option value="group">Group owned application</option>
{#if source.htmlUrl !== 'https://gitlab.com'}
<option value="instance">Instance-wide application (self-hosted)</option>
{/if}
</select>
</div>
{#if applicationType === 'group'}
<div class="grid grid-cols-2 items-center">
<label for="groupName" class="text-base font-bold text-stone-100">Group Name</label>
<input
class="w-full"
name="groupName"
id="groupName"
required
bind:value={source.gitlabApp.groupName}
/>
</div>
{/if}
{/if}
<div class="grid grid-flow-row gap-2">
<div class="mt-2 grid grid-cols-2 items-center">
<label for="name" class="text-base font-bold text-stone-100">Name</label>
<input class="w-full" name="name" id="name" required bind:value={source.name} />
</div>
</div>
{#if source.gitlabApp.groupName}
<div class="grid grid-cols-2 items-center">
<label for="groupName" class="text-base font-bold text-stone-100">Group Name</label>
<input
class="w-full"
name="groupName"
id="groupName"
disabled={source.gitlabAppId}
readonly={source.gitlabAppId}
required
bind:value={source.gitlabApp.groupName}
/>
</div>
{/if}
<div class="grid grid-cols-2 items-center">
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
<input
class="w-full"
name="htmlUrl"
id="htmlUrl"
required
disabled={source.gitlabAppId}
readonly={source.gitlabAppId}
bind:value={source.htmlUrl}
/>
</div>
<div class="grid grid-cols-2 items-center">
<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
<input
class="w-full"
name="apiUrl"
id="apiUrl"
disabled={source.gitlabAppId}
readonly={source.gitlabAppId}
required
bind:value={source.apiUrl}
/>
</div>
{#if selfHosted}
<div class="grid grid-cols-2 items-center">
<label for="customPort" class="text-base font-bold text-stone-100"
>Custom SSH User <Explainer
explanation={'If you use a self-hosted version of Git, you can provide a custom SSH user for all the Git related actions.'}
/></label
>
<input
class="w-full"
name="customUser"
id="customUser"
disabled={!selfHosted}
readonly={!selfHosted}
required
bind:value={source.customUser}
/>
</div>
<div class="grid grid-cols-2 items-center">
<label for="customPort" class="text-base font-bold text-stone-100"
>Custom SSH Port <Explainer
explanation={'If you use a self-hosted version of Git, you can provide custom port for all the Git related actions.'}
/></label
>
<input
class="w-full"
name="customPort"
id="customPort"
disabled={!selfHosted}
readonly={!selfHosted}
required
bind:value={source.customPort}
/>
</div>
{/if}
<div class="grid grid-cols-2 items-start">
<div class="flex-col">
<label for="oauthId" class="pt-2 text-base font-bold text-stone-100"
>OAuth ID
{#if !source.gitlabAppId}
<Explainer
explanation="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."
/>
{/if}</label
>
</div>
<input
class="w-full"
disabled={source.gitlabAppId}
readonly={source.gitlabAppId}
on:change={checkOauthId}
bind:this={oauthIdEl}
name="oauthId"
id="oauthId"
type="number"
required
bind:value={source.gitlabApp.oauthId}
/>
</div>
<div class="grid grid-cols-2 items-center">
<label for="appId" class="text-base font-bold text-stone-100">Application ID</label>
<input
class="w-full"
name="appId"
id="appId"
disabled={source.gitlabAppId}
readonly={source.gitlabAppId}
required
bind:value={source.gitlabApp.appId}
/>
</div>
<div class="grid grid-cols-2 items-center">
<label for="appSecret" class="text-base font-bold text-stone-100">Secret</label>
<CopyPasswordField
disabled={source.gitlabAppId}
readonly={source.gitlabAppId}
isPasswordField={true}
name="appSecret"
id="appSecret"
required
bind:value={source.gitlabApp.appSecret}
/>
</div>
</div>
</form>
</div>

62
apps/client/src/routes/sources/[id]/components/New.svelte Normal file
View File

@ -0,0 +1,62 @@
<script lang="ts">
export let source: any;
export let settings: any;
import Github from './Github.svelte';
import Gitlab from './Gitlab.svelte';
function setPredefined(type: string) {
switch (type) {
case 'github':
source.name = 'Github.com';
source.type = 'github';
source.htmlUrl = 'https://github.com';
source.apiUrl = 'https://api.github.com';
source.organization = undefined;
break;
case 'gitlab':
source.name = 'Gitlab.com';
source.type = 'gitlab';
source.htmlUrl = 'https://gitlab.com';
source.apiUrl = 'https://gitlab.com/api';
source.organization = undefined;
break;
case 'bitbucket':
source.name = 'Bitbucket.com';
source.type = 'bitbucket';
source.htmlUrl = 'https://bitbucket.com';
source.apiUrl = 'https://api.bitbucket.org';
source.organization = undefined;
break;
default:
break;
}
}
</script>
<div class="flex h-20 items-center space-x-2 p-5 px-6 font-bold">
<div class="-mb-1 flex-col">
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
New Git Source
</div>
</div>
</div>
<div class="flex flex-col justify-center">
<div class="flex-col space-y-2 pb-10 text-center">
<div class="text-xl font-bold text-white">Select a git type</div>
<div class="flex justify-center space-x-2">
<button class="btn btn-sm" on:click={() => setPredefined('github')}>GitHub</button>
<button class="btn btn-sm" on:click={() => setPredefined('gitlab')}>GitLab</button>
</div>
</div>
{#if source?.type}
<div>
{#if source.type === 'github'}
<Github bind:source {settings} />
{:else if source.type === 'gitlab'}
<Gitlab bind:source {settings} />
{/if}
</div>
{/if}
</div>

58
apps/client/src/routes/sources/[id]/components/Source.svelte Normal file
View File

@ -0,0 +1,58 @@
<script lang="ts">
import Github from './Github.svelte';
import Gitlab from './Gitlab.svelte';
export let source: any;
export let settings: any;
</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">
Configuration
</div>
<span class="text-xs">{source.name}</span>
</div>
{#if source?.type === 'gitlab'}
<svg viewBox="0 0 128 128" class="w-8">
<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 source?.type === 'github'}
<svg viewBox="0 0 128 128" class="w-8">
<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}
</div>
<div>
{#if source.type === 'github'}
<Github bind:source {settings} />
{:else if source.type === 'gitlab'}
<Gitlab bind:source {settings} />
{/if}
</div>

6
apps/server/src/trpc/index.ts
View File

@ -7,7 +7,8 @@ import {
dashboardRouter,
applicationsRouter,
servicesRouter,
databasesRouter
databasesRouter,
sourcesRouter
} from './routers';
export const appRouter = router({
@ -16,7 +17,8 @@ export const appRouter = router({
dashboard: dashboardRouter,
applications: applicationsRouter,
services: servicesRouter,
databases: databasesRouter
databases: databasesRouter,
sources: sourcesRouter
});
export type AppRouter = typeof appRouter;

1
apps/server/src/trpc/routers/index.ts
View File

@ -4,3 +4,4 @@ export * from './settings';
export * from './applications';
export * from './services';
export * from './databases';
export * from './sources';

223
apps/server/src/trpc/routers/sources/index.ts Normal file
View File

@ -0,0 +1,223 @@
import { z } from 'zod';
import { privateProcedure, router } from '../../trpc';
import { decrypt, encrypt } from '../../../lib/common';
import { prisma } from '../../../prisma';
import cuid from 'cuid';
export const sourcesRouter = router({
save: privateProcedure
.input(
z.object({
id: z.string(),
name: z.string(),
htmlUrl: z.string(),
apiUrl: z.string(),
customPort: z.number(),
customUser: z.string(),
isSystemWide: z.boolean().default(false)
})
)
.mutation(async ({ input, ctx }) => {
let { id, name, htmlUrl, apiUrl, customPort, customUser, isSystemWide } = input;
if (customPort) customPort = Number(customPort);
await prisma.gitSource.update({
where: { id },
data: { name, htmlUrl, apiUrl, customPort, customUser, isSystemWide }
});
}),
newGitHubApp: privateProcedure
.input(
z.object({
id: z.string(),
name: z.string(),
htmlUrl: z.string(),
apiUrl: z.string(),
organization: z.string(),
customPort: z.number(),
isSystemWide: z.boolean().default(false)
})
)
.mutation(async ({ ctx, input }) => {
const { teamId } = ctx.user;
let { id, name, htmlUrl, apiUrl, organization, customPort, isSystemWide } = input;
if (customPort) customPort = Number(customPort);
if (id === 'new') {
const newId = cuid();
await prisma.gitSource.create({
data: {
id: newId,
name,
htmlUrl,
apiUrl,
organization,
customPort,
isSystemWide,
type: 'github',
teams: { connect: { id: teamId } }
}
});
return {
id: newId
};
}
return null;
}),
newGitLabApp: privateProcedure
.input(
z.object({
id: z.string(),
type: z.string(),
name: z.string(),
htmlUrl: z.string(),
apiUrl: z.string(),
oauthId: z.number(),
appId: z.string(),
appSecret: z.string(),
groupName: z.string().optional().nullable(),
customPort: z.number().optional().nullable(),
customUser: z.string().optional().nullable()
})
)
.mutation(async ({ input, ctx }) => {
const { teamId } = ctx.user;
let {
id,
type,
name,
htmlUrl,
apiUrl,
oauthId,
appId,
appSecret,
groupName,
customPort,
customUser
} = input;
if (oauthId) oauthId = Number(oauthId);
if (customPort) customPort = Number(customPort);
const encryptedAppSecret = encrypt(appSecret);
if (id === 'new') {
const newId = cuid();
await prisma.gitSource.create({
data: {
id: newId,
type,
apiUrl,
htmlUrl,
name,
customPort,
customUser,
teams: { connect: { id: teamId } }
}
});
await prisma.gitlabApp.create({
data: {
teams: { connect: { id: teamId } },
appId,
oauthId,
groupName,
appSecret: encryptedAppSecret,
gitSource: { connect: { id: newId } }
}
});
return {
status: 201,
id: newId
};
} else {
await prisma.gitSource.update({
where: { id },
data: { type, apiUrl, htmlUrl, name, customPort, customUser }
});
await prisma.gitlabApp.update({
where: { id },
data: {
appId,
oauthId,
groupName,
appSecret: encryptedAppSecret
}
});
}
}),
delete: privateProcedure
.input(
z.object({
id: z.string()
})
)
.mutation(async ({ input, ctx }) => {
const { id } = input;
const source = await prisma.gitSource.delete({
where: { id },
include: { githubApp: true, gitlabApp: true }
});
if (source.githubAppId) {
await prisma.githubApp.delete({ where: { id: source.githubAppId } });
}
if (source.gitlabAppId) {
await prisma.gitlabApp.delete({ where: { id: source.gitlabAppId } });
}
}),
getSourceById: privateProcedure
.input(
z.object({
id: z.string()
})
)
.query(async ({ input, ctx }) => {
const { id } = input;
const { teamId } = ctx.user;
const settings = await prisma.setting.findFirst({});
if (id === 'new') {
return {
source: {
name: null,
type: null,
htmlUrl: null,
apiUrl: null,
organization: null,
customPort: 22,
customUser: 'git'
},
settings
};
}
const source = await prisma.gitSource.findFirst({
where: {
id,
OR: [
{ teams: { some: { id: teamId === '0' ? undefined : teamId } } },
{ isSystemWide: true }
]
},
include: { githubApp: true, gitlabApp: true }
});
if (!source) {
throw { status: 404, message: 'Source not found.' };
}
if (source?.githubApp?.clientSecret)
source.githubApp.clientSecret = decrypt(source.githubApp.clientSecret);
if (source?.githubApp?.webhookSecret)
source.githubApp.webhookSecret = decrypt(source.githubApp.webhookSecret);
if (source?.githubApp?.privateKey)
source.githubApp.privateKey = decrypt(source.githubApp.privateKey);
if (source?.gitlabApp?.appSecret)
source.gitlabApp.appSecret = decrypt(source.gitlabApp.appSecret);
return {
success: true,
data: {
source,
settings
}
};
})
});