Merge pull request #1582 from appwrite/fix-sites-wizard-button

Fix: interaction not working due to a crash

CONTRIBUTING.md

@@ -108,9 +108,9 @@ pnpm run lint
 
 Diagnostic tool that checks for the following:
 
--   Unused CSS
--   Svelte A11y hints
--   TypeScript compiler errors
+- Unused CSS
+- Svelte A11y hints
+- TypeScript compiler errors
 
 ```bash
 pnpm run check
@@ -130,11 +130,11 @@ doc-548-submit-a-pull-request-section-to-contribution-guide
 
 When `TYPE` can be:
 
--   **feat** - is a new feature
--   **doc** - documentation only changes
--   **cicd** - changes related to CI/CD system
--   **fix** - a bug fix
--   **refactor** - code change that neither fixes a bug nor adds a feature
+- **feat** - is a new feature
+- **doc** - documentation only changes
+- **cicd** - changes related to CI/CD system
+- **fix** - a bug fix
+- **refactor** - code change that neither fixes a bug nor adds a feature
 
 **All PRs must include a commit message with a description of the changes made!**
 
@@ -175,12 +175,12 @@ $ git push origin [name_of_your_new_branch]
 
 Before committing always make sure to run all available tools to improve the codebase:
 
--   Formatter
-    -   `pnpm run format`
--   Tests
-    -   `pnpm test`
--   Diagnostics
-    -   `pnpm run check`
+- Formatter
+    - `pnpm run format`
+- Tests
+    - `pnpm test`
+- Diagnostics
+    - `pnpm run check`
 
 ### Performance
 
@@ -188,9 +188,9 @@ Page load times are a key consideration for users of all browsers and device typ
 
 There are some general things we can do in front-end development:
 
--   Minimize HTTP requests
--   Minimize blocking – content should be readable before client-side processing
--   Lazy load "supplementary" content, especially images
+- Minimize HTTP requests
+- Minimize blocking – content should be readable before client-side processing
+- Lazy load "supplementary" content, especially images
 
 ### Don't Repeat Yourself (DRY)
 
@@ -202,12 +202,12 @@ If you stick to this principle, you will ensure that you will only ever need to
 
 Separate _structure_ from _presentation_ from _behavior_ to aid maintainability and understanding.
 
--   Keep CSS (presentation), JS (behavior) and HTML (structure) in the same respective Svelte component
--   Avoid writing inline CSS or Javascript in HTML
--   Avoid writing CSS or HTML in Javascript
--   Don't choose HTML elements to imply style
--   Where appropriate, use CSS or Svelte rather than Javascript for animations and transitions
--   Try to use templates when defining markup in Javascript
+- Keep CSS (presentation), JS (behavior) and HTML (structure) in the same respective Svelte component
+- Avoid writing inline CSS or Javascript in HTML
+- Avoid writing CSS or HTML in Javascript
+- Don't choose HTML elements to imply style
+- Where appropriate, use CSS or Svelte rather than Javascript for animations and transitions
+- Try to use templates when defining markup in Javascript
 
 ### Write code to be read
 

README.md

@@ -10,8 +10,8 @@
 
 Appwrite Console has been built with the following frameworks:
 
--   [Svelte](https://svelte.dev/)
--   [Svelte Kit](https://kit.svelte.dev/)
+- [Svelte](https://svelte.dev/)
+- [Svelte Kit](https://kit.svelte.dev/)
 
 ## Developer Experience
 

src/routes/(console)/project-[project]/sites/(components)/logs.svelte

@@ -81,20 +81,21 @@
                   lightCyan: [133, 219, 216]
               };
 
-    function formatLogs(logs: { timestamp: string; content: string }[]) {
+    // TODO: Fix the buildLogs to return object, currently its a string.
+    function formatLogs(logs: { timestamp: string; content: string }[] = []) {
         let output = '';
-        const sum = logs.map((n) => n.content).join('');
+        const sum = logs.map((n) => `${n.timestamp} ${n.content}`).join('\n');
         const iterator = ansicolor.parse(sum);
-        for (const element of iterator) {
+        for (const element of iterator.spans) {
             if (element.color && !element.color.name) output += `<span>${element.text}</span>`;
-            else output += `<span style="${element.css}">${element.text}</span>`;
+            else output += `${element.text}`;
         }
         return output;
     }
 
     async function cancelDeployment() {
         try {
-            await sdk.forProject.functions.updateDeploymentBuild(
+            await sdk.forProject.sites.updateDeploymentBuild(
                 deployment.resourceId,
                 deployment.$id
             );
@@ -133,7 +134,9 @@
             </Layout.Stack>
         </div>
     </Layout.Stack>
-    <pre><code>{@html formatLogs(buildLogs)}</code></pre>
+    <pre>
+        <code>{formatLogs(buildLogs)}</code>
+    </pre>
     <!-- <div>
                         <Code lang="text" code={buildLogs.replace(/\\n/g, '\n')} />
                     </div> -->

src/routes/(console)/project-[project]/sites/create-site/deploying/+page.svelte

@@ -8,8 +8,6 @@
     import Logs from '../../(components)/logs.svelte';
 
     export let data;
-
-    $: console.log(data.deployment);
 </script>
 
 <Wizard

src/routes/(console)/project-[project]/sites/site-[site]/logs/+page.ts

@@ -21,12 +21,16 @@ export const load = async ({ params, depends, url, route, parent }) => {
         limit,
         query,
         search,
-        logs: await sdk.forProject.sites.listLogs(params.site, [
-            Query.limit(limit),
-            Query.offset(offset),
-            Query.orderDesc(''),
-            ...parsedQueries.values()
-        ], search),
-        site,
+        logs: await sdk.forProject.sites.listLogs(
+            params.site,
+            [
+                Query.limit(limit),
+                Query.offset(offset),
+                Query.orderDesc(''),
+                ...parsedQueries.values()
+            ],
+            search
+        ),
+        site
     };
 };