slates: adjustments to slates table

This commit is contained in:
jimmylee 2020-08-12 01:34:17 -07:00
parent 7ccdcacd1e
commit d8a77f3578
3 changed files with 30 additions and 20 deletions

View File

@ -4,12 +4,7 @@ export default async ({ key }) => {
return await runQuery({
label: "GET_API_KEY_BY_KEY",
queryFn: async (DB) => {
const query = await DB.select("*")
.from("keys")
.where({ key })
.first();
console.log(query);
const query = await DB.select("*").from("keys").where({ key }).first();
if (!query || query.error) {
return null;

View File

@ -8,19 +8,28 @@ import Section from "~/components/core/Section";
import ScenePage from "~/components/core/ScenePage";
import DataView from "~/components/core/DataView";
const STYLES_NUMBER = css`
font-family: ${Constants.font.semiBold};
font-weight: 400;
`;
export default class SceneHome extends React.Component {
render() {
// TODO(jim): Refactor later.
const slates = {
columns: [
{ key: "id", id: "id", name: "ID" },
{
key: "slatename",
name: "Slate Name",
width: "228px",
width: "100%",
type: "SLATE_LINK",
},
{ key: "url", name: "URL", width: "268px", type: "NEW_WINDOW" },
{ key: "id", id: "id", name: "Slate ID", width: "296px" },
{
key: "objects",
name: "Objects",
},
{
key: "public",
name: "Public",
@ -31,8 +40,9 @@ export default class SceneHome extends React.Component {
rows: this.props.viewer.slates.map((each) => {
return {
...each,
url: `/${this.props.viewer.username}/${each.slatename}`,
url: `https://slate.host/${this.props.viewer.username}/${each.slatename}`,
public: each.data.public,
objects: <span css={STYLES_NUMBER}>{each.data.objects.length}</span>,
};
}),
};

View File

@ -1,4 +1,5 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as System from "~/components/system";
import { css } from "@emotion/react";
@ -6,20 +7,29 @@ import { css } from "@emotion/react";
import ScenePage from "~/components/core/ScenePage";
import Section from "~/components/core/Section";
const STYLES_NUMBER = css`
font-family: ${Constants.font.semiBold};
font-weight: 400;
`;
// TODO(jim): Slates design.
export default class SceneSlates extends React.Component {
render() {
// TODO(jim): Refactor later.
const slates = {
columns: [
{ key: "id", id: "id", name: "ID" },
{
key: "slatename",
name: "Slate Name",
width: "228px",
width: "100%",
type: "SLATE_LINK",
},
{ key: "url", name: "URL", width: "268px", type: "NEW_WINDOW" },
{ key: "id", id: "id", name: "Slate ID", width: "296px" },
{
key: "objects",
name: "Objects",
},
{
key: "public",
name: "Public",
@ -30,16 +40,15 @@ export default class SceneSlates extends React.Component {
rows: this.props.viewer.slates.map((each) => {
return {
...each,
url: `/${this.props.viewer.username}/${each.slatename}`,
url: `https://slate.host/${this.props.viewer.username}/${each.slatename}`,
public: each.data.public,
objects: <span css={STYLES_NUMBER}>{each.data.objects.length}</span>,
};
}),
};
// TODO(jim): Refactor later.
const slateButtons = [
{ name: "Create slate", type: "SIDEBAR", value: "SIDEBAR_CREATE_SLATE" },
];
const slateButtons = [{ name: "Create slate", type: "SIDEBAR", value: "SIDEBAR_CREATE_SLATE" }];
return (
<ScenePage>
@ -48,11 +57,7 @@ export default class SceneSlates extends React.Component {
description="No! Consider this page just a functionality test. Slates will be collaborative mood boards and will have a much more intuitive experience than this."
/>
<System.H1 style={{ marginTop: 48 }}>Slates</System.H1>
<Section
title="Slates"
buttons={slateButtons}
onAction={this.props.onAction}
>
<Section title="Slates" buttons={slateButtons} onAction={this.props.onAction}>
<System.Table
data={slates}
name="slate"