studiocms 0.1.0-beta.10

package/dist/routes/dashboard/content-management/createpage.astro

@@ -0,0 +1,86 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import TinyMDE from '../../../components/dashboard/component-scripts/TinyMDE.astro';
+import CreatePage from '../../../components/dashboard/islands/content-mgmt/CreatePage.astro';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement isNewPage {lang} />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader {lang} createPage />
+  </div>
+
+  <CreatePage {lang} />
+
+  <TinyMDE />
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+    } from 'studiocms:i18n/client';
+  
+    let lang = defaultLang;
+
+    const currentPage = '@studiocms/dashboard:content-index';
+
+    $localeSettings.subscribe((locale) => {
+      lang = locale || defaultLang;
+    });
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+      
+    i18n.subscribe(comp => {
+      documentUpdater(comp, lang)
+    });
+</script>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+  .placeholder-info {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 40vh;
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 30vh;
+    z-index: -1;
+
+    p {
+      font-size: 1.25rem;
+      color: hsl(var(--text-muted));
+    }
+  }
+</style>

package/dist/routes/dashboard/content-management/diff.astro

@@ -0,0 +1,135 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import { StudioCMSRoutes } from 'studiocms:lib';
+import studioCMS_SDK from 'studiocms:sdk';
+import studioCMS_SDK_Cache from 'studiocms:sdk/cache';
+import { Button } from 'studiocms:ui/components';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+const td = useTranslations(lang, '@studiocms/dashboard:content-diff');
+
+const urlParams = Astro.url.searchParams;
+const diffId = urlParams.get('diff');
+
+if (!diffId) {
+	return new Response(null, { status: 404 });
+}
+
+const diff = await studioCMS_SDK.diffTracking.get.withHtml(diffId);
+
+if (!diff) {
+	return new Response(null, { status: 404 });
+}
+
+const { data: page } = await studioCMS_SDK_Cache.GET.page.byId(diff.pageId);
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+    <div slot="double-sidebar" class="inner-sidebar-container">
+        <div class="sidebar-links-container">
+        <InnerSidebarElement {lang} />
+        </div>
+    </div>
+
+    <div slot="header">
+        <PageHeader {lang} />
+        <span style="width: 100%; display: flex; padding: 1rem 0;">
+            <Button 
+            variant="outlined" 
+            color="primary" 
+            size="sm"
+            href={`${StudioCMSRoutes.mainLinks.contentManagementEdit}?edit=${page.id}`}
+            ><t-content-diff key="view-page">{td('view-page')}</t-content-diff></Button>
+        </span>
+    </div>
+
+    <h4>
+      <t-content-diff key="page-metadata">{td('page-metadata')}</t-content-diff>
+    </h4>
+
+    <div set:html={diff.metadataDiffHtml} class="diff-screen"></div>
+
+    <h4>
+      <t-content-diff key="page-content">{td('page-content')}</t-content-diff>
+    </h4>
+
+    <div set:html={diff.contentDiffHtml} class="diff-screen"></div>
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+        makeTranslation,
+    } from 'studiocms:i18n/client';
+  
+    let lang = defaultLang;
+
+    const currentPage = '@studiocms/dashboard:content-index';
+    const currentDiffPage = '@studiocms/dashboard:content-diff';
+
+    $localeSettings.subscribe((locale) => {
+      lang = locale || defaultLang;
+    });
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+    const i18nDiff = $i18n(currentDiffPage, baseTranslation[currentDiffPage]);
+      
+    i18n.subscribe(comp => {
+      documentUpdater(comp, lang)
+    });
+    
+    if (!customElements.get('t-content-diff')) {
+        customElements.define('t-content-diff', makeTranslation(currentPage, i18nDiff));
+    }
+</script>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+  h4 {
+    margin: 1rem auto;
+    padding-left: 2rem;
+  }
+
+  .diff-screen {
+    margin: 0 auto;
+    width: 100%;
+    max-width: 1100px;
+  }
+
+  @media screen and (max-width: 1500px) {
+    .diff-screen {
+        max-width: 800px;
+    }
+  }
+
+  @media screen and (max-width: 1380px) {
+    .diff-screen {
+        max-width: 600px;
+    }
+  }
+
+</style>

package/dist/routes/dashboard/content-management/editfolder.astro

