Skip to content

Studio fixes & improvements #2676

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ItzNotABug merged 3 commits into from
Dec 7, 2025
Merged

Studio fixes & improvements #2676

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
1c4cacd
add: show invite if members addition is supported.
ItzNotABug Dec 6, 2025
1c4a03e
add: imagine specific credits usage.
ItzNotABug Dec 6, 2025
f358bb4
lint.
ItzNotABug Dec 7, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
},
"dependencies": {
"@ai-sdk/svelte": "^1.1.24",
"@appwrite.io/console": "https://pkg.vc/-/@appwrite/@appwrite.io/console@4838219",
"@appwrite.io/console": "https://pkg.vc/-/@appwrite/@appwrite.io/console@f3cd1df",
"@appwrite.io/pink-icons": "0.25.0",
"@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8",
"@appwrite.io/pink-legacy": "^1.0.3",
Expand Down
10 changes: 5 additions & 5 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

31 changes: 23 additions & 8 deletions src/routes/(console)/create-organization/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
import { Button, Form, InputTags, InputText } from '$lib/elements/forms';
import { Wizard } from '$lib/layout';
import type { Coupon } from '$lib/sdk/billing';
import { isOrganization, tierToPlan } from '$lib/stores/billing';
import { isOrganization, plansInfo, tierToPlan } from '$lib/stores/billing';
import { addNotification } from '$lib/stores/notifications';
import type { OrganizationError, Organization } from '$lib/stores/organization';
import { sdk } from '$lib/stores/sdk';
Expand Down Expand Up @@ -42,6 +42,16 @@
let billingBudget: number;
let showCreditModal = false;

// check if the plan allows multiple members
$: planDetails = $plansInfo?.get(selectedPlan);
$: seatsAddon = planDetails?.addons?.seats;
$: canAddMembers =
!seatsAddon || (seatsAddon.supported ?? false) || (seatsAddon.limit ?? 0) > 1;

$: if (!canAddMembers && collaborators.length > 0) {
collaborators = [];
}

afterNavigate(({ from }) => {
previousPage = from?.url?.pathname || previousPage;
});
Expand Down Expand Up @@ -193,6 +203,7 @@
id="name"
required />
</Fieldset>

<Fieldset legend="Select plan">
<Layout.Stack>
<Typography.Text>
Expand All @@ -210,6 +221,7 @@
bind:billingPlan={selectedPlan} />
</Layout.Stack>
</Fieldset>

{#if !isFreePlan(selectedPlan)}
<Fieldset legend="Payment">
<Layout.Stack gap="s" alignItems="flex-start">
Expand All @@ -236,13 +248,16 @@
{/if}
</Layout.Stack>
</Fieldset>
<Fieldset legend="Invite members">
<InputTags
bind:tags={collaborators}
label="Invite members by email"
placeholder="Enter email address(es)"
id="members" />
</Fieldset>

{#if canAddMembers}
<Fieldset legend="Invite members">
<InputTags
bind:tags={collaborators}
label="Invite members by email"
placeholder="Enter email address(es)"
id="members" />
</Fieldset>
{/if}
{/if}
</Layout.Stack>
</Form>
Expand Down
27 changes: 20 additions & 7 deletions src/routes/(console)/organization-[organization]/change-plan/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -305,6 +305,16 @@
$: currentPlanGroup = $plansInfo?.get($organization?.billingPlan)?.group;
$: isSameGroupDowngrade =
currentPlanGroup && selectedPlanGroup && currentPlanGroup === selectedPlanGroup;

// check if the plan allows multiple members
$: planDetails = $plansInfo?.get(selectedPlan);
$: seatsAddon = planDetails?.addons?.seats;
$: canAddMembers =
!seatsAddon || (seatsAddon.supported ?? false) || (seatsAddon.limit ?? 0) > 1;

$: if (!canAddMembers && collaborators.length > 0) {
collaborators = [];
}
</script>

<svelte:head>
Expand Down Expand Up @@ -439,14 +449,17 @@
</Fieldset>
{/await}

<Fieldset legend="Invite members">
<InputTags
bind:tags={collaborators}
label="Invite members by email"
placeholder="Enter email address(es)"
id="members" />
</Fieldset>
{#if canAddMembers}
<Fieldset legend="Invite members">
<InputTags
bind:tags={collaborators}
label="Invite members by email"
placeholder="Enter email address(es)"
id="members" />
</Fieldset>
{/if}
{/if}

{#if isDowngrade && isFreePlan(selectedPlan) && !data.hasFreeOrgs}
<Fieldset legend="Feedback">
<Layout.Stack gap="xl">
Expand Down
53 changes: 51 additions & 2 deletions src/routes/(console)/project-[region]-[project]/settings/usage/[[invoice]]/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,9 @@
import { Accordion, Icon, Layout, Link, Table, Typography } from '@appwrite.io/pink-svelte';
import { IconChartSquareBar } from '@appwrite.io/pink-icons-svelte';
import { page } from '$app/state';
import { isFreePlan } from '$lib/helpers/billing.js';
import { isFreePlan, isPaidPlan } from '$lib/helpers/billing.js';
import { resolvedProfile } from '$lib/profiles/index.svelte';
import { Platform } from '@appwrite.io/console';

export let data;

Expand Down Expand Up @@ -67,7 +69,7 @@
on:click={() => ($showUsageRatesModal = true)}
>Learn more about plan usage limits.</Link.Button>
</p>
{:else if $organization.billingPlan === BillingPlan.PRO}
{:else if isPaidPlan($organization.billingPlan)}
<p class="text">
On the Pro plan, you'll be charged only for any usage that exceeds the thresholds
per resource listed below. <Link.Button
Expand All @@ -83,6 +85,53 @@
</p>
{/if}
</div>

{#if resolvedProfile.platform === Platform.Imagine}
<CardGrid>
<svelte:fragment slot="title">Imagine Credits</svelte:fragment>
Total Imagine credits consumed across your project. Resets at the start of each billing cycle.
<svelte:fragment slot="aside">
{#if data.usage.imagineCredits}
{@const creditsTotal = data.usage.imagineCredits.reduce(
(sum, item) => sum + item.value,
0
)}
<Layout.Stack gap="s" direction="row" alignItems="baseline">
<Typography.Title>
{formatNumberWithCommas(creditsTotal)}
</Typography.Title>
<Typography.Text>Credits</Typography.Text>
</Layout.Stack>
{#if data.usage.imagineCredits.length > 0}
<BarChart
options={{
yAxis: {
axisLabel: {
formatter: formatNum
}
}
}}
series={[
{
name: 'Credits',
data: [
...data.usage.imagineCredits.map((e) => [e.date, e.value])
]
}
]} />
{/if}
{:else}
<Card isDashed>
<Layout.Stack gap="xs" alignItems="center" justifyContent="center">
<Icon icon={IconChartSquareBar} size="l" />
<Typography.Text variant="m-600">No data to show</Typography.Text>
</Layout.Stack>
</Card>
{/if}
</svelte:fragment>
</CardGrid>
{/if}

<CardGrid>
<svelte:fragment slot="title">Bandwidth</svelte:fragment>
Calculated for all bandwidth used across your project. Resets at the start of each billing cycle.
Expand Down
Loading