diff --git a/src/lib/components/copyInput.svelte b/src/lib/components/copyInput.svelte
index 507d69fcca..782e89c80c 100644
--- a/src/lib/components/copyInput.svelte
+++ b/src/lib/components/copyInput.svelte
@@ -4,6 +4,8 @@
     import { addNotification } from '$lib/stores/notifications';
 
     export let value: string;
+    export let label: string = null;
+    export let showLabel = false;
 
     let content = 'Click to copy';
 
@@ -21,17 +23,20 @@
 </script>
 
 <div class="input-text-wrapper is-with-end-button">
-    <input {value} type="text" class="input-text" readonly />
-    <button
-        type="button"
-        class="input-button"
-        aria-label="Click to copy."
-        on:click={copy}
-        on:mouseenter={() => setTimeout(() => (content = 'Click to copy'))}
-        use:tooltip={{
-            content,
-            hideOnClick: false
-        }}>
-        <span class="icon-duplicate" aria-hidden="true" />
-    </button>
+    <label class:u-hide={!showLabel} class="label" for={label}>{label}</label>
+    <div class="input-text-wrapper">
+        <input {value} id={label} type="text" class="input-text" readonly />
+        <button
+            type="button"
+            class="input-button"
+            aria-label="Click to copy."
+            on:click={copy}
+            on:mouseenter={() => setTimeout(() => (content = 'Click to copy'))}
+            use:tooltip={{
+                content,
+                hideOnClick: false
+            }}>
+            <span class="icon-duplicate" aria-hidden="true" />
+        </button>
+    </div>
 </div>
diff --git a/src/lib/stores/project-services.ts b/src/lib/stores/project-services.ts
new file mode 100644
index 0000000000..6f4a8cb0d7
--- /dev/null
+++ b/src/lib/stores/project-services.ts
@@ -0,0 +1,117 @@
+import { writable } from 'svelte/store';
+import type { Models } from '@aw-labs/appwrite-console';
+
+export type Service = {
+    label: string;
+    method: string;
+    value: boolean | null;
+};
+
+function createServices() {
+    const { subscribe, set } = writable({
+        list: [
+            {
+                label: 'Account',
+                method: 'account',
+                value: null
+            },
+            {
+                label: 'Avatars',
+                method: 'avatars',
+                value: null
+            },
+            {
+                label: 'Databases',
+                method: 'databases',
+                value: null
+            },
+            {
+                label: 'Functions',
+                method: 'functions',
+                value: null
+            },
+            {
+                label: 'Health',
+                method: 'health',
+                value: null
+            },
+            {
+                label: 'Locale',
+                method: 'locale',
+                value: null
+            },
+            {
+                label: 'Storage',
+                method: 'storage',
+                value: null
+            },
+            {
+                label: 'Teams',
+                method: 'teams',
+                value: null
+            },
+            {
+                label: 'Users',
+                method: 'users',
+                value: null
+            }
+        ]
+    });
+
+    return {
+        subscribe,
+        set,
+        load: (project: Models.Project) => {
+            const list = [
+                {
+                    label: 'Account',
+                    method: 'account',
+                    value: project.serviceStatusForAccount
+                },
+                {
+                    label: 'Avatars',
+                    method: 'avatars',
+                    value: project.serviceStatusForAvatars
+                },
+                {
+                    label: 'Databases',
+                    method: 'databases',
+                    value: project.serviceStatusForDatabases
+                },
+                {
+                    label: 'Functions',
+                    method: 'functions',
+                    value: project.serviceStatusForFunctions
+                },
+                {
+                    label: 'Health',
+                    method: 'health',
+                    value: project.serviceStatusForHealth
+                },
+                {
+                    label: 'Locale',
+                    method: 'locale',
+                    value: project.serviceStatusForLocale
+                },
+                {
+                    label: 'Storage',
+                    method: 'storage',
+                    value: project.serviceStatusForStorage
+                },
+                {
+                    label: 'Teams',
+                    method: 'teams',
+                    value: project.serviceStatusForTeams
+                },
+                {
+                    label: 'Users',
+                    method: 'users',
+                    value: project.serviceStatusForUsers
+                }
+            ];
+            set({ list });
+        }
+    };
+}
+
+export const services = createServices();
diff --git a/src/routes/console/project-[project]/settings/__layout.svelte b/src/routes/console/project-[project]/settings/__layout.svelte
index 5b0ab13eaf..133d65fbc9 100644
--- a/src/routes/console/project-[project]/settings/__layout.svelte
+++ b/src/routes/console/project-[project]/settings/__layout.svelte
@@ -29,10 +29,6 @@
                 {
                     href: `${path}/domains`,
                     title: 'Custom Domains'
-                },
-                {
-                    href: `${path}/members`,
-                    title: 'Members'
                 }
             ]
         });
