ulivargas/classroomio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: move away from carbon components and TinyMCE (#597)

Browse Source 
* feat: remove tinymce & replace org sidebar

* chore: PR Fixes

* chore: move ui font into src dir

* remove files in vite config

* use google font import for loading font

* remove custom font

* more fonts update

* remove font bold

* more removals of font bold

* fix import

* checkpoint

* chore: checkpoint (add course & lms shadcn sidebar)

* minor css improvements and try out font sans

* chore: replace carbon components with shadcn's

* chore: replace carbon components with shadcn _ v3

* chore: ui fixes & storybook update

* feat: UI cleanup

* fix: quick ui fixes

* chore: update pnpm-lock.yaml with new dependencies and versions; fix output.css formatting

* chore: add isloading to button

* feat: add loading state to button stories

* chore: feedback fixes

* fix: feedback fixes

* chore: remove console

* fix: PR comments

* fix: PR comments

---------

Co-authored-by: Rotimi Best <[email protected]>
This commit is contained in:
Adeyemi Adetunji
2025-11-21 12:18:04 +01:00
committed by GitHub
co-authored by Rotimi Best
parent 2145782385
commit cbf6ae7e63
499 changed files with 19708 additions and 15603 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/dashboard/src/lib/components/Org/Settings/index.svelte
+38 -40
View File
@@ -1,14 +1,16 @@
<script lang="ts">
import { page } from '$app/state';
import { Tabs, Tab, TabContent } from 'carbon-components-svelte';
import * as Tabs from '@cio/ui/base/tabs';
import Profile from './Profile.svelte';
import LandingpageSettings from './LandingpageSettings.svelte';
// import Account from './Account.svelte';
import OrgSettings from './OrgSettings.svelte';
import Billing from './Billing.svelte';
import { goto } from '$app/navigation';
import { isOrgAdmin } from '$lib/utils/store/org';
import OrgSettings from './OrgSettings.svelte';
import Integrations from './Integrations.svelte';
import LandingpageSettings from './LandingpageSettings.svelte';
// import Account from './Account.svelte';
import { isOrgAdmin } from '$lib/utils/store/org';
import { t } from '$lib/utils/functions/translations';
interface TabItem {
@@ -59,45 +61,41 @@
disabled: false
}
]);
let selected = $derived(getSelectedByTab(tabs, tabKey));
function getSelectedByTab(_tabs: TabItem[], tabKey = '') {
const tab = _tabs.find((t) => t.tabKey === tabKey);
return tab ? tab.key : 0;
}
function onTabChange(e: CustomEvent<number>) {
const key = e.detail;
const tab = tabs.find((t) => t.key === key);
function onTabChange(value: string) {
const tab = tabs.find((t) => t.tabKey === value);
if (tab) {
goto(tab.href);
}
}
</script>
<Tabs autoWidth bind:selected on:change={onTabChange}>
{#each tabs as tab}
<Tab label={tab.label} href={tab.href} disabled={tab.disabled} />
{/each}
<!-- <Tab label="Account" /> -->
<svelte:fragment slot="content">
<TabContent class="w-full p-0">
<Profile />
</TabContent>
<!-- <TabContent>
<Account />
</TabContent> -->
<TabContent class="w-full p-0">
<OrgSettings />
</TabContent>
<TabContent class="w-full p-0">
<LandingpageSettings />
</TabContent>
<TabContent class="w-full p-0">
<Billing />
</TabContent>
<TabContent class="w-full p-0">
<Integrations />
</TabContent>
</svelte:fragment>
</Tabs>
<Tabs.Root value={tabKey} onValueChange={onTabChange} class="w-full p-0">
<Tabs.List class="w-full">
{#each tabs as tab}
<Tabs.Trigger value={tab.tabKey} disabled={tab.disabled}>
{tab.label}
</Tabs.Trigger>
{/each}
</Tabs.List>
<Tabs.Content value="" class="w-full p-0">
<Profile />
</Tabs.Content>
<Tabs.Content value="org" class="w-full p-0">
<OrgSettings />
</Tabs.Content>
<Tabs.Content value="landingpage" class="w-full p-0">
<LandingpageSettings />
</Tabs.Content>
<Tabs.Content value="billing" class="w-full p-0">
<Billing />
</Tabs.Content>
<Tabs.Content value="integrations" class="w-full p-0">
<Integrations />
</Tabs.Content>
</Tabs.Root>