pinstripe 0.29.0 → 0.30.0

package/README.md

@@ -1,9 +1,7 @@
 
 # Welcome to Pinstripe
 
-## What is Pinstripe?
-
-Pinstripe is a slick [content management system (CMS)](https://en.wikipedia.org/wiki/Content_management_system) for Node.js.
+A slick web framework for Node.js.
 
 ## License
 

package/lib/apps/docs.js

@@ -0,0 +1,6 @@
+
+export default {
+    compose(){
+        return ['shared', 'docs'];
+    }
+};

package/lib/database/migrator.js

@@ -8,20 +8,20 @@ export const Migrator = Class.extend().include({
     },
 
     async migrate(){
-        if(!await this.database.table('pinstripeAppliedMigrations').exists){
-            await this.database.table('pinstripeAppliedMigrations', async pinstripeAppliedMigrations => {
-                await pinstripeAppliedMigrations.addColumn('schemaVersion', 'integer');
+        if(!await this.database.table('appliedMigrations').exists){
+            await this.database.table('appliedMigrations', async appliedMigrations => {
+                await appliedMigrations.addColumn('schemaVersion', 'integer');
             });
         }
         const isDevelopmentEnvironment = (process.env.NODE_ENV || 'development') == 'development';
         const migrations = Migration.names.map(name => Migration.for(name)).sort((a, b) => a.schemaVersion - b.schemaVersion);
         for(let i in migrations){
             const migration = migrations[i];
-            const isMigrationApplied = await this.database.table('pinstripeAppliedMigrations').where({ schemaVersion: migration.schemaVersion }).count() > 0;
+            const isMigrationApplied = await this.database.table('appliedMigrations').where({ schemaVersion: migration.schemaVersion }).count() > 0;
             if(!isMigrationApplied){
                 if(isDevelopmentEnvironment) console.log(`Applying migration: ${migration.name}`);
                 await migration.new(this.database).migrate();
-                await this.database.table('pinstripeAppliedMigrations').insert({ schemaVersion: migration.schemaVersion });
+                await this.database.table('appliedMigrations').insert({ schemaVersion: migration.schemaVersion });
             }
         }
     }

package/lib/extensions/_file_importer.js

@@ -0,0 +1 @@
+export default undefined;

package/lib/extensions/multi-tenant/database/row.js

@@ -0,0 +1,26 @@
+
+import { Table, Row } from 'pinstripe/database';
+
+Row.include({
+    meta(){
+        const { initialize, update } = this.prototype;
+
+        this.include({
+            initialize(database, fields, exists){
+                const columns = Table.for(this.constructor.collectionName).columns;
+                if(columns.tenantId && database.tenant){
+                    return initialize.call(this, database, { ...fields, tenantId: database.tenant.id }, exists);
+                }
+                return initialize.call(this, database, fields, exists);
+            },
+
+            update(fields){
+                const columns = Table.for(this.constructor.collectionName).columns;
+                if(columns.tenantId && this.database.tenant){
+                    return update.call(this, { ...fields, tenantId: this.database.tenant.id });
+                }
+                return update.call(this, fields);
+            }
+        });
+    }
+});

package/lib/extensions/multi-tenant/database/table.js

@@ -0,0 +1,30 @@
+
+import { Table } from 'pinstripe/database';
+
+Table.include({
+    meta(){
+        const { create, initialize } = this.prototype;
+
+        this.include({
+            async create(...args){
+                if(this.exists) return;
+                await create.call(this, ...args);
+                if(this.constructor.name == 'appliedMigrations') return;
+                if(this.constructor.name == 'tenants') return;
+                await this.addColumn('tenantId', 'foreign_key');
+            },
+            
+            initialize(...args){
+                const out = initialize.call(this, ...args);
+                if(this.constructor.columns.tenantId && this.database.scopedByTenant){
+                    if(this.database.tenant){
+                        this.where({ tenantId: this.database.tenant.id });
+                    } else {
+                        this.where('1 = 2')
+                    }
+                }
+                return out;
+            }
+        });
+    }
+});

package/lib/extensions/multi-tenant/database.js

@@ -0,0 +1,18 @@
+
+import { Database } from 'pinstripe';
+
+Database.include({
+    meta(){
+        const { singleton } = this.prototype;
+
+        this.include({
+            singleton(...args){
+                if(this.tenant) return singleton.call(this, ...args);
+            }
+        });
+    },
+
+    get scopedByTenant(){
+        return this.hasOwnProperty('tenant');
+    }
+});

package/lib/extensions/multi-tenant/index.js

@@ -0,0 +1,4 @@
+
+import { importAll } from 'pinstripe';
+
+importAll(import.meta.url);

package/lib/extensions/multi-tenant/migrations/1627976174_create_tenant_table_and_add_tenant_id_to_existing_tables.js

@@ -0,0 +1,20 @@
+
+export default {
+    async migrate(){
+        await this.database.table('tenants', async tenants => {
+            await tenants.addColumn('name', 'string', { index: true });
+            await tenants.addColumn('host', 'string', { index: true });
+        });  
+    
+        const tableNames = Object.keys(this.database.info).filter(name => this.database.info[name] == 'table');
+    
+        while(tableNames.length){
+            const tableName = tableNames.shift();
+            if(tableName == 'appliedMigrations') continue;
+            if(tableName == 'tenants') continue;
+            
+            if(this.database[tableName].constructor.columns.tenantId) continue;
+            await this.database[tableName].addColumn('tenantId', 'foreign_key');
+        }
+    }
+};

package/lib/extensions/multi-tenant/migrations/_file_importer.js

@@ -0,0 +1,2 @@
+
+export { Migration as default } from 'pinstripe/database';

package/lib/extensions/multi-tenant/services/_file_importer.js

@@ -0,0 +1,2 @@
+
+export { ServiceFactory as default } from 'pinstripe';

package/lib/extensions/multi-tenant/services/database.js

@@ -0,0 +1,32 @@
+
+import { Database } from 'pinstripe';
+import { Client } from "pinstripe/database";
+
+export default {
+    create(){
+        return this.defer(async () => {
+            if(!this.context.root.databaseClient){
+                this.context.root.databaseClient = Client.new(await this.config.database);
+            }
+
+            const out = await Database.new(this.context.root.databaseClient);
+
+            if(out.info.tenants){
+                const headers = this.initialParams._headers;
+                const hostname = this.initialParams._url.hostname;
+                const host = (headers['host'] || hostname).replace(/\:\d+$/, '').toLowerCase();
+                const { primaryDomain = '' } = await this.config;
+                const domainSuffix = `\.${primaryDomain}`.toLowerCase();
+
+                if(host.endsWith(domainSuffix)){
+                    const name = host.substr(0, host.length - domainSuffix.length);
+                    out.tenant = await out.tenants.where({ name }).first();
+                } else {
+                    out.tenant = await out.tenants.where({ host }).first();
+                }
+            }
+
+            return out;
+        });
+    }
+};

package/lib/markdown.js

@@ -39,7 +39,7 @@ export const Markdown = Class.extend().include({
             paragraph.attributes = {
                 ...paragraph.attributes,
                 'data-component': 'pinstripe-frame',
-                'data-url': `/markdown/slash_blocks/${name}?args=${encodeURIComponent(args)}`,
+                'data-url': `/_markdown_slash_blocks/${name}?args=${encodeURIComponent(args)}`,
             };
             paragraph.children = [];
         });

package/lib/services/cookies.js

@@ -3,7 +3,7 @@ export default {
     create(){
         if(!this.context.root.hasOwnProperty('cookies')){
             const cookies = {};
-            const cookieHeader = this.params._headers?.cookie;
+            const cookieHeader = this.initialParams._headers?.cookie;
             if(cookieHeader){
                 cookieHeader.split(/;/).forEach(cookie => {
                     const matches = cookie.trim().match(/^([^=]+)=(.*)$/);

package/lib/services/docs.js

@@ -0,0 +1,93 @@
+
+import { existsSync } from 'fs';
+import { realpath, readFile } from 'fs/promises';
+import { registries } from 'pinstripe/util';
+
+export default {
+    async create(){
+        if(!this.context.root.docs){
+            this.context.root.docs = {
+                apps: await this.extractDocs('App', 'apps'),
+                commands: await this.extractDocs('Command', 'commands'),
+                components: await this.extractDocs('Component', 'components'),
+                migrations: await this.extractDocs('Migration', 'migrations'),
+                models: await this.extractDocs('Row', 'models'),
+                services: await this.extractDocs('ServiceFactory', 'services'),
+                views: await this.extractDocs('View', 'views'),
+            };
+        }
+        return this.context.root.docs;
+    },
+
+
+
+    async extractDocs(name, namespace){
+        const out = {};
+        const registry = registries[name];
+        const { names } =  registry;
+        for(let name of names){
+            const slug = `${namespace}/${name}`;
+
+            const Class = registry.for(name);
+            
+            const filePath = Class.filePaths[Class.filePaths.length - 1];
+
+            if(!filePath || !filePath.match(/\.(js|css)/)) continue;
+
+            const packageRootPath = await this.getPackageRootPath(filePath);
+            
+            if(packageRootPath == undefined) continue;
+            
+            const packageJson = await this.getPackageJson(packageRootPath);
+
+            const packageName = packageJson.name;
+            
+            const packageRelativePath = filePath.substr(packageRootPath.length).replace(/^\//, '');
+            const repositoryRelativePath = `${packageJson.repository?.directory ? `${packageJson.repository.directory}/` : ''}${packageRelativePath}`;
+
+            const code = (await readFile(filePath)).toString('utf8');
+
+            const markdown = code.split(/\/\*\//).map((segment, i) => {
+                if(i % 2 == 0 && segment.trim().length){
+                    return `\`\`\`\n${segment}\n\`\`\``;
+                }
+                return segment;
+            }).join('');
+
+            out[name] = {
+                name,
+                slug,
+                packageName,
+                packageRelativePath,
+                repositoryRelativePath,
+                markdown
+            };
+        }
+        return out;
+    },
+
+    async getPackageRootPath(path){
+        const packageJsonPath = (await this.findInPath('package.json', path.replace(/[^/]*$/, ''))).shift();
+        if(!packageJsonPath) return;
+        return packageJsonPath.replace(/package.json$/, '');
+    },
+
+    async getPackageJson(packageRootPath){
+        return JSON.parse((await readFile(`${packageRootPath}package.json`)).toString('utf8'));
+    },
+
+    async findInPath(offset, base){
+        const out = [];
+        while(base) {
+            const candidatePath = `${base}/${offset}`;
+            if(existsSync(candidatePath)){
+                out.push(await realpath(candidatePath));
+            }
+            if(base == '/'){
+                break;
+            }
+            base = await realpath(`${base}/..`);
+        }
+        return out;
+    }
+};

package/lib/services/fetch.js

@@ -22,12 +22,13 @@ export default {
             return out;
         }
 
-        if(!viewName.match(/(^|\/)_/)){
-            out = this.normalizeResponse(await this.renderView(viewName != '' ? `${viewName}/index`: 'index', normalizedParams));
+        if(!viewName.match(/(^|\/)_[^\/]+(|\/index)$/)){
+            out = this.normalizeResponse(await this.app.renderView(viewName != '' ? `${viewName}/index`: 'index', normalizedParams));
             if(out){
                 return out;
             }
-            out = this.normalizeResponse(await this.renderView(viewName, normalizedParams));
+        
+            out = this.normalizeResponse(await this.app.renderView(viewName, normalizedParams));
             if(out){
                 return out;
             }
@@ -53,7 +54,7 @@ export default {
 
         const prefixSegments = [];
         while(true){
-            const out = this.normalizeResponse(await this.renderView(prefixSegments.length ? [...prefixSegments, 'guard'].join('/') : 'guard', params));
+            const out = this.normalizeResponse(await this.app.renderView(prefixSegments.length ? [...prefixSegments, 'guard'].join('/') : 'guard', params));
             if(out){
                 return out;
             }
@@ -67,7 +68,7 @@ export default {
     async renderDefaultViews(viewName, params){
         const prefixSegments = viewName != '' ? viewName.split(/\//) : [];
         while(true){
-            const out = this.normalizeResponse(await this.renderView(prefixSegments.length ? [...prefixSegments, 'default'].join('/') : 'default', params));
+            const out = this.normalizeResponse(await this.app.renderView(prefixSegments.length ? [...prefixSegments, 'default'].join('/') : 'default', params));
             if(out){
                 return out;
             }

package/lib/services/render_view.js

@@ -1,6 +1,12 @@
 
 export default {
     create(){
-        return (...args) => this.app.renderView(...args);
+        return async (name, params = {}) => {
+            const out = await this.app.renderView(name != '' ? `${name}/index`: 'index', params);
+            if(out){
+                return out;
+            }
+            return this.app.renderView(name, params);
+        }
     }
 };

package/lib/view.js

@@ -7,7 +7,6 @@ import * as crypto from 'crypto'; // pinstripe-if-client: const crypto = undefin
 import { Class } from './class.js';
 import { Registry } from './registry.js';
 import { ServiceConsumer } from './service_consumer.js';
-import { trapify } from './trapify.js'
 
 export const View = Class.extend().include({
     meta(){

package/lib/views/docs/_404.js

@@ -0,0 +1,16 @@
+
+export default {
+    async render(){
+        const [ status, headers, body ] = (await this.renderView('_layout', {
+            title: 'Not found',
+            body: this.renderView('_section', {
+                title: 'Not found',
+                body: this.renderHtml`
+                    <p>The page you are looking for can't be found or no longer exists.</p>
+                `
+            })
+        })).toResponseArray();
+    
+        return [ 404, headers, body ];
+    }
+}

package/lib/views/docs/_footer.js

@@ -0,0 +1,67 @@
+
+export const styles = `
+    .root {
+        padding-top: 8rem;
+        padding-bottom: 8rem;
+        padding-right: var(--gap);
+        padding-left: var(--gap);
+        color: var(--color-secondary-text);
+    }
+
+    .inner {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        font-size: 1.3rem;
+        max-width: 1200px;
+        margin: 0 auto;
+    }
+
+    .powered-by {
+        text-align: right;
+    }
+
+    .root a {
+        color: var(--color-secondary-text);
+    }
+
+    .root a:hover {
+        color: var(--color-black);
+        opacity: 1;
+    }
+
+    @media (max-width: 767px) {
+        .root {
+            padding-top: 6.4rem;
+            padding-bottom: 12rem;
+        }
+
+        .inner {
+            grid-template-columns: 1fr;
+            text-align: center;
+        }
+
+        .powered-by {
+            margin-top: 3.2rem;
+            text-align: center;
+        }
+    }
+`;
+
+export default {
+    async render(){    
+        const site = (await this.database.site) || {};
+
+        return this.renderHtml`
+            <footer class="${this.cssClasses.root}" data-test-id="footer">
+                <div class="${this.cssClasses.inner}">
+                    <div>
+                        ${site.title} © ${new Date().getFullYear()}
+                    </div>    
+                    <div class="${this.cssClasses.poweredBy} ">
+                        <a href="https://pinstripejs.org/" target="_blank" rel="noopener">Powered by Pinstripe</a>
+                    </div>
+                </div>
+            </footer>
+        `;
+    }
+};

package/lib/views/docs/_header.js

@@ -0,0 +1,17 @@
+
+export default {
+    async render(){
+
+        const path = this.initialParams._url.pathname;
+
+        return this.renderView('_navbar', {
+            logoUrl: '/images/logo.svg',
+            title: 'Pinstripe',
+            links: [
+                { href: '/', body: 'Home', selected: path == '/' },
+                { href: '/docs/guides/introduction', body: 'Docs', selected: path.startsWith('/docs') },
+                { href: 'https://github.com/pinstripe', target: '_blank', body: 'Github' }
+            ]
+        });
+    }
+};

package/lib/views/docs/_hero.js

@@ -0,0 +1,59 @@
+
+
+export const styles = `
+    .root {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .title {
+        color: #000;
+        text-align: center;
+        font-family: Inter;
+        font-size: 87.547px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: normal;
+        margin-bottom: 127px;
+    }
+
+    .title > em {
+        font-style: normal;
+        background-image: linear-gradient(135deg, #6fbe53, #53bea7);
+        -webkit-background-clip: text;
+        background-clip: text;
+        color: transparent;
+    }
+
+    .button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 281px;
+        height: 85px;
+        flex-shrink: 0;
+        border-radius: 7px;
+        background: #70BE54;
+        color: #FFF;
+        text-align: center;
+        font-family: Inter;
+        font-size: 28px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: normal;
+    }
+`;
+
+export default {
+    render(){
+        const { title, button, href } = this.params;
+        return this.renderHtml`            
+            <div class="${this.cssClasses.root}">
+                <h1 class="${this.cssClasses.title}">${title}</h1>
+                <a class="${this.cssClasses.button}" href="${href}">${button}</a>
+            </div>
+        `;
+    }
+}

package/lib/views/docs/_layout.js

@@ -0,0 +1,118 @@
+
+export const styles = `
+    .site {
+        display: flex;
+        flex-direction: column;
+        min-height: 100vh;
+    }
+
+    .main {
+        flex-grow: 1;
+        padding-top: 8rem;
+        padding-bottom: 8rem;
+    }
+
+    .outer {
+        padding-right: var(--gap);
+        padding-left: var(--gap);
+    }
+
+    .inner {
+        max-width: 1200px;
+        margin: 0 auto;
+    }
+
+    @media (max-width: 767px) {
+        #main {
+            padding-top: 4.8rem;
+            padding-bottom: 4.8rem;
+        }
+    }
+
+    .wrapper {
+        display: grid;
+        grid-template-columns: 4fr 2fr;
+        column-gap: 2.4rem;
+    }
+
+    .sidebar {
+        top: 4.8rem;
+        height: max-content;
+        padding-left: 4rem;
+        font-size: 1.4rem;
+    }
+
+    .sidebar .section + .section {
+        margin-top: 8rem;
+    }
+
+    .sidebar > *:not(:first-child) {
+        margin-top: 8rem;
+    }
+
+
+    @media (max-width: 767px) {
+        .wrapper {
+            grid-template-columns: 1fr;
+        }
+
+        .sidebar {
+            padding-left: 0;
+            margin-top: 8rem;
+        }
+    }
+
+    @media (min-width: 768px) and (max-width: 991px) {
+        .sidebar {
+            padding-left: 1.6rem;
+        }
+    }
+`;
+
+
+export default {
+    async render(){
+        const { params } = this;
+        const { title, body, sidebar = true } = params;
+        const site = (await this.database.site) || {};
+        
+        return this.renderHtml`
+            <!DOCTYPE html>
+            <html lang="${site.language || 'en'}">
+                <head>
+                    <meta charset="utf-8">
+                    <meta name="viewport" content="width=device-width, initial-scale=1">
+                    <title>${title || site.title}</title>
+                    <link rel="preconnect" href="https://fonts.googleapis.com">
+                    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+                    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,700&family=Inter:wght@400;500;600;700;800&display=swap">
+                    <link rel="stylesheet" href="/assets/stylesheets/all.css">
+                    <script src="/assets/javascripts/all.js"></script>
+                </head>
+                
+                <body>
+                    ${this.renderView('_header')}
+                    <div class="${this.cssClasses.site}">
+                        <main id="main" class="${this.cssClasses.main} ${this.cssClasses.outer}">
+                            <div class="${this.cssClasses.inner}">
+                                <div class="${sidebar ? this.cssClasses.wrapper : ''}">
+                                    <div data-test-id="main">
+                                        ${body}
+                                    </div>
+                                    ${() => {
+                                        if(sidebar) return this.renderHtml`
+                                            <aside class="${this.cssClasses.sidebar}" data-test-id="sidebar">
+                                                ${this.renderView('_sidebar')}
+                                            </aside>
+                                        `;
+                                    }}
+                                </div>
+                            </div>
+                        </main>
+                        ${this.renderView('_footer')}
+                    </div>
+                </body>
+            </html>
+        `;
+    }
+};

package/lib/views/docs/_navbar.js

@@ -0,0 +1,99 @@
+
+export const styles = `
+    .root {
+        border-width: 0 0 0.1rem 0;
+        border-style: solid;
+        border-color: var(--color-light-gray);
+        padding-left: 1em;
+        padding-right: 1em;
+    }
+    .inner {
+        margin: 0 auto;
+        display: flex;
+        min-height: 80px;
+        max-width: 1200px;
+    }
+    .brand {
+        flex: 0 0 auto;
+        display: flex;
+        align-items: center;
+        color: #000;
+        font-family: Inter;
+        font-size: 24px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: normal;
+        padding: 7px 0 7px 0;
+    }
+
+    .brand img {
+        margin-right: 13px;
+    }
+
+    .menu {
+        flex: 1 1 100%;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+    }
+    
+    .buttons {
+        flex: 1 1 100%;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+    }
+
+    .button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: #000;
+        font-family: Inter;
+        font-size: 16px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: normal;
+        width: 139px;
+        height: 38px;
+        flex-shrink: 0;
+        border-radius: 3px;
+        background: #F5F5F5;
+        margin-left: 20px;
+        position: relative;
+    }
+
+    .button.is-selected::after, .button:hover::after {
+        content: " ";
+        display: block;
+        width: 100%;
+        height: 5px;
+        flex-shrink: 0;
+        border-radius: 2.5px;
+        background: #70BE54;
+        position: absolute;
+        bottom: -12px;
+    }
+`;
+
+export default {
+    render(){
+        const { title, logoUrl, links = [], testId = 'root' } = this.params;
+
+        return this.renderHtml`
+            <div class="${this.cssClasses.root}" data-test-id="${testId}">
+                <div class="${this.cssClasses.inner}">
+                    <div class="${this.cssClasses.brand}">
+                        <img src="${logoUrl}" />
+                        <a href="/" data-test-id="title">${title}</a>
+                    </div>
+                    <div class="${this.cssClasses.buttons}">
+                        ${links.map(({ body, href, target = '_top', preload, testId, selected }) => this.renderHtml`
+                            <a class="${this.cssClasses.button} ${selected ? this.cssClasses.isSelected : ''}" href="${href}" target="${target}" ${preload ? 'data-preload' : ''} data-test-id="${testId}">${body}</a>
+                        `)}
+                    </div>
+                </div>
+            </div>
+        `;
+    }
+};

package/lib/views/docs/_sidebar.js

@@ -0,0 +1,31 @@
+
+export default {
+    async render(){
+        const docs = await this.docs;
+
+        return this.renderHtml`
+            ${this.renderView('_section', {
+                title: 'Guides',
+                body: this.renderHtml`
+                    <ul>
+                        <li><a href="/docs/guides/introduction">Introduction</a></li>
+                    </ul>
+                `
+            })}
+            ${Object.keys(docs).filter(name => Object.keys(docs[name]).length > 0).map(name => {
+                const items = docs[name];
+
+                return this.renderView('_section', {
+                    title: name,
+                    body: this.renderHtml`
+                        <ul>
+                            ${Object.values(items).map(({ name, slug })  => this.renderHtml`
+                                <li><a href="/docs/${slug}">${name}</a></li>
+                            `)}
+                        </ul>
+                    `
+                });
+            })}
+        `
+    }
+}

package/lib/views/docs/default.js

@@ -0,0 +1,6 @@
+
+export default {
+    async render(){
+        return this.renderView('_404');
+    }
+};

package/lib/views/docs/docs/default.js

@@ -0,0 +1,24 @@
+
+import { escapeHtml } from 'pinstripe/util'
+
+export default {
+    async render(){
+        const { _url, ...otherParams } = this.params;
+        const docs = await this.docs;
+        const matches = _url.pathname.match(/^\/docs\/([^\/]+)\/(.+)$/);
+        if(!matches) return this.renderView('_404');
+        const items = docs[matches[1]];
+        if(!items) return this.renderView('_404');
+        const item = items[matches[2]];
+        if(!item) return this.renderView('_404');
+        const { name, markdown } = item;
+        return this.renderView('_layout', {
+            body: this.renderView('_content', {
+                body: this.renderHtml`
+                    <h1>${this.renderHtml(escapeHtml(name).replace(/([\/_-])/g, '$1<wbr>'))} ${this.inflector.singularize(matches[1])}</h1>
+                    ${this.renderMarkdown(markdown)}
+                `
+            })
+        });
+    }
+};

package/lib/views/docs/docs/guides/introduction.md

@@ -0,0 +1,18 @@
+
+# Introduction
+
+Pinstripe is a Node.js based CMS, that can be stripped back to a general purpose web framework.
+
+## Quick Start
+
+To see it in action run the following:
+
+```bash
+    yarn global add pinstripe
+    pinstripe generate-project foo
+    cd foo
+    pinstripe init-database
+    pinstripe start-server
+```
+
+Now go to [http://localhost:3000](http://localhost:3000) and it should be up and running.

package/lib/views/docs/images/logo.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="71" height="71" viewBox="0 0 71 71" fill="none">
+  <path d="M27.6287 71H64.529C68.1043 71 70.9999 68.1025 70.9999 64.5273V41.1592C70.9999 55.7115 52.4679 67.8894 27.6287 71Z" fill="#70BE54"/>
+  <path d="M64.5292 -3.21061e-06H48.0303C54.5527 4.19429 58.3987 9.35814 58.3987 14.9361C58.3987 16.9731 57.8886 18.9506 56.918 20.8503C65.6775 26.2494 71.0001 33.3645 71.0001 41.1592V6.47273C71.0001 2.89652 68.1045 -3.21061e-06 64.5292 -3.21061e-06Z" fill="#70BE54"/>
+  <path d="M51.957 26.9443C42.7481 34.9733 24.5948 40.429 3.7076 40.429C2.4613 40.429 1.2251 40.4088 0 40.3674V61.5298C0.526195 61.5388 1.05643 61.5449 1.58767 61.5449C5.52656 61.5449 9.36242 61.346 13.0609 60.9622C37.3235 58.4797 55.502 48.2642 55.502 36.0519C55.502 32.8433 54.2516 29.7741 51.957 26.9443Z" fill="#00377C"/>
+  <path d="M38.5698 -8.29573e-06H0V11.6972C2.77338 11.2689 5.63866 10.9569 8.57061 10.7731C10.7259 10.6297 12.9226 10.5579 15.1496 10.5579C26.5249 10.5579 37.1134 12.4233 45.9406 15.6258C46.4203 14.42 46.6657 13.1787 46.6657 11.9173C46.6657 7.54931 43.7075 3.4742 38.5698 -8.29573e-06Z" fill="#70BE54"/>
+  <path d="M41.2574 18.7869C32.2363 15.8298 21.0084 14.0725 8.84127 14.0725C5.83358 14.0725 2.87539 14.1796 0 14.3886V32.7262C18.7814 31.7758 34.7228 26.7705 43.0854 19.7726C43.1823 19.6908 43.2793 19.609 43.3763 19.5272C42.6875 19.2717 41.9775 19.0273 41.2574 18.7869Z" fill="#00377C"/>
+</svg>

package/lib/views/docs/index.js

@@ -0,0 +1,16 @@
+
+
+export default {
+    render(){
+        return this.renderView('_layout', {
+            sidebar: false,
+            body: this.renderView('_hero', {
+                title: this.renderHtml`
+                    A <em>slick</em> CMS for Node.js
+                `,
+                href: '/docs/guides/introduction',
+                button: 'Get Started'
+            })
+        });
+    }
+};

package/lib/views/shared/_content.js

@@ -1,9 +1,5 @@
 
-export const styles = `        
-    .root {
-        margin-top: 4rem;
-    }
-
+export const styles = `
     .root > * + * {
         margin-top: 2.8rem;
         margin-bottom: 0;

package/lib/views/shared/_form.js

@@ -172,7 +172,7 @@ export default {
                                         <label class="${this.cssClasses.label}">${label}</label>
                                         ${() => {
                                             const input = (() => {
-                                                if(type.match(/(^|\/)_/)){
+                                                if(type.match(/(^|\/)_[^\/]+(|\/index)$/)){
                                                     return this.renderView(type, { label, name, type, value, component, placeholder, error, cssClasses: this.cssClasses, ...rest });
                                                 }
                                                 if(type == 'textarea'){

package/lib/views/shared/_navbar.js

@@ -108,31 +108,3 @@ export default {
         `;
     }
 };
-
-
-// <div class="navbar" data-test-id="navbar">
-//     <div class="inner">
-//         <div class="brand">
-//             <a class="item" href="/" data-test-id="title">${site.title}</a>
-//         </div>
-//         <div class="menu">
-//             ${() => {
-//                 if(isSignedIn) return this.renderHtml`
-//                     ${isAdmin && this.renderHtml`
-//                         <div class="item has-dropdown">
-//                             Add
-//                             <div class="dropdown">
-//                                 <a class="item" href="/admin/add_page?userId=${user.id}" target="_overlay">Page</a>
-//                                 <a class="item" href="/admin/add_post?userId=${user.id}" target="_overlay">Post</a>
-//                             </div>
-//                         </div>
-//                     `}
-//                     <a class="item" href="/sign_out" target="_overlay" data-test-id="sign-out">Sign out</a>
-//                 `;
-//                 return this.renderHtml`
-//                     <a class="item" href="/sign_in" target="_overlay" data-preload data-test-id="sign-in">Sign in</a>
-//                 `;
-//             }}
-//         </div>
-//     </div>
-// </div>

package/lib/views/shared/_shell/index.js

@@ -0,0 +1,25 @@
+
+export default {
+    render(){
+        const { language = 'en', title = '', body } = this.params;
+
+        return this.renderHtml`
+            <!DOCTYPE html>
+            <html lang="${language}">
+                <head>
+                    <meta charset="utf-8">
+                    <meta name="viewport" content="width=device-width, initial-scale=1">
+                    <title>${title}</title>
+                    <link rel="preconnect" href="https://fonts.googleapis.com">
+                    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+                    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,700&family=Inter:wght@400;500;600;700;800&display=swap">
+                    <link rel="stylesheet" href="/_shell/stylesheets/all.css">
+                    <script src="/_shell/javascripts/all.js"></script>
+                </head>
+                <body>
+                    ${body}
+                </body>
+            </html>
+        `;
+    }
+};

package/lib/views/shared/_shell/stylesheets/all.css

@@ -0,0 +1,4 @@
+@import "./vars.css";
+@import "./reset.css";
+@import "./global.css";
+@import "./view.css";

package/package.json

@@ -1,13 +1,14 @@
 {
   "type": "module",
   "name": "pinstripe",
-  "description": "An MV* web framework for Node.js.",
-  "version": "0.29.0",
+  "description": "A slick web framework for Node.js.",
+  "version": "0.30.0",
   "author": "Jody Salt",
   "license": "MIT",
   "exports": {
     ".": "./lib/index.js",
     "./database": "./lib/database/index.js",
+    "./multi-tenant": "./lib/extensions/multi-tenant/index.js",
     "./util": "./lib/util.js"
   },
   "bin": {
@@ -34,7 +35,6 @@
     "cron-parser": "^4.3.0",
     "css": "^3.0.0",
     "esbuild": "^0.15.12",
-    "generate-avatar": "^1.4.10",
     "html-entities": "^2.3.2",
     "js-yaml": "^4.1.0",
     "luxon": "^2.3.1",
@@ -53,5 +53,5 @@
     "url": "git://github.com/blognami/pinstripe.git",
     "directory": "packages/pinstripe"
   },
-  "gitHead": "4dd2a2409551f2fb41f1db6c6b7a983faa4bffc9"
+  "gitHead": "07d0e77a033fd16381b2641ad22158dc1857899e"
 }

package/lib/services/session.js

@@ -1,19 +0,0 @@
-
-export default {
-    create(){
-        return this.defer(async () => {
-            const { pinstripeSession } = this.cookies;
-            if(!pinstripeSession){
-                return;
-            }
-            const [ id, passString ] = pinstripeSession.split(/:/);
-            const session = await this.database.sessions.where({ id, passString }).first();
-            if(session && session.lastAccessedAt < (Date.now() - 1000 * 60 * 5)){
-                await session.update({
-                    lastAccessedAt: Date.now()
-                });
-            }
-            return session;
-        });
-    }
-};

package/lib/views/shared/assets/stylesheets/all.css

@@ -1,4 +0,0 @@
-@import "/assets/stylesheets/vars.css";
-@import "/assets/stylesheets/reset.css";
-@import "/assets/stylesheets/global.css";
-@import "/assets/stylesheets/view.css";