feat: fill variables values

Author: ArmanNik

src/routes/(console)/project-[project]/sites/create-site/templates/template-[template]/configuration.svelte

@@ -11,7 +11,10 @@
     import type { Models } from '@appwrite.io/console';
     import { Fieldset, Layout, Popover, Icon, Accordion } from '@appwrite.io/pink-svelte';
     import { IconInfo } from '@appwrite.io/pink-icons-svelte';
-    import { type SvelteComponent } from 'svelte';
+    import { onMount, type SvelteComponent } from 'svelte';
+    import { getApiEndpoint } from '$lib/stores/sdk';
+    import { page } from '$app/stores';
+    import { project } from '$routes/(console)/project-[project]/store';
 
     export let variables: Partial<Models.TemplateVariable>[] = [];
     export let templateVariables: Models.TemplateVariable[] = [];
@@ -29,6 +32,17 @@
         { requiredVariables: [], optionalVariables: [] }
     );
 
+    variables.map((variable) => {
+        if (variable.value === '{apiEndpoint}') {
+            variable.value = getApiEndpoint();
+        } else if (variable.value === '{projectId}') {
+            variable.value = $page.params.project;
+        } else if (variable.value === '{projectName}') {
+            variable.value = $project.name;
+        } else return variable;
+    });
+    variables = [...variables];
+
     function selectComponent(variableType: string): typeof SvelteComponent<unknown> {
         switch (variableType) {
             case 'password':