diff --git a/src/routes/console/project-[project]/settings/_deleteProject.svelte b/src/routes/console/project-[project]/settings/_deleteProject.svelte
new file mode 100644
index 0000000000..c57d5bf127
--- /dev/null
+++ b/src/routes/console/project-[project]/settings/_deleteProject.svelte
@@ -0,0 +1,70 @@
+<script lang="ts">
+    import { goto } from '$app/navigation';
+    import { base } from '$app/paths';
+    import { page } from '$app/stores';
+    import { Modal } from '$lib/components';
+    import { Button, Form, FormList, InputPassword, InputText } from '$lib/elements/forms';
+    import { addNotification } from '$lib/stores/notifications';
+    import { sdkForConsole } from '$lib/stores/sdk';
+    import { onMount } from 'svelte';
+    import { project } from '../store';
+
+    export let showDelete = false;
+
+    const projectId = $page.params.project;
+    let password: string = null;
+    let name: string = null;
+
+    onMount(async () => {
+        if (projectId !== $project.$id) await project.load(projectId);
+    });
+
+    const handleDelete = async () => {
+        try {
+            await sdkForConsole.projects.delete($project.$id, password);
+            showDelete = false;
+            addNotification({
+                type: 'success',
+                message: `${$project.name} has been deleted`
+            });
+            await goto(`${base}/console`);
+        } catch (error) {
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+        }
+    };
+</script>
+
+<Form on:submit={handleDelete}>
+    <Modal bind:show={showDelete} warning>
+        <svelte:fragment slot="header">Delete Project</svelte:fragment>
+        <p>
+            <b>This project will be deleted</b>, along with all of its metadata, stats, and other
+            resources. <b>This action is irreversible</b>.
+        </p>
+
+        <FormList>
+            <InputText
+                label={`Enter "${$project.name}" to continue`}
+                placeholder="Enter name"
+                id="name"
+                autofocus
+                required
+                bind:value={name} />
+            <InputPassword
+                label="To verify, enter your password"
+                placeholder="Enter password"
+                id="password"
+                required
+                showPasswordButton={true}
+                bind:value={password} />
+        </FormList>
+        <svelte:fragment slot="footer">
+            <Button text on:click={() => (showDelete = false)}>Cancel</Button>
+            <Button disabled={!name || !password || name !== $project.name} secondary submit
+                >Delete</Button>
+        </svelte:fragment>
+    </Modal>
+</Form>
diff --git a/src/routes/console/project-[project]/settings/index.svelte b/src/routes/console/project-[project]/settings/index.svelte
index d2fb3e02fa..6638570309 100644
--- a/src/routes/console/project-[project]/settings/index.svelte
+++ b/src/routes/console/project-[project]/settings/index.svelte
@@ -1,15 +1,55 @@
 <script lang="ts">
-    import { Card } from '$lib/components';
-    import { Button, Form, FormItem, InputText } from '$lib/elements/forms';
-    import { Container } from '$lib/layout';
-    import { addNotification } from '$lib/stores/notifications';
     import { sdkForConsole } from '$lib/stores/sdk';
+    import { onMount } from 'svelte';
+    import { page } from '$app/stores';
+    import { toLocaleDateTime } from '$lib/helpers/date';
+    import { addNotification } from '$lib/stores/notifications';
     import { project } from '../store';
+    import { services, type Service } from '$lib/stores/project-services';
+    import { CardGrid, CopyInput, Box } from '$lib/components';
+    import { Button, Form, FormList, InputText, InputSwitch } from '$lib/elements/forms';
+    import { Container } from '$lib/layout';
+    import Delete from './_deleteProject.svelte';
+
+    let name: string = null;
+    let showDelete = false;
+    const endpoint = sdkForConsole.client.config.endpoint;
+
+    onMount(async () => {
+        await project.load($page.params.project);
+
+        name ??= $project.name;
+    });
+
+    const updateName = async () => {
+        try {
+            await sdkForConsole.projects.update($project.$id, name);
+            $project.name = name;
+            addNotification({
+                type: 'success',
+                message: 'Project name has been updated'
+            });
+        } catch (error) {
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+        }
+    };
 