@@ -0,0 +1,67 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import EditFolder from '../../../components/dashboard/islands/content-mgmt/EditFolder.astro';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement {lang} />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader {lang} editFolder />
+  </div>
+
+  <EditFolder {lang} />
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+    } from 'studiocms:i18n/client';
+  
+    let lang = defaultLang;
+
+    const currentPage = '@studiocms/dashboard:content-index';
+
+    $localeSettings.subscribe((locale) => {
+      lang = locale || defaultLang;
+    });
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+      
+    i18n.subscribe(comp => {
+      documentUpdater(comp, lang)
+    });
+</script>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+</style>

package/dist/routes/dashboard/content-management/editpage.astro

@@ -0,0 +1,71 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import TinyMDE from '../../../components/dashboard/component-scripts/TinyMDE.astro';
+import EditPage from '../../../components/dashboard/islands/content-mgmt/EditPage.astro';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement {lang} />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader {lang} editPage />
+  </div>
+
+  <EditPage {lang} />
+
+  <TinyMDE />
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+    } from 'studiocms:i18n/client';
+  
+    let lang = defaultLang;
+
+    const currentPage = '@studiocms/dashboard:content-index';
+
+    $localeSettings.subscribe((locale) => {
+      lang = locale || defaultLang;
+    });
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+      
+    i18n.subscribe(comp => {
+      documentUpdater(comp, lang)
+    });
+</script>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+</style>

package/dist/routes/dashboard/content-management/index.astro

@@ -0,0 +1,91 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import InnerSidebarElement from '../../../components/dashboard/islands/content-mgmt/InnerSidebarElement.astro';
+import PageHeader from '../../../components/dashboard/islands/content-mgmt/PageHeader.astro';
+import Layout from '../../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/dashboard:content-index');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  sidebar='double'
+  {lang}
+  >
+
+  <div slot="double-sidebar" class="inner-sidebar-container">
+    <div class="sidebar-links-container">
+      <InnerSidebarElement {lang} />
+    </div>
+  </div>
+
+  <div slot="header">
+    <PageHeader {lang} />
+  </div>
+
+  <div id="placeholder-info" class="placeholder-info">
+    <p>
+      <t-content-index key="placeholder">{t('placeholder')}</t-content-index>
+    </p>
+  </div>
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+        makeTranslation,
+    } from 'studiocms:i18n/client';
+  
+    let lang = defaultLang;
+
+    const currentPage = '@studiocms/dashboard:content-index';
+
+    $localeSettings.subscribe((locale) => {
+      lang = locale || defaultLang;
+    });
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+      
+      i18n.subscribe(comp => {
+        documentUpdater(comp, lang)
+      });
+    
+    if (!customElements.get('t-content-index')) {
+        customElements.define('t-content-index', makeTranslation(currentPage, i18n));
+    }
+</script>
+
+<style>
+  .inner-sidebar-container {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    min-height: 100vh;
+    height: 100%;
+    padding: 1.5rem;
+  }
+
+  .placeholder-info {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 40vh;
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 30vh;
+    z-index: -1;
+
+    p {
+      font-size: 1.25rem;
+      color: hsl(var(--text-muted));
+    }
+  }
+</style>

package/dist/routes/dashboard/index.astro

@@ -0,0 +1,56 @@
+---
+import { useTranslations } from 'studiocms:i18n';
+import DashboardPageHeader from '../../components/dashboard/DashboardPageHeader.astro';
+import DashboardGrid from '../../components/dashboard/islands/dashboard/DashboardGrid.astro';
+import Layout from '../../layouts/dashboard/Layout.astro';
+
+const lang = 'en-us';
+const t = useTranslations(lang, '@studiocms/dashboard:index');
+---
+
+<Layout 
+  title={t('title')}
+  description={t('description')}
+  requiredPermission='editor'
+  {lang}
+  >
+
+  <div slot="header">
+    <DashboardPageHeader />
+    <span class="index-sub-header">
+      <t-dashboard key="sub-header">{t('sub-header')}</t-dashboard>
+    </span>
+  </div>
+
+  <DashboardGrid />
+
+</Layout>
+
+<script>
+    import { 
+        $i18n,
+        $localeSettings,
+        baseTranslation,
+        defaultLang,
+        documentUpdater,
+        makeTranslation,
+    } from 'studiocms:i18n/client';
+
+    const currentPage = '@studiocms/dashboard:index';
+
+    let lang = defaultLang;
+
+    const i18n = $i18n(currentPage, baseTranslation[currentPage]);
+
+    $localeSettings.subscribe((locale) => {
+        lang = locale || defaultLang;
+    });
+    
+    i18n.subscribe(comp => {
+        documentUpdater(comp, lang);
+    });
+
+    if (!customElements.get('t-dashboard')) {
+        customElements.define('t-dashboard', makeTranslation(currentPage, i18n));
+    }
+</script>