expand / collapse animation

28d513f1 · Kyle Doherty · 1e3e09c2 · 28d513f1 · 28d513f1 · 28d513f1
Commit 28d513f1 authored 8 years ago by Kyle Doherty
--- a/frontend/src/metabase/questions/containers/QuestionIndex.jsx
+++ b/frontend/src/metabase/questions/containers/QuestionIndex.jsx
@@ -2,6 +2,7 @@ import React, { Component, PropTypes } from "react";
 import { connect } from "react-redux";
 import { Link } from "react-router";
 import { Motion, spring, presets } from "react-motion";
+import Collapse from "react-collapse";

 // import ActionGroup from "metabase/components/ActionGroup";
 import Icon from "metabase/components/Icon";
@@ -88,17 +89,15 @@ export default class QuestionIndex extends Component {
                        <h2>Everything Else</h2>
                    </div>`
                </div>
-                { questionsExpanded &&
-                    <div className="">
-                        <EntityList
-                            query={{ f: "all", collection: "", ...location.query }}
-                            onChangeSection={(section) => push({
-                                ...location,
-                                query: { ...location.query, f: section }
-                            })}
-                        />
-                    </div>
-                }
+                <Collapse isOpened={questionsExpanded} keepContent={true}>
+                    <EntityList
+                        query={{ f: "all", collection: "", ...location.query }}
+                        onChangeSection={(section) => push({
+                            ...location,
+                            query: { ...location.query, f: section }
+                        })}
+                    />
+                </Collapse>
            </div>
        )
    }

--- a/package.json
+++ b/package.json
@@ -35,8 +35,10 @@
    "react-addons-perf": "^15.2.1",
    "react-addons-shallow-compare": "^15.2.1",
    "react-ansi-style": "^1.0.0",
+    "react-collapse": "^2.3.3",
    "react-dom": "^15.2.1",
-      "react-draggable": "^2.2.3",
+    "react-draggable": "^2.2.3",
+    "react-height": "^2.1.1",
    "react-motion": "^0.4.5",
    "react-redux": "^4.4.5",
    "react-resizable": "^1.0.1",

--- a/yarn.lock
+++ b/yarn.lock
@@ -376,14 +376,6 @@ babel-cli@^6.11.4:
  optionalDependencies:
    chokidar "^1.0.0"

-babel-code-frame@^6.16.0:
-  version "6.16.0"
-  resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.16.0.tgz#f90e60da0862909d3ce098733b5d3987c97cb8de"
-  dependencies:
-    chalk "^1.1.0"
-    esutils "^2.0.2"
-    js-tokens "^2.0.0"
-
 babel-code-frame@^6.20.0:
  version "6.20.0"
  resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.20.0.tgz#b968f839090f9a8bc6d41938fb96cb84f7387b26"
@@ -392,33 +384,7 @@ babel-code-frame@^6.20.0:
    esutils "^2.0.2"
    js-tokens "^2.0.0"

-babel-core@^6.11.4, babel-core@^6.16.0, babel-core@^6.9.0:
-  version "6.17.0"
-  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.17.0.tgz#6c4576447df479e241e58c807e4bc7da4db7f425"
-  dependencies:
-    babel-code-frame "^6.16.0"
-    babel-generator "^6.17.0"
-    babel-helpers "^6.16.0"
-    babel-messages "^6.8.0"
-    babel-register "^6.16.0"
-    babel-runtime "^6.9.1"
-    babel-template "^6.16.0"
-    babel-traverse "^6.16.0"
-    babel-types "^6.16.0"
-    babylon "^6.11.0"
-    convert-source-map "^1.1.0"
-    debug "^2.1.1"
-    json5 "^0.4.0"
-    lodash "^4.2.0"
-    minimatch "^3.0.2"
-    path-exists "^1.0.0"
-    path-is-absolute "^1.0.0"
-    private "^0.1.6"
-    shebang-regex "^1.0.0"
-    slash "^1.0.0"
-    source-map "^0.5.0"
-
-babel-core@^6.18.0, babel-core@^6.20.0:
+babel-core@^6.11.4, babel-core@^6.16.0, babel-core@^6.18.0, babel-core@^6.20.0, babel-core@^6.9.0:
  version "6.20.0"
  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.20.0.tgz#ab0d7176d9dea434e66badadaf92237865eab1ec"
  dependencies:
@@ -452,18 +418,6 @@ babel-eslint@^6.1.2:
    lodash.assign "^4.0.0"
    lodash.pickby "^4.0.0"

-babel-generator@^6.17.0:
-  version "6.17.0"
-  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.17.0.tgz#b894e3808beef7800f2550635bfe024b6226cf33"
-  dependencies:
-    babel-messages "^6.8.0"
-    babel-runtime "^6.9.0"
-    babel-types "^6.16.0"
-    detect-indent "^3.0.1"
-    jsesc "^1.3.0"
-    lodash "^4.2.0"
-    source-map "^0.5.0"
-
 babel-generator@^6.20.0:
  version "6.20.0"
  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.20.0.tgz#fee63614e0449390103b3097f3f6a118016c6766"
@@ -1110,20 +1064,20 @@ babel-register@^6.18.0:
    mkdirp "^0.5.1"
    source-map-support "^0.4.2"

-babel-runtime@6.x.x, babel-runtime@^6.0.0, babel-runtime@^6.11.6, babel-runtime@^6.2.0, babel-runtime@^6.5.0, babel-runtime@^6.9.0, babel-runtime@^6.9.1, babel-runtime@^6.9.2:
-  version "6.11.6"
-  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.11.6.tgz#6db707fef2d49c49bfa3cb64efdb436b518b8222"
-  dependencies:
-    core-js "^2.4.0"
-    regenerator-runtime "^0.9.5"
-
-babel-runtime@^6.20.0:
+babel-runtime@6.x.x, babel-runtime@^6.0.0, babel-runtime@^6.2.0, babel-runtime@^6.20.0, babel-runtime@^6.5.0:
  version "6.20.0"
  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.20.0.tgz#87300bdcf4cd770f09bf0048c64204e17806d16f"
  dependencies:
    core-js "^2.4.0"
    regenerator-runtime "^0.10.0"

+babel-runtime@^6.11.6, babel-runtime@^6.9.0, babel-runtime@^6.9.1, babel-runtime@^6.9.2:
+  version "6.11.6"
+  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.11.6.tgz#6db707fef2d49c49bfa3cb64efdb436b518b8222"
+  dependencies:
+    core-js "^2.4.0"
+    regenerator-runtime "^0.9.5"
+
 babel-template@^6.14.0, babel-template@^6.15.0, babel-template@^6.16.0, babel-template@^6.3.0, babel-template@^6.8.0, babel-template@^6.9.0:
  version "6.16.0"
  resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.16.0.tgz#e149dd1a9f03a35f817ddbc4d0481988e7ebc8ca"
@@ -1134,21 +1088,7 @@ babel-template@^6.14.0, babel-template@^6.15.0, babel-template@^6.16.0, babel-te
    babylon "^6.11.0"
    lodash "^4.2.0"

-babel-traverse@^6.0.20, babel-traverse@^6.14.0, babel-traverse@^6.15.0, babel-traverse@^6.16.0, babel-traverse@^6.8.0:
-  version "6.16.0"
-  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.16.0.tgz#fba85ae1fd4d107de9ce003149cc57f53bef0c4f"
-  dependencies:
-    babel-code-frame "^6.16.0"
-    babel-messages "^6.8.0"
-    babel-runtime "^6.9.0"
-    babel-types "^6.16.0"
-    babylon "^6.11.0"
-    debug "^2.2.0"
-    globals "^8.3.0"
-    invariant "^2.2.0"
-    lodash "^4.2.0"
-
-babel-traverse@^6.20.0:
+babel-traverse@^6.0.20, babel-traverse@^6.14.0, babel-traverse@^6.15.0, babel-traverse@^6.16.0, babel-traverse@^6.20.0, babel-traverse@^6.8.0:
  version "6.20.0"
  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.20.0.tgz#5378d1a743e3d856e6a52289994100bbdfd9872a"
  dependencies:
@@ -1162,16 +1102,7 @@ babel-traverse@^6.20.0:
    invariant "^2.2.0"
    lodash "^4.2.0"

-babel-types@^6.0.19, babel-types@^6.13.0, babel-types@^6.14.0, babel-types@^6.15.0, babel-types@^6.16.0, babel-types@^6.8.0, babel-types@^6.9.0:
-  version "6.16.0"
-  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.16.0.tgz#71cca1dbe5337766225c5c193071e8ebcbcffcfe"
-  dependencies:
-    babel-runtime "^6.9.1"
-    esutils "^2.0.2"
-    lodash "^4.2.0"
-    to-fast-properties "^1.0.1"
-
-babel-types@^6.20.0:
+babel-types@^6.0.19, babel-types@^6.13.0, babel-types@^6.14.0, babel-types@^6.15.0, babel-types@^6.16.0, babel-types@^6.20.0, babel-types@^6.8.0, babel-types@^6.9.0:
  version "6.20.0"
  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.20.0.tgz#3869ecb98459533b37df809886b3f7f3b08d2baa"
  dependencies:
@@ -2092,14 +2023,6 @@ detect-file@^0.1.0:
  dependencies:
    fs-exists-sync "^0.1.0"

-detect-indent@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-3.0.1.tgz#9dc5e5ddbceef8325764b9451b02bc6d54084f75"
-  dependencies:
-    get-stdin "^4.0.1"
-    minimist "^1.1.0"
-    repeating "^1.1.0"
-
 detect-indent@^4.0.0:
  version "4.0.0"
  resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-4.0.0.tgz#f76d064352cdf43a1cb6ce619c4ee3a9475de208"
@@ -3064,10 +2987,6 @@ global-prefix@^0.1.4:
    osenv "^0.1.3"
    which "^1.2.10"

-globals@^8.3.0:
-  version "8.18.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-8.18.0.tgz#93d4a62bdcac38cfafafc47d6b034768cb0ffcb4"
-
 globals@^9.0.0, globals@^9.2.0:
  version "9.12.0"
  resolved "https://registry.yarnpkg.com/globals/-/globals-9.12.0.tgz#992ce90828c3a55fa8f16fada177adb64664cf9d"
@@ -3854,10 +3773,6 @@ json3@3.3.2, json3@^3.3.2:
  version "3.3.2"
  resolved "https://registry.yarnpkg.com/json3/-/json3-3.3.2.tgz#3c0434743df93e2f5c42aee7b19bcb483575f4e1"

-json5@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/json5/-/json5-0.4.0.tgz#054352e4c4c80c86c0923877d449de176a732c8d"
-
 json5@^0.5.0:
  version "0.5.0"
  resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.0.tgz#9b20715b026cbe3778fd769edccd822d8332a5b2"
@@ -5666,6 +5581,10 @@ react-ansi-style@^1.0.0:
    ansi-style-parser "^1.0.1"
    js-managed-css "^1.4.1"

+react-collapse@^2.3.3:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/react-collapse/-/react-collapse-2.3.3.tgz#68c70f1fceeaf375e3599b95710cc51e5dd339a3"
+
 "react-dom@^0.14.0 || ^15.0.0", react-dom@^15.2.1:
  version "15.3.2"
  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-15.3.2.tgz#c46b0aa5380d7b838e7a59c4a7beff2ed315531f"
@@ -5684,6 +5603,10 @@ react-fuzzy@^0.2.3:
    classnames "^2.2.3"
    fuse.js "^2.2.0"

+react-height@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/react-height/-/react-height-2.1.1.tgz#14c27a8e3a7e43a17dd128c8f3ee00f03b0001c2"
+
 react-hot-api@^0.4.5:
  version "0.4.7"
  resolved "https://registry.yarnpkg.com/react-hot-api/-/react-hot-api-0.4.7.tgz#a7e22a56d252e11abd9366b61264cf4492c58171"
@@ -6049,12 +5972,6 @@ repeat-string@^1.5.2:
  version "1.5.4"
  resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.5.4.tgz#64ec0c91e0f4b475f90d5b643651e3e6e5b6c2d5"

-repeating@^1.1.0:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/repeating/-/repeating-1.1.3.tgz#3d4114218877537494f97f77f9785fab810fa4ac"
-  dependencies:
-    is-finite "^1.0.0"
-
 repeating@^2.0.0:
  version "2.0.1"
  resolved "https://registry.yarnpkg.com/repeating/-/repeating-2.0.1.tgz#5214c53a926d3552707527fbab415dbc08d06dda"
@@ -6325,10 +6242,6 @@ shallowequal@0.2.x:
  dependencies:
    lodash.keys "^3.1.2"

-shebang-regex@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-1.0.0.tgz#da42f49740c0b42db2ca9728571cb190c98efea3"
-
 shelljs@^0.6.0:
  version "0.6.1"
  resolved "https://registry.yarnpkg.com/shelljs/-/shelljs-0.6.1.tgz#ec6211bed1920442088fe0f70b2837232ed2c8a8"