-    const update = async () => {
+    const serviceUpdate = async (service: Service) => {
         try {
-            await sdkForConsole.projects.update($project.$id, $project.name);
-            await project.load($project.$id);
+            await sdkForConsole.projects.updateServiceStatus(
+                $project.$id,
+                service.method,
+                service.value
+            );
+            addNotification({
+                type: 'success',
+                message: `${service.label} service has been ${
+                    service.value ? 'enabled' : 'disabled'
+                }`
+            });
         } catch (error) {
             addNotification({
                 type: 'error',
@@ -17,18 +57,94 @@
             });
         }
     };
+
+    $: services.load($project);
 </script>
 
 <Container>
-    <h1>Overview</h1>
     {#if $project}
-        <Card>
-            <Form on:submit={update}>
-                <InputText id="name" label="Name" bind:value={$project.name} required />
-                <FormItem>
-                    <Button submit>Update</Button>
-                </FormItem>
-            </Form>
-        </Card>
+        <Form on:submit={updateName}>
+            <CardGrid>
+                <h6 class="heading-level-7">Update Name</h6>
+
+                <svelte:fragment slot="aside">
+                    <FormList>
+                        <InputText
+                            id="name"
+                            label="Name"
+                            bind:value={name}
+                            required
+                            placeholder="Enter name" />
+                    </FormList>
+                </svelte:fragment>
+
+                <svelte:fragment slot="actions">
+                    <Button disabled={name === $project.name} submit>Update</Button>
+                </svelte:fragment>
+            </CardGrid>
+        </Form>
+
+        <CardGrid>
+            <h6 class="heading-level-7">API Credentials</h6>
+            <p class="text">
+                Access Appwrite services using your API Endpoint and Project ID. You can connect
+                Appwrite to your applications and server-side code by <a href="#/" class="link"
+                    >integrating a new platform</a>
+                or
+                <a href="#/" class="link">creating an API key</a>.
+            </p>
+            <svelte:fragment slot="aside">
+                <FormList>
+                    <CopyInput label="Project ID" showLabel={true} value={$project.$id} />
+                    <CopyInput label="API Endpoint" showLabel={true} value={endpoint} />
+                </FormList>
+            </svelte:fragment>
+        </CardGrid>
+
+        <CardGrid>
+            <h6 class="heading-level-7">Services</h6>
+            <p class="text">Choose services you wish to enable or disable.</p>
+            <svelte:fragment slot="aside">
+                <FormList>
+                    <form class="form">
+                        <ul class="form-list is-multiple">
+                            {#each $services.list as service}
+                                <InputSwitch
+                                    label={service.label}
+                                    id={service.method}
+                                    bind:value={service.value}
+                                    on:change={() => {
+                                        serviceUpdate(service);
+                                    }} />
+                            {/each}
+                        </ul>
+                    </form>
+                </FormList>
+            </svelte:fragment>
+        </CardGrid>
+
+        <CardGrid>
+            <div>
+                <h6 class="heading-level-7">Delete Project</h6>
+            </div>
+            <p>
+                The project will be permanently deleted, including all the metadata, resources and
+                stats within it. This action is irreversible.
+            </p>
+            <svelte:fragment slot="aside">
+                <Box>
+                    <svelte:fragment slot="title">
+                        <h6 class="u-bold">{$project.name}</h6>
+                    </svelte:fragment>
+                    <p>Last update: {toLocaleDateTime($project.$updatedAt)}</p>
+                </Box>
+            </svelte:fragment>
+
+            <svelte:fragment slot="actions">
+                <Button secondary on:click={() => (showDelete = true)}>Delete</Button>
+            </svelte:fragment>
+        </CardGrid>
     {/if}
 </Container>
+
+<Delete bind:showDelete />
diff --git a/src/routes/console/project-[project]/settings/members.svelte b/src/routes/console/project-[project]/settings/members.svelte
deleted file mode 100644
index da6770b552..0000000000
--- a/src/routes/console/project-[project]/settings/members.svelte
+++ /dev/null
@@ -1,50 +0,0 @@
-<script lang="ts">
-    import { List, ListItem } from '$lib/components';
-    import { Pill } from '$lib/elements';
-    import { Button } from '$lib/elements/forms';
-    import { Container } from '$lib/layout';
-    import { sdkForConsole } from '$lib/stores/sdk';
-    import { project } from '../store';
-
-    $: request = sdkForConsole.teams.getMemberships($project?.teamId ?? undefined);
-</script>
-
-<Container>
-    <h1>Members</h1>
-    {#await request}
-        <div aria-busy="true" />
-    {:then response}
-        {#if response}
-            <List>
-                {#each response.memberships as membership}
-                    <ListItem
-                        avatar={sdkForConsole.avatars
-                            .getInitials(membership.userName, 64, 64)
-                            .toString()}>
-                        <svelte:fragment slot="header">
-                            <h2 class="sessions-item-title">
-                                <span class="text">
-                                    {membership.userName}
-                                </span>
-                            </h2>
-                            {#each membership.roles as role}
-                                <Pill>{role}</Pill>
-                            {/each}
-                            {#if !membership.confirm}
-                                <Pill danger>Pending Approval</Pill>
-                            {/if}
-                        </svelte:fragment>
-                        <svelte:fragment slot="info">
-                            {membership.userEmail}
-                        </svelte:fragment>
-                        <svelte:fragment slot="action">
-                            <Button danger>Remove</Button>
-                        </svelte:fragment>
-                    </ListItem>
-                {:else}
-                    <p>No sessions available.</p>
-                {/each}
-            </List>
-        {/if}
-    {/await}
-</Container>