Merge branch '1266' of github.com:yldio/joyent-portal into 1266

2018-02-27 13:17:18 +00:00 · 2018-02-27 13:17:18 +00:00 · f3afb90557
parent c6db1017fe 67499bdcfa
commit f3afb90557
10 changed files with 129 additions and 114 deletions
--- a/packages/my-joy-beta/src/components/create-instance/tests/snapshots/package.spec.js.snap
+++ b/packages/my-joy-beta/src/components/create-instance/tests/snapshots/package.spec.js.snap
@ -418,7 +418,7 @@ exports[`renders <Filters /> without throwing 1`] = `
          checked={false}
          className="c5"
          disabled={false}
-          id="l"
+          id="m"
          onBlur={undefined}
          type="checkbox"
        >
@ -426,25 +426,25 @@ exports[`renders <Filters /> without throwing 1`] = `
            checked={false}
            className="c6"
            disabled={false}
-            id="m"
+            id="n"
            onBlur={undefined}
            type="checkbox"
          />
          <label
            className="c7"
-            htmlFor="m"
+            htmlFor="n"
          />
        </div>
        <div
          checked={false}
          className="c8"
          disabled={false}
-          id="l"
+          id="m"
          onBlur={undefined}
        >
          <label
            className="c9"
-            htmlFor="m"
+            htmlFor="n"
          >
            <div
              className="c10"
@ -484,7 +484,7 @@ exports[`renders <Filters /> without throwing 1`] = `
          checked={false}
          className="c5"
          disabled={false}
-          id="n"
+          id="o"
          onBlur={undefined}
          type="checkbox"
        >
@ -492,25 +492,25 @@ exports[`renders <Filters /> without throwing 1`] = `
            checked={false}
            className="c6"
            disabled={false}
-            id="o"
+            id="p"
            onBlur={undefined}
            type="checkbox"
          />
          <label
            className="c7"
-            htmlFor="o"
+            htmlFor="p"
          />
        </div>
        <div
          checked={false}
          className="c8"
          disabled={false}
-          id="n"
+          id="o"
          onBlur={undefined}
        >
          <label
            className="c9"
-            htmlFor="o"
+            htmlFor="p"
          >
            <div
              className="c10"
@ -550,7 +550,7 @@ exports[`renders <Filters /> without throwing 1`] = `
          checked={false}
          className="c5"
          disabled={false}
-          id="p"
+          id="q"
          onBlur={undefined}
          type="checkbox"
        >
@ -558,25 +558,25 @@ exports[`renders <Filters /> without throwing 1`] = `
            checked={false}
            className="c6"
            disabled={false}
-            id="q"
+            id="r"
            onBlur={undefined}
            type="checkbox"
          />
          <label
            className="c7"
-            htmlFor="q"
+            htmlFor="r"
          />
        </div>
        <div
          checked={false}
          className="c8"
          disabled={false}
-          id="p"
+          id="q"
          onBlur={undefined}
        >
          <label
            className="c9"
-            htmlFor="q"
+            htmlFor="r"
          >
            <div
              className="c10"
@ -616,7 +616,7 @@ exports[`renders <Filters /> without throwing 1`] = `
          checked={false}
          className="c5"
          disabled={false}
-          id="r"
+          id="s"
          onBlur={undefined}
          type="checkbox"
        >
@ -624,25 +624,25 @@ exports[`renders <Filters /> without throwing 1`] = `
            checked={false}
            className="c6"
            disabled={false}
-            id="s"
+            id="t"
            onBlur={undefined}
            type="checkbox"
          />
          <label
            className="c7"
-            htmlFor="s"
+            htmlFor="t"
          />
        </div>
        <div
          checked={false}
          className="c8"
          disabled={false}
-          id="r"
+          id="s"
          onBlur={undefined}
        >
          <label
            className="c9"
-            htmlFor="s"
+            htmlFor="t"
          >
            <div
              className="c10"
@ -689,7 +689,7 @@ exports[`renders <Filters /> without throwing 1`] = `
          checked={false}
          className="c5"
          disabled={false}
-          id="t"
+          id="u"
          onBlur={undefined}
          type="checkbox"
        >
@ -697,25 +697,25 @@ exports[`renders <Filters /> without throwing 1`] = `
            checked={false}
            className="c6"
            disabled={false}
