Added MariaDB database

src/lib/components/DatabaseLinks.svelte

@@ -3,6 +3,7 @@
 	import Clickhouse from './svg/databases/Clickhouse.svelte';
 	import CouchDb from './svg/databases/CouchDB.svelte';
 	import MongoDb from './svg/databases/MongoDB.svelte';
+	import MariaDb from './svg/databases/MariaDB.svelte';
 	import MySql from './svg/databases/MySQL.svelte';
 	import PostgreSql from './svg/databases/PostgreSQL.svelte';
 	import Redis from './svg/databases/Redis.svelte';
@@ -17,6 +18,8 @@
 		<MongoDb />
 	{:else if database.type === 'mysql'}
 		<MySql />
+	{:else if database.type === 'mariadb'}
+		<MariaDb />
 	{:else if database.type === 'postgresql'}
 		<PostgreSql />
 	{:else if database.type === 'redis'}

src/lib/components/common.ts

@@ -52,6 +52,12 @@ export const supportedDatabaseTypesAndVersions = [
 		versions: ['5.0', '4.4', '4.2']
 	},
 	{ name: 'mysql', fancyName: 'MySQL', baseImage: 'bitnami/mysql', versions: ['8.0', '5.7'] },
+	{
+		name: 'mariadb',
+		fancyName: 'MariaDB',
+		baseImage: 'bitnami/mariadb',
+		versions: ['10.7', '10.6', '10.5', '10.4', '10.3', '10.2']
+	},
 	{
 		name: 'postgresql',
 		fancyName: 'PostgreSQL',

src/lib/components/svg/databases/MariaDB.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+	export let isAbsolute = false;
+</script>
+
+<svg 
+	xmlns="http://www.w3.org/2000/svg" 
+	viewBox="0 0 293.31054 190.87732" 
+	xml:space="preserve">
+  <path d="m 291.94,0.95396308 a 4.18,4.18 0 0 0 -2.84,-0.95 c -2.83,0 -6.49,1.92000002 -8.46,2.95000002 l -0.78,0.4 a 26.86,26.86 0 0 1 -10.57,2.66 c -3.76,0.12 -7,0.34 -11.22,0.78 -25,2.57 -36.15,21.7299999 -46.89,40.2599999 -5.85,10.08 -11.89,20.55 -20.17,28.55 a 54.4,54.4 0 0 1 -5.45,4.63 c -8.57,6.37 -19.33,10.92 -27.7,14.14 -8.06,3.08 -16.86,5.849997 -25.36,8.529997 -7.79,2.45 -15.14,4.77 -21.9,7.28 -3.05,1.13 -5.64,2 -7.93,2.76 -6.16,2 -10.6,3.53 -17.09,8 -2.53,1.73 -5.07,3.6 -6.79,5 a 71.62,71.62 0 0 0 -13.55,14.27 84.25,84.25 0 0 1 -11.38,13.66 c -1.37,1.34 -3.8,2 -7.44,2 -4.26,0 -9.43,-0.88 -14.9,-1.81 -5.64,-1 -11.47,-1.95 -16.47,-1.95 -4.06,0 -7.17,0.66 -9.49,2 0,0 -3.91,2.28 -5.56,5.23 l 1.62,0.73 a 33.21,33.21 0 0 1 6.92,5 34.72,34.72 0 0 0 7.2,5.12 6.18,6.18 0 0 1 2.22,1.41 c -0.68,1 -1.68,2.29 -2.73,3.67 -5.77,7.55 -9.14,12.32 -7.21,14.92 a 6.07,6.07 0 0 0 3,0.68 c 12.58,0 19.34,-3.27 27.89,-7.41 2.48,-1.2 5,-2.43 8,-3.7 5,-2.17 10.38,-5.63 16.09,-9.29 7.47,-4.87 15.28,-9.87 22.86,-12.28 a 62.3,62.3 0 0 1 19.23,-2.7 c 8,0 16.42,1.07 24.54,2.11 6.05,0.78 12.32,1.58 18.47,1.95 2.39,0.14 4.6,0.21 6.75,0.21 a 78.21,78.21 0 0 0 8.61,-0.45 l 0.69,-0.24 c 4.31,-2.65 6.33,-8.34 8.29,-13.84 1.26,-3.54 2.32,-6.72 4,-8.74 a 2.55,2.55 0 0 1 0.32,-0.27 0.4,0.4 0 0 1 0.49,0.08 c 0,0 0,0.05 0,0.16 -1,21.51 -9.66,35.17 -18.42,47.31 l -5.85,6.27 c 0,0 8.19,0 12.85,-1.8 17,-5.08 29.83,-16.28 39.17,-34.14 a 145.7,145.7 0 0 0 6.17,-14.09 c 0.16,-0.4 1.63,-1.14 1.49,0.93 -0.05,0.61 -0.09,1.29 -0.14,2 v 0 c 0,0.42 0,0.85 -0.08,1.28 -0.24,3 -0.95,9.34 -0.95,9.34 l 5.25,-2.81 c 12.66,-8 22.42,-24.14 29.82,-49.25 3.08,-10.459997 5.34,-20.849997 7.33,-29.999997 2.38,-11 4.43,-20.43 6.78,-24.09 3.69,-5.74 9.32,-9.62 14.77,-13.39 0.74,-0.51 1.49,-1 2.22,-1.54 6.85,-4.81 13.66,-10.36 15.16,-20.71 v -0.23 c 1.09,-7.7199999 0.17,-9.6899999 -0.88,-10.58999992 z" fill="#003545"/>
+</svg>

src/lib/database/common.ts

@@ -127,60 +127,73 @@ export function getServiceImages(type: string): string[] {
 
 export function generateDatabaseConfiguration(database: Database & { settings: DatabaseSettings }):
 	| {
-			volume: string;
+		volume: string;
-			image: string;
+		image: string;
-			ulimits: Record<string, unknown>;
+		ulimits: Record<string, unknown>;
-			privatePort: number;
+		privatePort: number;
-			environmentVariables: {
+		environmentVariables: {
-				MYSQL_DATABASE: string;
+			MYSQL_DATABASE: string;
-				MYSQL_PASSWORD: string;
+			MYSQL_PASSWORD: string;
-				MYSQL_ROOT_USER: string;
+			MYSQL_ROOT_USER: string;
-				MYSQL_USER: string;
+			MYSQL_USER: string;
-				MYSQL_ROOT_PASSWORD: string;
+			MYSQL_ROOT_PASSWORD: string;
-			};
+		};
-	  }
+	}
 	| {
-			volume: string;
+		volume: string;
-			image: string;
+		image: string;
-			ulimits: Record<string, unknown>;
+		ulimits: Record<string, unknown>;
-			privatePort: number;
+		privatePort: number;
-			environmentVariables: {
+		environmentVariables: {
-				MONGODB_ROOT_USER: string;
+			MONGODB_ROOT_USER: string;
-				MONGODB_ROOT_PASSWORD: string;
+			MONGODB_ROOT_PASSWORD: string;
-			};
+		};
-	  }
+	}
 	| {
-			volume: string;
+		volume: string;
-			image: string;
+		image: string;
-			ulimits: Record<string, unknown>;
+		ulimits: Record<string, unknown>;
-			privatePort: number;
+		privatePort: number;
-			environmentVariables: {
+		environmentVariables: {
-				POSTGRESQL_POSTGRES_PASSWORD: string;
+			MARIADB_ROOT_USER: string;
-				POSTGRESQL_USERNAME: string;
+			MARIADB_ROOT_PASSWORD: string;
-				POSTGRESQL_PASSWORD: string;
+			MARIADB_USER: string;
-				POSTGRESQL_DATABASE: string;
+			MARIADB_PASSWORD: string;
-			};
+			MARIADB_DATABASE: string;
-	  }
+		};
+	}
 	| {
-			volume: string;
+		volume: string;
-			image: string;
+		image: string;
-			ulimits: Record<string, unknown>;
+		ulimits: Record<string, unknown>;
-			privatePort: number;
+		privatePort: number;
-			environmentVariables: {
+		environmentVariables: {
-				REDIS_AOF_ENABLED: string;
+			POSTGRESQL_POSTGRES_PASSWORD: string;
-				REDIS_PASSWORD: string;
+			POSTGRESQL_USERNAME: string;
-			};
+			POSTGRESQL_PASSWORD: string;
-	  }
+			POSTGRESQL_DATABASE: string;
+		};
+	}
 	| {
-			volume: string;
+		volume: string;
-			image: string;
+		image: string;
-			ulimits: Record<string, unknown>;
+		ulimits: Record<string, unknown>;
-			privatePort: number;
+		privatePort: number;
-			environmentVariables: {
+		environmentVariables: {
-				COUCHDB_PASSWORD: string;
+			REDIS_AOF_ENABLED: string;
-				COUCHDB_USER: string;
+			REDIS_PASSWORD: string;
-			};
+		};
-	  } {
+	}
+	| {
+		volume: string;
+		image: string;
+		ulimits: Record<string, unknown>;
+		privatePort: number;
+		environmentVariables: {
+			COUCHDB_PASSWORD: string;
+			COUCHDB_USER: string;
+		};
+	} {
 	const {
 		id,
 		dbUser,
@@ -207,6 +220,20 @@ export function generateDatabaseConfiguration(database: Database & { settings: D
 			volume: `${id}-${type}-data:/bitnami/mysql/data`,
 			ulimits: {}
 		};
+	} else if (type === 'mariadb') {
+		return {
+			privatePort: 3306,
+			environmentVariables: {
+				MARIADB_ROOT_USER: rootUser,
+				MARIADB_ROOT_PASSWORD: rootUserPassword,
+				MARIADB_USER: dbUser,
+				MARIADB_PASSWORD: dbUserPassword,
+				MARIADB_DATABASE: defaultDatabase
+			},
+			image: `${baseImage}:${version}`,
+			volume: `${id}-${type}-data:/bitnami/mariadb`,
+			ulimits: {}
+		};
 	} else if (type === 'mongodb') {
 		return {
 			privatePort: 27017,

src/lib/database/databases.ts

@@ -184,6 +184,10 @@ export async function updatePasswordInDb(database, user, newPassword, isRoot) {
 			await asyncExecShell(
 				`DOCKER_HOST=${host} docker exec ${id} mysql -u ${rootUser} -p${rootUserPassword} -e \"ALTER USER '${user}'@'%' IDENTIFIED WITH caching_sha2_password BY '${newPassword}';\"`
 			);
+		} else if (type === 'mariadb') {
+			await asyncExecShell(
+				`DOCKER_HOST=${host} docker exec ${id} mysql -u ${rootUser} -p${rootUserPassword} -e \"SET PASSWORD FOR '${user}'@'%' = PASSWORD('${newPassword}');\"`
+			);
 		} else if (type === 'postgresql') {
 			if (isRoot) {
 				await asyncExecShell(

src/routes/databases/[id]/_Databases/_Databases.svelte

@@ -11,6 +11,7 @@
 
 	import MySql from './_MySQL.svelte';
 	import MongoDb from './_MongoDB.svelte';
+	import MariaDb from './_MariaDB.svelte';
 	import PostgreSql from './_PostgreSQL.svelte';
 	import Redis from './_Redis.svelte';
 	import CouchDb from './_CouchDb.svelte';
@@ -190,6 +191,8 @@
 				<PostgreSql bind:database {isRunning} />
 			{:else if database.type === 'mongodb'}
 				<MongoDb bind:database {isRunning} />
+			{:else if database.type === 'mariadb'}
+				<MariaDb bind:database {isRunning} />
 			{:else if database.type === 'redis'}
 				<Redis bind:database {isRunning} />
 			{:else if database.type === 'couchdb'}

src/routes/databases/[id]/_Databases/_MariaDB.svelte

@@ -0,0 +1,79 @@
+<script>
+	export let database;
+	export let isRunning;
+	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import Explainer from '$lib/components/Explainer.svelte';
+	import { t } from '$lib/translations';
+</script>
+
+<div class="flex space-x-1 py-5 font-bold">
+	<div class="title">MariaDB</div>
+</div>
+<div class="space-y-2 px-10">
+	<div class="grid grid-cols-2 items-center">
+		<label for="defaultDatabase" class="text-base font-bold text-stone-100"
+			>{$t('database.default_database')}</label
+		>
+		<CopyPasswordField
+			required
+			readonly={database.defaultDatabase}
+			disabled={database.defaultDatabase}
+			placeholder="{$t('forms.eg')}: mydb"
+			id="defaultDatabase"
+			name="defaultDatabase"
+			bind:value={database.defaultDatabase}
+		/>
+	</div>
+	<div class="grid grid-cols-2 items-center">
+		<label for="dbUser" class="text-base font-bold text-stone-100">{$t('forms.user')}</label>
+		<CopyPasswordField
+			readonly
+			disabled
+			placeholder={$t('forms.generated_automatically_after_start')}
+			id="dbUser"
+			name="dbUser"
+			value={database.dbUser}
+		/>
+	</div>
+	<div class="grid grid-cols-2 items-center">
+		<label for="dbUserPassword" class="text-base font-bold text-stone-100"
+			>{$t('forms.password')}</label
+		>
+		<CopyPasswordField
+			disabled={!isRunning}
+			readonly={!isRunning}
+			placeholder={$t('forms.generated_automatically_after_start')}
+			isPasswordField
+			id="dbUserPassword"
+			name="dbUserPassword"
+			bind:value={database.dbUserPassword}
+		/>
+		<Explainer text="Could be changed while the database is running." />
+	</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>
+		<CopyPasswordField
+			readonly
+			disabled
+			placeholder={$t('forms.generated_automatically_after_start')}
+			id="rootUser"
+			name="rootUser"
+			value={database.rootUser}
+		/>
+	</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
+		>
+		<CopyPasswordField
+			disabled={!isRunning}
+			readonly={!isRunning}
+			placeholder={$t('forms.generated_automatically_after_start')}
+			isPasswordField
+			id="rootUserPassword"
+			name="rootUserPassword"
+			bind:value={database.rootUserPassword}
+		/>
+		<Explainer text="Could be changed while the database is running." />
+	</div>
+</div>

src/routes/databases/[id]/configuration/type.svelte

@@ -37,6 +37,7 @@
 	import Clickhouse from '$lib/components/svg/databases/Clickhouse.svelte';
 	import CouchDB from '$lib/components/svg/databases/CouchDB.svelte';
 	import MongoDB from '$lib/components/svg/databases/MongoDB.svelte';
+	import MariaDB from '$lib/components/svg/databases/MariaDB.svelte';
 	import MySQL from '$lib/components/svg/databases/MySQL.svelte';
 	import PostgreSQL from '$lib/components/svg/databases/PostgreSQL.svelte';
 	import Redis from '$lib/components/svg/databases/Redis.svelte';
@@ -68,6 +69,8 @@
 						<CouchDB isAbsolute />
 					{:else if type.name === 'mongodb'}
 						<MongoDB isAbsolute />
+					{:else if type.name === 'mariadb'}
+						<MariaDB isAbsolute />
 					{:else if type.name === 'mysql'}
 						<MySQL isAbsolute />
 					{:else if type.name === 'postgresql'}

src/routes/databases/index.svelte

@@ -3,6 +3,7 @@
 	import Clickhouse from '$lib/components/svg/databases/Clickhouse.svelte';
 	import CouchDB from '$lib/components/svg/databases/CouchDB.svelte';
 	import MongoDB from '$lib/components/svg/databases/MongoDB.svelte';
+	import MariaDB from '$lib/components/svg/databases/MariaDB.svelte';
 	import MySQL from '$lib/components/svg/databases/MySQL.svelte';
 	import PostgreSQL from '$lib/components/svg/databases/PostgreSQL.svelte';
 	import Redis from '$lib/components/svg/databases/Redis.svelte';
@@ -66,6 +67,8 @@
 								<MongoDB isAbsolute />
 							{:else if database.type === 'mysql'}
 								<MySQL isAbsolute />
+							{:else if database.type === 'mariadb'}
+								<MariaDB isAbsolute />
 							{:else if database.type === 'postgresql'}
 								<PostgreSQL isAbsolute />
 							{:else if database.type === 'redis'}
@@ -98,6 +101,8 @@
 									<CouchDB isAbsolute />
 								{:else if database.type === 'mongodb'}
 									<MongoDB isAbsolute />
+								{:else if database.type === 'mariadb'}
+									<MariaDB isAbsolute />
 								{:else if database.type === 'mysql'}
 									<MySQL isAbsolute />
 								{:else if database.type === 'postgresql'}