slate: fixes slate pages and drag and drop

components/core/Application.js

@@ -134,17 +134,29 @@ export default class ApplicationPage extends React.Component {
 
     this.setState({ fileLoading: true });
 
+    // TODO(jim):
+    // Refactor later
+    const navigation = NavigationData.generate(this.state.viewer);
+    const next = this.state.history[this.state.currentIndex];
+    const current = NavigationData.getCurrentById(navigation, next.id);
+
+    let slate;
+    if (current.target && current.target.slatename) {
+      slate = { ...current.target, id: current.target.slateId };
+    }
+
     this._handleAction({
       type: "SIDEBAR",
       value: "SIDEBAR_ADD_FILE_TO_BUCKET",
+      data: slate,
     });
 
     if (e.dataTransfer.items) {
       for (var i = 0; i < e.dataTransfer.items.length; i++) {
         if (e.dataTransfer.items[i].kind === "file") {
           var file = e.dataTransfer.items[i].getAsFile();
-          console.log(file.name);
-          await this._handleSetFile({ file });
+
+          await this._handleSetFile({ file, slate });
           break;
         }
       }
@@ -213,8 +225,7 @@ export default class ApplicationPage extends React.Component {
   _handleDeleteYourself = async () => {
     // TODO(jim):
     // Put this somewhere better for messages.
-    const message =
-      "Do you really want to delete your account? It will be permanently removed";
+    const message = "Do you really want to delete your account? It will be permanently removed";
     if (!window.confirm(message)) {
       return false;
     }
@@ -413,12 +424,8 @@ export default class ApplicationPage extends React.Component {
         <WebsitePrototypeWrapper
           title="Slate: sign in"
           description="Sign in to your Slate account to manage your assets."
-          url="https://slate.host/application"
-        >
-          <SceneSignIn
-            onAuthenticate={this._handleAuthenticate}
-            onNavigateTo={this._handleNavigateTo}
-          />
+          url="https://slate.host/application">
+          <SceneSignIn onAuthenticate={this._handleAuthenticate} onNavigateTo={this._handleNavigateTo} />
         </WebsitePrototypeWrapper>
       );
     }
@@ -491,17 +498,12 @@ export default class ApplicationPage extends React.Component {
 
     return (
       <React.Fragment>
-        <WebsitePrototypeWrapper
-          title={title}
-          description={description}
-          url={url}
-        >
+        <WebsitePrototypeWrapper title={title} description={description} url={url}>
           <ApplicationLayout
             navigation={navigationElement}
             header={headerElement}
             sidebar={sidebarElement}
-            onDismissSidebar={this._handleDismissSidebar}
-          >
+            onDismissSidebar={this._handleDismissSidebar}>
             {scene}
           </ApplicationLayout>
         </WebsitePrototypeWrapper>

pages/slate.js

@@ -27,28 +27,22 @@ const STYLES_ROOT = css`
 
 export default class SlatePage extends React.Component {
   render() {
-    const title = this.props.slate
-      ? `@${this.props.slate.ownername}/${this.props.slate.slatename}`
-      : "404";
+    const title = this.props.slate ? `@${this.props.slate.ownername}/${this.props.slate.slatename}` : "404";
     const url = `https://slate.host/${title}`;
 
     if (!this.props.slate) {
       return (
-        <WebsitePrototypeWrapper
-          title={title}
-          description="This Slate can not be found."
-          url={url}
-        >
+        <WebsitePrototypeWrapper title={title} description="This Slate can not be found." url={url}>
           <div css={STYLES_ROOT}>
-            <h1 css={STYLES_HEADING}>404</h1>
-            <p css={STYLES_PARAGRAPH}>
+            <System.H1>404</System.H1>
+            <System.P>
               This slate is not found.
               <br />
               <br />
               <a href="/application">Run Slate {Constants.values.version}</a>
               <br />
               <a href="/system">Use Slate's Design System</a>
-            </p>
+            </System.P>
           </div>
         </WebsitePrototypeWrapper>
       );
@@ -62,12 +56,7 @@ export default class SlatePage extends React.Component {
     }
 
     return (
-      <WebsitePrototypeWrapper
-        title={title}
-        description={description}
-        url={url}
-        image={image}
-      >
+      <WebsitePrototypeWrapper title={title} description={description} url={url} image={image}>
         <div css={STYLES_ROOT}>
           <Slate items={this.props.slate.data.objects} />
         </div>

scenes/SceneSlate.js

@@ -7,11 +7,10 @@ import ScenePage from "~/components/core/ScenePage";
 import Section from "~/components/core/Section";
 
 export default class SceneSlate extends React.Component {
-  static defaultProps = { data: { data: { objects: [] } } };
-
   render() {
-    const images = this.props.current.data.objects;
-    const url = `/@${this.props.viewer.username}/${this.props.data.slatename}`;
+    const { data, slatename } = this.props.current;
+    const images = data.objects;
+    const url = `/@${this.props.viewer.username}/${slatename}`;
 
     const slates = {
       columns: [
@@ -22,6 +21,7 @@ export default class SceneSlate extends React.Component {
     };
 
     // TODO(jim): Refactor later.
+    // Actually just delete later, we're doing something else.
     const slateButtons = [
       /*
       { name: "Make public", type: "SIDEBAR", value: "" },
@@ -42,17 +42,11 @@ export default class SceneSlate extends React.Component {
 
     return (
       <ScenePage>
-        <System.H1>{this.props.data.slatename}</System.H1>
-        <Section
-          title="Images"
-          buttons={slateButtons}
-          onAction={this.props.onAction}
-        >
+        <System.H1>{slatename}</System.H1>
+        <Section title="Images" buttons={slateButtons} onAction={this.props.onAction}>
           <System.Table
             data={slates}
-            name={`/@${this.props.viewer.username}/${
-              this.props.data.slatename
-            }`}
+            name={`/@${this.props.viewer.username}/${slatename}`}
             onAction={this.props.onAction}
             onNavigateTo={this.props.onNavigateTo}
           />