-            id="u"
+            id="v"
            onBlur={undefined}
            type="checkbox"
          />
          <label
            className="c7"
-            htmlFor="u"
+            htmlFor="v"
          />
        </div>
        <div
          checked={false}
          className="c8"
          disabled={false}
-          id="t"
+          id="u"
          onBlur={undefined}
        >
          <label
            className="c9"
-            htmlFor="u"
+            htmlFor="v"
          >
            SSD
          </label>
@ -927,12 +927,12 @@ Array [
 `;

 exports[`renders <Package /> without throwing 1`] = `
-.c9 {
+.c10 {
  margin-right: 0.75rem;
  margin-left: 0.375rem;
 }

-.c8 {
+.c9 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
@ -956,7 +956,7 @@ exports[`renders <Package /> without throwing 1`] = `
  align-items: center;
 }

-.c5 {
+.c6 {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
@ -966,60 +966,60 @@ exports[`renders <Package /> without throwing 1`] = `
  display: none;
 }

-.c5[type='checkbox'],
-.c5[type='radio'] {
+.c6[type='checkbox'],
+.c6[type='radio'] {
  box-sizing: border-box;
  padding: 0;
 }

-.c5[type='number']::-webkit-inner-spin-button,
-.c5[type='number']::-webkit-outer-spin-button {
+.c6[type='number']::-webkit-inner-spin-button,
+.c6[type='number']::-webkit-outer-spin-button {
  height: auto;
 }

-.c5[type='search'] {
+.c6[type='search'] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
  outline-offset: -0.125rem;
 }

-.c5[type='search']::-webkit-search-cancel-button,
-.c5[type='search']::-webkit-search-decoration {
+.c6[type='search']::-webkit-search-cancel-button,
+.c6[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
 }

-.c5::-webkit-file-upload-button {
+.c6::-webkit-file-upload-button {
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  font: inherit;
 }

-.c5:checked + label::after {
+.c6:checked + label::after {
  opacity: 1;
 }

-.c5:selected + label::after {
+.c6:selected + label::after {
  opacity: 1;
 }

-.c5:checked + label {
+.c6:checked + label {
  border-color: rgb(59,70,204);
 }

-.c5:selected + label {
+.c6:selected + label {
  border-color: rgb(59,70,204);
 }

-.c5:disabled + label {
+.c6:disabled + label {
  background-color: rgb(249,249,249);
  cursor: not-allowed;
 }

-.c10 {
+.c11 {
  font-size: 0.9375rem;
  line-height: 1.125rem;
  font-style: normal;
@ -1034,7 +1034,7 @@ exports[`renders <Package /> without throwing 1`] = `
  font-size: 0.8125rem;
 }

-.c6 {
+.c7 {
  color: rgb(100,100,100);
  position: absolute;
  width: 1.125rem;
@ -1052,7 +1052,7 @@ exports[`renders <Package /> without throwing 1`] = `
  border-radius: 50%;
 }

-.c6::after {
+.c7::after {
  opacity: 0;
  content: '';
  position: absolute;
@ -1067,7 +1067,7 @@ exports[`renders <Package /> without throwing 1`] = `
  transform: translateX(-50%) translateY(-50%);
 }

-.c4 {
+.c5 {
  display: inline-block;
  vertical-align: text-bottom;
  width: 1.125rem;
@ -1076,16 +1076,32 @@ exports[`renders <Package /> without throwing 1`] = `
  cursor: pointer;
 }

-.c7 {
+.c8 {
  margin-left: 0.75rem;
 }

-.c7 label {
+.c8 label {
  font-weight: normal;
  font-size: 0.9375rem;
 }

 .c3 {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  overflow: hidden;
+  height: auto;
+  -webkit-margin-start: 0;
+  -webkit-margin-end: 0;
+  -webkit-padding-before: 0;
+  -webkit-padding-start: 0;
+  -webkit-padding-end: 0;
+  -webkit-padding-after: 0;
+  width: 100%;
+}
+
+.c4 {
  list-style-type: none;
  display: -webkit-box;
  display: -webkit-flex;
@ -1151,61 +1167,67 @@ exports[`renders <Package /> without throwing 1`] = `
    name="td"
    selected={false}
  >
-    <li
-      checked={false}
-      className="c3"
-      disabled={false}
-      onBlur={null}
+    <div
+      className="baseline-jVaZNU kXgQxt c3"
+      name="package"
+      role="group"
+      style={undefined}
+      type="radio"
+      value={undefined}
    >
-      <div
-        checked={false}
+      <li
        className="c4"
        disabled={false}
-        id=""
        onBlur={null}
-        type="radio"
      >
-        <input
-          checked={false}
+        <div
          className="c5"
          disabled={false}
          id="k"
          onBlur={null}
          type="radio"
-        />
-        <label
-          className="c6"
-          htmlFor="k"
-        />
-      </div>
-      <div
-        checked={false}
-        className="c7"
-        disabled={false}
-        id=""
-        onBlur={null}
-      >
+        >
+          <input
+            checked={undefined}
+            className="c6"
+            disabled={false}
+            id="l"
+            onBlur={null}
+            type="radio"
+          />
+          <label
+            className="c7"
+            htmlFor="l"
+          />
+        </div>
        <div
          className="c8"
+          disabled={false}
+          id="k"
+          onBlur={null}
        >
          <div
            className="c9"
          >
-            <label
+            <div
              className="c10"
-              htmlFor="k"
-              style={
-                Object {
-                  "fontWeight": "normal",
-                }
-              }
            >
-              test
-            </label>
+              <label
+                className="c11"
+                htmlFor="l"
+                style={
+                  Object {
+                    "fontWeight": "normal",
+                  }
+                }
+              >
+                test
+              </label>
+            </div>
          </div>
        </div>
-      </div>
-    </li>
+      </li>
+    </div>
  </td>
  <td
    className="c2"
--- a/packages/my-joy-beta/src/components/create-instance/package.js
+++ b/packages/my-joy-beta/src/components/create-instance/package.js
@ -130,9 +130,10 @@ export const Package = ({
  sortBy,
  onRowClick
 }) => (
-  <TableTrActionable onClick={() => onRowClick({ id, selected })}>
+  <TableTrActionable onClick={() => onRowClick(id)}>
    <TableTd right selected={selected}>
-        <Radio onBlur={null} noMargin checked={selected}>
+      <FormGroup name="package" value={id} type="radio" field={Field} fluid>
+        <Radio onBlur={null} noMargin>
          <Flex alignCenter>
            {GroupIcons[group]}
            <Margin left={1} right={2}>
@ -144,6 +145,7 @@ export const Package = ({
            </Margin>
          </Flex>
        </Radio>
+      </FormGroup>
    </TableTd>
    <TableTd right selected={selected} bold={sortBy === 'memory'}>
      {bytes(memory, { decimalPlaces: 0, unitSeparator: ' ' })}
--- a/packages/my-joy-beta/src/components/instances/tests/snapshots.spec.js
+++ b/packages/my-joy-beta/src/components/instances/tests/snapshots.spec.js
@ -25,8 +25,8 @@ it('renders <Item mutating /> without throwing', () => {
        <Theme>
          <Table>
            <TableTbody>
-              <Item mutating='start' />
-              <Item mutating='remove' />
+              <Item mutating="start" />
+              <Item mutating="remove" />
            </TableTbody>
          </Table>
        </Theme>
--- a/packages/my-joy-beta/src/components/instances/tests/snapshots.ui.js
+++ b/packages/my-joy-beta/src/components/instances/tests/snapshots.ui.js
@ -26,8 +26,8 @@ it('<Item mutating />', async () => {
      <Theme ss>
        <Table>
          <TableTbody>
-            <Item mutating='start' />
-            <Item mutating='remove' />
+            <Item mutating="start" />
+            <Item mutating="remove" />
          </TableTbody>
        </Table>
      </Theme>
--- a/packages/my-joy-beta/src/components/instances/snapshots.js
+++ b/packages/my-joy-beta/src/components/instances/snapshots.js
@ -35,14 +35,7 @@ const loadingState = {
  remove: 'Removing...'
 };

-export const Item = ({
-  name,
-  state,
-  created,
-  onStart,
-  onRemove,
-  mutating
-}) => (
+export const Item = ({ name, state, created, onStart, onRemove, mutating }) => (
  <TableTr>
    {!mutating ? (
      <Fragment>
--- a/packages/my-joy-beta/src/components/navigation/tests/snapshots/menu.spec.js.snap
+++ b/packages/my-joy-beta/src/components/navigation/tests/snapshots/menu.spec.js.snap
@ -75,7 +75,8 @@ exports[`renders <Menu links /> without throwing 1`] = `
  padding: 0.8125rem 0rem;
  margin: 1.125rem 0 0 0;
  max-height: 50px;
-  overflow-x: scroll;
+  overflow-x: auto;
+  overflow-y: hidden;
  box-sizing: border-box;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
--- a/packages/my-joy-beta/src/containers/create-instance/tests/snapshots/metadata.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/create-instance/tests/snapshots/metadata.spec.js.snap
@ -3394,7 +3394,7 @@ Array [
                            className="c7"
                        >
                            <span>
-                                hello—
+                                hello: 
                            </span>
                            <span>
                                world
@ -4563,7 +4563,7 @@ Array [
                            className="c7"
                        >
                            <span>
-                                hello2—
+                                hello2: 
                            </span>
                            <span>
                                world2
@ -6003,7 +6003,7 @@ Array [
                            className="c7"
                        >
                            <span>
-                                hello—
+                                hello: 
                            </span>
                            <span>
                                world
@ -7191,7 +7191,7 @@ Array [
                            className="c7"
                        >
                            <span>
-                                hello2—
+                                hello2: 
                            </span>
                            <span>
                                world2
--- a/packages/my-joy-beta/src/containers/create-instance/affinity.js
+++ b/packages/my-joy-beta/src/containers/create-instance/affinity.js
@ -20,7 +20,7 @@ const FORM_NAME_EDIT = i => `CREATE-INSTANCE-AFFINITY-EDIT-${i}`;

 const RULE_DEFAULTS = {
  'rule-instance-name': '',
-  'rule-instance-conditional': 'must',
+  'rule-instance-conditional': 'should',
  'rule-instance-placement': 'same',
  'rule-instance-tag-key-pattern': 'equalling',
  'rule-instance-tag-value-pattern': 'equalling',
--- a/packages/my-joy-beta/src/containers/create-instance/package.js
+++ b/packages/my-joy-beta/src/containers/create-instance/package.js
@ -76,7 +76,8 @@ const PackageContainer = ({
      {props =>
        !loading && expanded ? (
          <Filters {...props} onResetFilters={handleResetFilters} />
-        ) : null}
+        ) : null
+      }
    </ReduxForm>
    <ReduxForm
      form={FORM_NAME}
@ -112,7 +113,8 @@ const PackageContainer = ({
          )
        ) : selected.id ? (
          <Overview {...selected} hasVms={hasVms} onCancel={handleEdit} />
-        ) : null}
+        ) : null
+      }
    </ReduxForm>
    {expanded ? (
      !loading ? (
@ -190,11 +192,9 @@ export default compose(
      );

      const vmSelected = get(form, 'create-instance-vms.values.vms', false);
-      const pkgSelected = get(values, `selected-package`, null);
+      const pkgSelected = get(form, `${FORM_NAME}.values.package`, null);
      const selected = find(packages, ['id', pkgSelected]);

-      console.log(pkgSelected);
-
      const sorted = sortBy(packages, [_sortBy]);

      let filtered = sorted
@ -239,11 +239,8 @@ export default compose(
      handleResetFilters: () => {
        dispatch(destroy(`${FORM_NAME}-filters`));
      },
-      handleRowClick: ({ id }) => {
-        dispatch(set({
-          name: 'selected-package',
-          value: id
-        }));
+      handleRowClick: id => {
+        dispatch(change(FORM_NAME, 'package', id));
      },
      handleSortBy: (newSortBy, sortOrder) => {
        dispatch([
--- a/packages/my-joy-beta/src/containers/instances/tests/snapshots/tags.spec.js.snap
+++ b/packages/my-joy-beta/src/containers/instances/tests/snapshots/tags.spec.js.snap
@ -3624,7 +3624,7 @@ exports[`renders <Tags editing /> without throwing 1`] = `
                className="c23"
              >
                <span>
-                  name1:
+                  name1: 
                </span>
                <span>
                  value1
@ -5159,7 +5159,7 @@ exports[`renders <Tags editing.removing /> without throwing 1`] = `
                className="c23"
              >
                <span>
-                  name1:
+                  name1: 
                </span>
                <span>
                  value1