Spearhead
/
joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix(my-joy-beta): create instance - packages ui fixes 

fixes #1007
This commit is contained in:
Sara Vieira 2018-01-16 15:34:54 +00:00 committed by Sérgio Ramos
parent 74a4b82006
commit 35c50de56b
18 changed files with 830 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/my-joy-beta/package.json
View File

@ -22,6 +22,7 @@
"@manaflair/redux-batch": "^0.1.0",
"apollo": "^0.2.2",
"apr-intercept": "^1.0.4",
"bytes": "^3.0.0",
"clipboard-copy": "^1.2.0",
"constant-case": "^2.0.0",
"date-fns": "^1.29.0",
@ -37,7 +38,6 @@
"lunr": "^2.1.5",
"normalized-styled-components": "^1.0.17",
"param-case": "^2.1.1",
"prettysize": "^1.1.0",
"prop-types": "^15.6.0",
"react": "^16.2.0",
"react-apollo": "^1.4.16",

2
packages/my-joy-beta/src/assets/debian.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy</title><path d="M24.37 22.2c-.7 0 .1.4 1 .5a4.35 4.35 0 0 0 .7-.6 9.15 9.15 0 0 1-1.7.1M28.17 21.2a4.76 4.76 0 0 0 .8-1.8 3.1 3.1 0 0 1-.6 1.3c-1.3.8-.1-.5 0-1-1.4 1.7-.2 1-.2 1.5M29.47 17.6c.1-1.3-.2-.9-.4-.4.2.1.3.9.4.4M21.77.5c.4.1.8.1.7.2.4-.1.5-.2-.7-.2M22.47.7l-.3.1.3-.1"/><path d="M34.07 18.1a5.59 5.59 0 0 1-.7 2.6l-.6.3c-.5 1 0 .6-.3 1.4a22.09 22.09 0 0 1-2.8 2.3c-.4 0 .2-.4.3-.6-1 .7-.8 1.1-2.4 1.5v-.1c-3.9 1.8-9.3-1.8-9.2-6.7 0 .3-.1.2-.2.4a6.2 6.2 0 0 1 3.5-6.1 5.69 5.69 0 0 1 6.5.9 5.88 5.88 0 0 0-4.8-2.3 5.06 5.06 0 0 0-4.6 2.8c-1.1.7-1.2 2.6-1.6 2.9-.6 4.5 1.2 6.5 4.2 8.8.5.3.1.4.2.6a10.52 10.52 0 0 1-2.7-2 5.39 5.39 0 0 0 1.4 1.6c-.9-.3-2.2-2.3-2.6-2.4 1.6 2.9 6.6 5.1 9.2 4a12.11 12.11 0 0 1-4.1-.5c-.6-.3-1.3-.9-1.2-1a10.14 10.14 0 0 0 10.3-1.5c.8-.6 1.6-1.6 1.9-1.7-.4.6.1.3-.2.8.8-1.3-.3-.5.8-2.2l.4.6c-.2-1 1.3-2.3 1.1-4 .3-.5.4.5 0 1.7.5-1.3.1-1.5.3-2.6.1.4.3.7.4 1.1a4.71 4.71 0 0 1 .5-2.8c-.2-.1-.5.6-.6-.9 0-.6.2-.3.2-.5A3.3 3.3 0 0 1 36 13c.1-.2.4.6.6.6-.1-.7-.3-1.3-.4-1.9-.6-1.2-.2.2-.7-.5-.6-1.9.5-.4.6-1.3a14.09 14.09 0 0 1 1.7 4.3 15.83 15.83 0 0 0-.9-3.1c.3.1-.5-2.2.4-.7a14.05 14.05 0 0 0-6.4-7.7c.3.3.7.7.6.7-1.3-.8-1.1-.8-1.3-1.2-1.1-.4-1.1 0-1.9 0A16.23 16.23 0 0 0 24 .6l.1.4c-1.3-.4-1.6.2-3 0-.1-.1.5-.2.9-.3-1.3.2-1.2-.3-2.5 0a8.79 8.79 0 0 1 1-.6c-1.1.1-2.5.6-2.1.1-1.7.8-4.8 1.9-6.5 3.5l-.1-.4c-.8.9-3.4 2.8-3.6 4.1H8a21.4 21.4 0 0 0-1 2.2c-.5.9-.8.4-.7.5a24.48 24.48 0 0 0-2 5.4c.3.5 0 2.9.1 4.8-.5 9.6 6.7 18.9 14.6 21a15.34 15.34 0 0 0 4.4.4c-1.7-.5-2-.3-3.6-.9a7.56 7.56 0 0 1-2.3-2l.3.6c-1.7-.6-1-.7-2.4-1.2l.4-.5a2.91 2.91 0 0 1-1.7-1.4h-.6c-.7-.9-1.1-1.5-1.1-2l-.2.3c-.2-.4-2.7-3.3-1.4-2.6a3 3 0 0 1-.9-1l.3-.3a6 6 0 0 1-1.1-2.1 1.41 1.41 0 0 0 .8.6c-1.5-3.8-1.6-.2-2.8-3.9h.2c-.2-.3-.3-.6-.5-.9l.1-1.1c-1.1-1.3-.3-5.4-.1-7.7.1-.9.9-1.9 1.5-3.5l-.4-.1c.7-1.3 4.1-5 5.7-4.8.8-1-.2 0-.3-.2 1.7-1.7 2.2-1.2 3.3-1.5 1.2-.7-1 .3-.5-.3 2.1-.5 1.5-1.2 4.2-1.5.3.2-.7.3-.9.5 1.7-.9 5.5-.7 8 .5 2.8 1.3 6.1 5.3 6.2 9h.1c-.1 1.5.2 3.2-.3 4.7l.7-.3"/><path d="M16.77 23.1l-.1.5a12.38 12.38 0 0 0 1.4 1.8c-.4-.8-.7-1.2-1.3-2.3M17.87 23.1a4.05 4.05 0 0 1-.5-.9 7.14 7.14 0 0 0 .8 1.5l-.3-.6M37 18.9l-.1.3a14.58 14.58 0 0 1-1.2 3.9 11.34 11.34 0 0 0 1.3-4.2M21.87.2a9.85 9.85 0 0 1 1.7-.2c-.7.1-1.3.1-1.9.2h.2M5.37 9c.1 1-.8 1.4.2.7.5-1.2-.2-.3-.2-.7M4.27 13.6a5.56 5.56 0 0 0 .3-1.5c-.6.8-.2 1-.3 1.5"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy</title><path d="M24.37 22.2c-.7 0 .1.4 1 .5a4.35 4.35 0 0 0 .7-.6 9.15 9.15 0 0 1-1.7.1m3.8-1a4.76 4.76 0 0 0 .8-1.8 3.1 3.1 0 0 1-.6 1.3c-1.3.8-.1-.5 0-1-1.4 1.7-.2 1-.2 1.5m1.3-3.6c.1-1.3-.2-.9-.4-.4.2.1.3.9.4.4M21.77.5c.4.1.8.1.7.2.4-.1.5-.2-.7-.2m.7.2l-.3.1.3-.1"/><path d="M34.07 18.1a5.59 5.59 0 0 1-.7 2.6l-.6.3c-.5 1 0 .6-.3 1.4a22.09 22.09 0 0 1-2.8 2.3c-.4 0 .2-.4.3-.6-1 .7-.8 1.1-2.4 1.5v-.1c-3.9 1.8-9.3-1.8-9.2-6.7 0 .3-.1.2-.2.4a6.2 6.2 0 0 1 3.5-6.1 5.69 5.69 0 0 1 6.5.9 5.88 5.88 0 0 0-4.8-2.3 5.06 5.06 0 0 0-4.6 2.8c-1.1.7-1.2 2.6-1.6 2.9-.6 4.5 1.2 6.5 4.2 8.8.5.3.1.4.2.6a10.52 10.52 0 0 1-2.7-2 5.39 5.39 0 0 0 1.4 1.6c-.9-.3-2.2-2.3-2.6-2.4 1.6 2.9 6.6 5.1 9.2 4a12.11 12.11 0 0 1-4.1-.5c-.6-.3-1.3-.9-1.2-1a10.14 10.14 0 0 0 10.3-1.5c.8-.6 1.6-1.6 1.9-1.7-.4.6.1.3-.2.8.8-1.3-.3-.5.8-2.2l.4.6c-.2-1 1.3-2.3 1.1-4 .3-.5.4.5 0 1.7.5-1.3.1-1.5.3-2.6.1.4.3.7.4 1.1a4.71 4.71 0 0 1 .5-2.8c-.2-.1-.5.6-.6-.9 0-.6.2-.3.2-.5A3.3 3.3 0 0 1 36 13c.1-.2.4.6.6.6-.1-.7-.3-1.3-.4-1.9-.6-1.2-.2.2-.7-.5-.6-1.9.5-.4.6-1.3a14.09 14.09 0 0 1 1.7 4.3 15.83 15.83 0 0 0-.9-3.1c.3.1-.5-2.2.4-.7a14.05 14.05 0 0 0-6.4-7.7c.3.3.7.7.6.7-1.3-.8-1.1-.8-1.3-1.2-1.1-.4-1.1 0-1.9 0A16.23 16.23 0 0 0 24 .6l.1.4c-1.3-.4-1.6.2-3 0-.1-.1.5-.2.9-.3-1.3.2-1.2-.3-2.5 0a8.79 8.79 0 0 1 1-.6c-1.1.1-2.5.6-2.1.1-1.7.8-4.8 1.9-6.5 3.5l-.1-.4c-.8.9-3.4 2.8-3.6 4.1H8a21.4 21.4 0 0 0-1 2.2c-.5.9-.8.4-.7.5a24.48 24.48 0 0 0-2 5.4c.3.5 0 2.9.1 4.8-.5 9.6 6.7 18.9 14.6 21a15.34 15.34 0 0 0 4.4.4c-1.7-.5-2-.3-3.6-.9a7.56 7.56 0 0 1-2.3-2l.3.6c-1.7-.6-1-.7-2.4-1.2l.4-.5a2.91 2.91 0 0 1-1.7-1.4h-.6c-.7-.9-1.1-1.5-1.1-2l-.2.3c-.2-.4-2.7-3.3-1.4-2.6a3 3 0 0 1-.9-1l.3-.3a6 6 0 0 1-1.1-2.1 1.41 1.41 0 0 0 .8.6c-1.5-3.8-1.6-.2-2.8-3.9h.2c-.2-.3-.3-.6-.5-.9l.1-1.1c-1.1-1.3-.3-5.4-.1-7.7.1-.9.9-1.9 1.5-3.5l-.4-.1c.7-1.3 4.1-5 5.7-4.8.8-1-.2 0-.3-.2 1.7-1.7 2.2-1.2 3.3-1.5 1.2-.7-1 .3-.5-.3 2.1-.5 1.5-1.2 4.2-1.5.3.2-.7.3-.9.5 1.7-.9 5.5-.7 8 .5 2.8 1.3 6.1 5.3 6.2 9h.1c-.1 1.5.2 3.2-.3 4.7l.7-.3"/><path d="M16.77 23.1l-.1.5a12.38 12.38 0 0 0 1.4 1.8c-.4-.8-.7-1.2-1.3-2.3m1.1 0a4.05 4.05 0 0 1-.5-.9 7.14 7.14 0 0 0 .8 1.5l-.3-.6M37 18.9l-.1.3a14.58 14.58 0 0 1-1.2 3.9 11.34 11.34 0 0 0 1.3-4.2M21.87.2a9.85 9.85 0 0 1 1.7-.2c-.7.1-1.3.1-1.9.2h.2M5.37 9c.1 1-.8 1.4.2.7.5-1.2-.2-.3-.2-.7m-1.1 4.6a5.56 5.56 0 0 0 .3-1.5c-.6.8-.2 1-.3 1.5"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

2
packages/my-joy-beta/src/assets/ghost.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 16</title><path d="M3 30.8h14.4V38H3zM24.6 30.8H39V38H24.6zM3 16.4h36v7.2H3zM3 2h21.6v7.2H3zM31.8 2H39v7.2h-7.2z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 16</title><path d="M3 30.8h14.4V38H3zm21.6 0H39V38H24.6zM3 16.4h36v7.2H3zM3 2h21.6v7.2H3zm28.8 0H39v7.2h-7.2z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 204 B

After

Width:  |  Height:  |  Size: 201 B

2
packages/my-joy-beta/src/assets/java.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 17</title><path d="M14.79 32.38s-1.6.9 1.1 1.2a23.57 23.57 0 0 0 8.7-.4 16.47 16.47 0 0 0 2.3 1.1c-8.2 3.7-18.6 0-12.1-1.9M13.79 27.78s-1.8 1.3.9 1.6a33.65 33.65 0 0 0 11.2-.5 5.63 5.63 0 0 0 1.7 1.1c-9.9 2.9-21 .2-13.8-2.2M22.19 20c2 2.3-.5 4.4-.5 4.4s5.1-2.7 2.8-6c-2.2-3.1-3.9-4.6 5.3-10-.1.1-14.4 3.7-7.6 11.6"/><path d="M33.09 35.78s1.2 1-1.3 1.7c-4.7 1.4-19.8 1.9-23.9.1-1.5-.7 1.3-1.6 2.2-1.7a7.21 7.21 0 0 1 1.4-.2C9.79 34.48.69 38 6.89 39c16.8 2.8 30.6-1.2 26.2-3.2M15.49 23.08s-7.6 1.8-2.7 2.5a57.48 57.48 0 0 0 10.1-.1c3.2-.3 6.3-.8 6.3-.8a19.64 19.64 0 0 0-1.9 1c-7.8 2-22.7 1.1-18.4-1a14.31 14.31 0 0 1 6.6-1.6M29.19 30.68c7.9-4.1 4.2-8 1.7-7.5a6.59 6.59 0 0 0-.9.2 1 1 0 0 1 .7-.5c5-1.8 8.9 5.2-1.6 8a.35.35 0 0 0 .1-.2M24.49 0s4.4 4.4-4.1 11.1c-6.8 5.4-1.6 8.5 0 12-4-3.6-6.9-6.8-4.9-9.7 2.8-4.4 10.7-6.5 9-13.4"/><path d="M16.29 41.78c7.6.5 19.2-.3 19.5-3.8 0 0-.5 1.4-6.3 2.4a61.75 61.75 0 0 1-19.1.3s.9.8 5.9 1.1"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 17</title><path d="M14.79 32.38s-1.6.9 1.1 1.2a23.57 23.57 0 0 0 8.7-.4 16.47 16.47 0 0 0 2.3 1.1c-8.2 3.7-18.6 0-12.1-1.9m-1-4.6s-1.8 1.3.9 1.6a33.65 33.65 0 0 0 11.2-.5 5.63 5.63 0 0 0 1.7 1.1c-9.9 2.9-21 .2-13.8-2.2m8.4-7.78c2 2.3-.5 4.4-.5 4.4s5.1-2.7 2.8-6c-2.2-3.1-3.9-4.6 5.3-10-.1.1-14.4 3.7-7.6 11.6"/><path d="M33.09 35.78s1.2 1-1.3 1.7c-4.7 1.4-19.8 1.9-23.9.1-1.5-.7 1.3-1.6 2.2-1.7a7.21 7.21 0 0 1 1.4-.2C9.79 34.48.69 38 6.89 39c16.8 2.8 30.6-1.2 26.2-3.2m-17.6-12.72s-7.6 1.8-2.7 2.5a57.48 57.48 0 0 0 10.1-.1c3.2-.3 6.3-.8 6.3-.8a19.64 19.64 0 0 0-1.9 1c-7.8 2-22.7 1.1-18.4-1a14.31 14.31 0 0 1 6.6-1.6m13.7 7.6c7.9-4.1 4.2-8 1.7-7.5a6.59 6.59 0 0 0-.9.2 1 1 0 0 1 .7-.5c5-1.8 8.9 5.2-1.6 8a.35.35 0 0 0 .1-.2M24.49 0s4.4 4.4-4.1 11.1c-6.8 5.4-1.6 8.5 0 12-4-3.6-6.9-6.8-4.9-9.7 2.8-4.4 10.7-6.5 9-13.4"/><path d="M16.29 41.78c7.6.5 19.2-.3 19.5-3.8 0 0-.5 1.4-6.3 2.4a61.75 61.75 0 0 1-19.1.3s.9.8 5.9 1.1"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1022 B

After

Width:  |  Height:  |  Size: 1014 B

2
packages/my-joy-beta/src/assets/multiarch.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 43</title><path d="M19.11 22.13l-1.62 1.28a37.59 37.59 0 0 1-7.34 4.51.48.48 0 0 1-.71-.18 37.78 37.78 0 0 1-6.27-14.13A5.29 5.29 0 0 1 3 12.37a1 1 0 0 1 .26-.65C4 11 4.76 10.19 5.57 9.51c1.52-1.3 3.09-2.51 4.64-3.8.07-.06.14-.1.28-.2.07.51.12 1 .18 1.43a20.7 20.7 0 0 0 2.87 7.93 39.56 39.56 0 0 0 5.22 6.86zM22.9 19.26a40.15 40.15 0 0 1 9.1-5.84c.3-.14.43 0 .59.19A35.64 35.64 0 0 1 37.81 24c.44 1.35.73 2.75 1.1 4.12a1.87 1.87 0 0 1-.63 2.08c-1.9 1.61-3.78 3.23-5.68 4.85-.32.27-.66.51-1.08.82-.06-.53-.12-1-.17-1.45a20.15 20.15 0 0 0-2.6-7.42 38.72 38.72 0 0 0-5.53-7.39zM22.42 22.58c.93 1.25 1.84 2.44 2.7 3.66a32.47 32.47 0 0 1 3.05 5.31.51.51 0 0 1-.2.74 36.18 36.18 0 0 1-10.91 5.38c-1.39.43-2.84.7-4.27 1a1 1 0 0 1-.78-.2c-.88-.86-1.75-1.72-2.54-2.65C8.3 34.45 7.19 33 6.05 31.64q-.13-.18-.27-.39c1-.16 2-.27 3-.48a22.65 22.65 0 0 0 8.5-4c1.68-1.22 3.23-2.6 4.84-3.91zM19.62 18.78c-.7-.91-1.39-1.78-2-2.67a35.8 35.8 0 0 1-3.69-6.18.61.61 0 0 1 .2-.93 37.82 37.82 0 0 1 14.56-6.25 1.75 1.75 0 0 1 1.78.52A77.82 77.82 0 0 1 36.16 10a.78.78 0 0 1 .06.16c-.68.08-1.34.15-2 .26a21.55 21.55 0 0 0-7.71 3 40.5 40.5 0 0 0-6.46 5c-.12.1-.25.2-.43.36zM27.07 35.7l2.08-1.41a5.22 5.22 0 0 1 .27 2.09c0 .06-.26.18-.36.15-.67-.21-1.33-.44-2-.67zM5.89 26.72L7.39 29c-.8.06-1.46.12-2.12.15-.07 0-.21-.18-.2-.25a6.43 6.43 0 0 1 .82-2.18zM15 5.67l-2.14 1.41A5.47 5.47 0 0 1 12.6 5c0-.06.23-.17.32-.14.68.21 1.36.44 2 .67zM36.14 14.65l-1.45-2.12a5.14 5.14 0 0 1 2.1-.27c.06 0 .17.14.16.2a6.64 6.64 0 0 1-.81 2.19z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 43</title><path d="M19.11 22.13l-1.62 1.28a37.59 37.59 0 0 1-7.34 4.51.48.48 0 0 1-.71-.18 37.78 37.78 0 0 1-6.27-14.13A5.29 5.29 0 0 1 3 12.37a1 1 0 0 1 .26-.65C4 11 4.76 10.19 5.57 9.51c1.52-1.3 3.09-2.51 4.64-3.8.07-.06.14-.1.28-.2.07.51.12 1 .18 1.43a20.7 20.7 0 0 0 2.87 7.93 39.56 39.56 0 0 0 5.22 6.86zm3.79-2.87a40.15 40.15 0 0 1 9.1-5.84c.3-.14.43 0 .59.19A35.64 35.64 0 0 1 37.81 24c.44 1.35.73 2.75 1.1 4.12a1.87 1.87 0 0 1-.63 2.08c-1.9 1.61-3.78 3.23-5.68 4.85-.32.27-.66.51-1.08.82-.06-.53-.12-1-.17-1.45a20.15 20.15 0 0 0-2.6-7.42 38.72 38.72 0 0 0-5.53-7.39zm-.48 3.32c.93 1.25 1.84 2.44 2.7 3.66a32.47 32.47 0 0 1 3.05 5.31.51.51 0 0 1-.2.74 36.18 36.18 0 0 1-10.91 5.38c-1.39.43-2.84.7-4.27 1a1 1 0 0 1-.78-.2c-.88-.86-1.75-1.72-2.54-2.65C8.3 34.45 7.19 33 6.05 31.64q-.13-.18-.27-.39c1-.16 2-.27 3-.48a22.65 22.65 0 0 0 8.5-4c1.68-1.22 3.23-2.6 4.84-3.91zm-2.8-3.8c-.7-.91-1.39-1.78-2-2.67a35.8 35.8 0 0 1-3.69-6.18.61.61 0 0 1 .2-.93 37.82 37.82 0 0 1 14.56-6.25 1.75 1.75 0 0 1 1.78.52A77.82 77.82 0 0 1 36.16 10a.78.78 0 0 1 .06.16c-.68.08-1.34.15-2 .26a21.55 21.55 0 0 0-7.71 3 40.5 40.5 0 0 0-6.46 5c-.12.1-.25.2-.43.36zm7.45 16.92l2.08-1.41a5.22 5.22 0 0 1 .27 2.09c0 .06-.26.18-.36.15-.67-.21-1.33-.44-2-.67zM5.89 26.72L7.39 29c-.8.06-1.46.12-2.12.15-.07 0-.21-.18-.2-.25a6.43 6.43 0 0 1 .82-2.18zM15 5.67l-2.14 1.41A5.47 5.47 0 0 1 12.6 5c0-.06.23-.17.32-.14.68.21 1.36.44 2 .67zm21.14 8.98l-1.45-2.12a5.14 5.14 0 0 1 2.1-.27c.06 0 .17.14.16.2a6.64 6.64 0 0 1-.81 2.19z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

1
packages/my-joy-beta/src/assets/no-packages.svg Normal file
View File

@ -0,0 +1 @@
<svg width="79" height="60" viewBox="0 0 79 60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Guilty_Salamander</title><desc>Created using Figma</desc><use xlink:href="#a" transform="translate(23.8 22)" fill="#FAA427"/><use xlink:href="#b" transform="translate(27.3 25.5)" fill="#F3722C"/><use xlink:href="#c" transform="translate(4.8 32.1)" fill="#FAA427"/><use xlink:href="#d" transform="translate(12.2 31.8)" fill="#F3722C"/><use xlink:href="#e" transform="translate(54.4 31.9)" fill="#FAA427"/><use xlink:href="#f" transform="translate(54.4 32)" fill="#F3722C"/><use xlink:href="#g" transform="translate(15.8 26.8)" fill="#FAA427"/><use xlink:href="#h" transform="translate(5)" fill="#FAA427"/><use xlink:href="#i" transform="rotate(-15.13 41.037 5.45)" fill="#FAFBFC"/><use xlink:href="#j" transform="rotate(-15.13 67.273 -24.78)" fill="#412B13"/><use xlink:href="#k" transform="translate(2.2 8)" fill="#F3722C"/><use xlink:href="#l" transform="rotate(-74.87 40.46 -20.511)" fill="#FAFBFC"/><use xlink:href="#m" transform="rotate(-74.87 41.364 -22.098)" fill="#412B13"/><use xlink:href="#n" transform="translate(52.1 8)" fill="#F3722C"/><use xlink:href="#o" transform="translate(31.5 34.3)" fill="#F3722C"/><use xlink:href="#p" transform="translate(14.3)" fill="#F3722C"/><use xlink:href="#q" transform="translate(30.9 18.9)" fill="#F3722C"/><use xlink:href="#r" transform="translate(37.6 18.9)" fill="#F3722C"/><use xlink:href="#s" transform="translate(27.4 53.9)" fill="#FAA427"/><use xlink:href="#t" transform="translate(39.1 53.9)" fill="#FAA427"/><use xlink:href="#u" transform="translate(27.4 53.9)" fill="#F3722C"/><use xlink:href="#v" transform="translate(28.6 26.2)" fill="#342013"/><use xlink:href="#w" transform="translate(32.6 28.7)" fill="#FFF"/><defs><path id="a" d="M54.921 36.053L0 0l1.413 24.908c.359 6.249 5.752 11.145 12.283 11.145H54.92z"/><path id="b" d="M42.12 32.526L13.47 0 0 23.737c.282 4.924 4.527 8.778 9.672 8.778l32.448.01z"/><path id="c" d="M3.326 17.01a3.312 3.312 0 0 1-1.545-6.25C6.059 8.52 8.482 2.226 8.52 2.165a3.313 3.313 0 0 1 6.216 2.296c-.133.354-3.312 8.717-9.86 12.145-.475.26-1.008.4-1.55.403z"/><path id="d" d="M5.079 9.205A28.654 28.654 0 0 0 7.287 4.75a3.312 3.312 0 1 0-6.183-2.296C.781 3.234.412 3.996 0 4.734c1.33 1.181 3.544 3.152 5.079 4.471z"/><path id="e" d="M11.682 17.27a3.312 3.312 0 0 0 1.545-6.248C8.95 8.78 6.526 2.487 6.504 2.427A3.312 3.312 0 1 0 .316 4.723c.126.353 3.312 8.717 9.853 12.145.464.254.983.393 1.513.403z"/><path id="f" d="M2.45 9.01A28.33 28.33 0 0 1 .242 4.553a3.312 3.312 0 1 1 6.21-2.296c.326.78.695 1.54 1.104 2.28C6.187 5.719 3.973 7.69 2.45 9.009z"/><path id="g" d="M35.159 0H6.542A6.542 6.542 0 0 0 0 6.542v14.016a6.542 6.542 0 0 0 6.542 6.541h28.617a6.541 6.541 0 0 0 6.541-6.541V6.542A6.542 6.542 0 0 0 35.16 0z"/><path id="h" d="M54.254 0H9.026A9.026 9.026 0 0 0 0 9.026v17.207a9.026 9.026 0 0 0 9.026 9.025h45.228a9.026 9.026 0 0 0 9.025-9.026V9.027A9.026 9.026 0 0 0 54.253 0z"/><path id="i" d="M9.721 18.637c5.37 0 9.721-4.172 9.721-9.319C19.442 4.172 15.09 0 9.722 0 4.351 0 0 4.172 0 9.318c0 5.147 4.352 9.319 9.721 9.319z"/><path id="j" d="M5.19 9.959c2.865 0 5.188-2.23 5.188-4.98C10.378 2.23 8.055 0 5.19 0S0 2.23 0 4.98c0 2.75 2.323 4.979 5.19 4.979z"/><path id="k" d="M7.262.351C2.078 1.753-1.018 6.921.306 11.89l18.77-5.073C17.705 1.847 12.411-1.045 7.261.35z"/><path id="l" d="M9.318 19.442c5.147 0 9.319-4.352 9.319-9.72C18.637 4.351 14.465 0 9.318 0 4.172 0 0 4.352 0 9.721c0 5.37 4.172 9.721 9.318 9.721z"/><path id="m" d="M4.98 10.378c2.75 0 4.979-2.323 4.979-5.189S7.729 0 4.979 0C2.23 0 0 2.323 0 5.19c0 2.865 2.23 5.188 4.98 5.188z"/><path id="n" d="M11.819.351c5.178 1.402 8.28 6.57 6.95 11.538L0 6.816C1.347 1.847 6.635-1.045 11.819.35z"/><path id="o" d="M5.106 4.897A5.007 5.007 0 0 0 10.218 0H0a5.001 5.001 0 0 0 5.106 4.897z"/><path id="p" d="M0 0l22.258 18.498L44.516 0H0z"/><path id="q" d="M2.445 0A2.396 2.396 0 0 0 0 2.342h4.885a2.39 2.39 0 0 0-2.44-2.34z"/><path id="r" d="M2.462 0A2.396 2.396 0 0 0 0 2.343h4.885A2.39 2.39 0 0 0 2.462 0z"/><path id="s" d="M0 0h6.227v3.091A3.047 3.047 0 0 1 3.18 6.14h-.127A3.047 3.047 0 0 1 .006 3.09V0H0z"/><path id="t" d="M.006 0H6.22v3.091A3.047 3.047 0 0 1 3.174 6.14h-.127A3.047 3.047 0 0 1 0 3.09V0h.006z"/><path id="u" d="M31.328 0H0v1.474h31.328V0z"/><path id="v" d="M15.422 1.503A17.422 17.422 0 0 0 8.113.002 17.4 17.4 0 0 0 .805 1.503a1.457 1.457 0 0 0 .629 2.76h2.572V4.06a1.579 1.579 0 0 1 2.126-1.468 6.194 6.194 0 0 0 3.963 0 1.574 1.574 0 0 1 2.12 1.468v.204h2.572a1.463 1.463 0 0 0 .635-2.76z"/><path id="w" d="M6.072.104a6.194 6.194 0 0 1-3.963 0A1.579 1.579 0 0 0 0 1.573v.204h8.209v-.204A1.573 1.573 0 0 0 6.072.104z"/></defs></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.6 KiB

2
packages/my-joy-beta/src/assets/node.svg
View File

@ -1 +1 @@
<svg id="svg4300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><defs><style>.cls-1{fill:none}.cls-2{fill:url(#linear-gradient)}.cls-3{clip-path:url(#clip-path)}.cls-4{fill:#b4b4b4;opacity:.66;isolation:isolate}.cls-5{fill:url(#linear-gradient-2)}</style><linearGradient id="linear-gradient" x1="6" y1="127.4" x2="36" y2="127.4" gradientTransform="matrix(1 0 0 -1 0 147.4)" gradientUnits="userSpaceOnUse"><stop offset=".01"/><stop offset=".19" stop-color="#171717"/><stop offset=".54" stop-color="#3d3d3d"/><stop offset=".82" stop-color="#545454"/><stop offset="1" stop-color="#5c5c5c"/></linearGradient><clipPath id="clip-path"><path class="cls-1" d="M21.8 3.15a1.53 1.53 0 0 0-1.6 0l-13.4 7.7a1.6 1.6 0 0 0-.8 1.4v15.5a1.6 1.6 0 0 0 .8 1.4l13.4 7.7a1.53 1.53 0 0 0 1.6 0l13.4-7.7a1.6 1.6 0 0 0 .8-1.4v-15.5a1.6 1.6 0 0 0-.8-1.4z"/></clipPath><linearGradient id="linear-gradient-2" x1="5.81" y1="127.46" x2="36.75" y2="127.46" gradientTransform="matrix(1 0 0 -1 0 147.4)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5c5c5c"/><stop offset=".18" stop-color="#545454"/><stop offset=".46" stop-color="#3d3d3d"/><stop offset=".81" stop-color="#171717"/><stop offset=".99"/></linearGradient></defs><title>Artboard 1 copy 10</title><path id="_Path_" data-name="&lt;Path&gt;" class="cls-2" d="M20.2 3.15a1.53 1.53 0 0 1 1.6 0l13.4 7.7a1.6 1.6 0 0 1 .8 1.4v15.5a1.6 1.6 0 0 1-.8 1.4l-13.4 7.7a1.53 1.53 0 0 1-1.6 0l-13.4-7.7a1.6 1.6 0 0 1-.8-1.4v-15.5a1.6 1.6 0 0 1 .8-1.4z"/><g class="cls-3"><path class="cls-1" d="M20.2 3.15l-13.4 7.7a1.6 1.6 0 0 0-.8 1.4v15.5a1.28 1.28 0 0 0 .4 1L21.5 3a2.74 2.74 0 0 0-1.3.15zM21.5 37.05c.1 0 .2-.1.3-.1l13.4-7.7a1.51 1.51 0 0 0 .7-1.4v-15.5a1.49 1.49 0 0 0-.3-1z"/><path class="cls-4" d="M35.1 11L21.8 3.25c-.1-.1-.3-.1-.4-.2L6.3 28.85a1 1 0 0 0 .5.4L20.2 37a1.5 1.5 0 0 0 1.3.1l14.1-25.8c-.2-.15-.3-.25-.5-.3z"/></g><g class="cls-3"><path class="cls-1" d="M6.9 10.85l-.2.1a1.6 1.6 0 0 0-.8 1.4v15.5a1.6 1.6 0 0 0 .8 1.4L20.1 37a1.72 1.72 0 0 0 1.2.2zM35.9 12.35a1.51 1.51 0 0 0-.7-1.4l-13.3-7.7c-.1-.1-.2-.1-.4-.2l14.4 24.7z"/><path class="cls-5" d="M21.8 36.85l13.4-7.7a1.51 1.51 0 0 0 .7-1.4v-.1L21.5 3a1.53 1.53 0 0 0-1.3.2L7 10.75 21.4 37c.1.05.2 0 .4-.15z"/></g></svg>
<svg id="svg4300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><defs><style>.cls-1{fill:none}.cls-2{fill:url(#linear-gradient)}.cls-3{clip-path:url(#clip-path)}.cls-4{fill:#b4b4b4;opacity:.66;isolation:isolate}.cls-5{fill:url(#linear-gradient-2)}</style><linearGradient id="linear-gradient" x1="6" y1="127.4" x2="36" y2="127.4" gradientTransform="matrix(1 0 0 -1 0 147.4)" gradientUnits="userSpaceOnUse"><stop offset=".01"/><stop offset=".19" stop-color="#171717"/><stop offset=".54" stop-color="#3d3d3d"/><stop offset=".82" stop-color="#545454"/><stop offset="1" stop-color="#5c5c5c"/></linearGradient><clipPath id="clip-path"><path class="cls-1" d="M21.8 3.15a1.53 1.53 0 0 0-1.6 0l-13.4 7.7a1.6 1.6 0 0 0-.8 1.4v15.5a1.6 1.6 0 0 0 .8 1.4l13.4 7.7a1.53 1.53 0 0 0 1.6 0l13.4-7.7a1.6 1.6 0 0 0 .8-1.4v-15.5a1.6 1.6 0 0 0-.8-1.4z"/></clipPath><linearGradient id="linear-gradient-2" x1="5.81" y1="127.46" x2="36.75" y2="127.46" gradientTransform="matrix(1 0 0 -1 0 147.4)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#5c5c5c"/><stop offset=".18" stop-color="#545454"/><stop offset=".46" stop-color="#3d3d3d"/><stop offset=".81" stop-color="#171717"/><stop offset=".99"/></linearGradient></defs><title>Artboard 1 copy 10</title><path id="_Path_" data-name="&lt;Path&gt;" class="cls-2" d="M20.2 3.15a1.53 1.53 0 0 1 1.6 0l13.4 7.7a1.6 1.6 0 0 1 .8 1.4v15.5a1.6 1.6 0 0 1-.8 1.4l-13.4 7.7a1.53 1.53 0 0 1-1.6 0l-13.4-7.7a1.6 1.6 0 0 1-.8-1.4v-15.5a1.6 1.6 0 0 1 .8-1.4z"/><g class="cls-3"><path class="cls-1" d="M20.2 3.15l-13.4 7.7a1.6 1.6 0 0 0-.8 1.4v15.5a1.28 1.28 0 0 0 .4 1L21.5 3a2.74 2.74 0 0 0-1.3.15zm1.3 33.9c.1 0 .2-.1.3-.1l13.4-7.7a1.51 1.51 0 0 0 .7-1.4v-15.5a1.49 1.49 0 0 0-.3-1z"/><path class="cls-4" d="M35.1 11L21.8 3.25c-.1-.1-.3-.1-.4-.2L6.3 28.85a1 1 0 0 0 .5.4L20.2 37a1.5 1.5 0 0 0 1.3.1l14.1-25.8c-.2-.15-.3-.25-.5-.3z"/></g><g class="cls-3"><path class="cls-1" d="M6.9 10.85l-.2.1a1.6 1.6 0 0 0-.8 1.4v15.5a1.6 1.6 0 0 0 .8 1.4L20.1 37a1.72 1.72 0 0 0 1.2.2zm29 1.5a1.51 1.51 0 0 0-.7-1.4l-13.3-7.7c-.1-.1-.2-.1-.4-.2l14.4 24.7z"/><path class="cls-5" d="M21.8 36.85l13.4-7.7a1.51 1.51 0 0 0 .7-1.4v-.1L21.5 3a1.53 1.53 0 0 0-1.3.2L7 10.75 21.4 37c.1.05.2 0 .4-.15z"/></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

2
packages/my-joy-beta/src/assets/postgresql.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 12</title><path d="M18.67 22.9l.1-.2c.1-.3.2-.5.3-.8.6-1.3 1.3-3 .5-6.9a1.75 1.75 0 0 0-1.2-1.4 6 6 0 0 0-3.9 1.1v.3a17.45 17.45 0 0 1-.1 4.5 4.47 4.47 0 0 0 1.1 3.7 3.57 3.57 0 0 0 2.7 1.2 8.8 8.8 0 0 1 .5-1.5zm-1.3-8a.76.76 0 0 1-.2-.4c0-.1 0-.1.1-.2a1.25 1.25 0 0 1 .9-.1c.5.1.9.3.9.6s-.5.6-.9.6h-.1a1.16 1.16 0 0 1-.7-.5zM19.87 25.7c-.3-.1-.4-.2-.8.2a3.81 3.81 0 0 1-.5.6c-.6.8-.9 1.1-2.8 1.5-.4.1-.6.2-.7.2a4.88 4.88 0 0 0 .7.3c1.4.3 3.3.4 4.6-1.5.2-.2.1-.5.1-.7a1.72 1.72 0 0 0-.6-.6zM30.17 8.1a9.77 9.77 0 0 1 2.5 4.8v.3a12.31 12.31 0 0 1-.2 2 7.77 7.77 0 0 0-.2 1.6c0 .6.1 1.2.1 1.8a7 7 0 0 1-.7 5l.1.1c0 .1.1.1.1.2 4.1-6.5 5.5-14 4.2-15.6A8.51 8.51 0 0 0 29 5a12.62 12.62 0 0 0-3 .3 7.81 7.81 0 0 1 4.17 2.8z"/><path d="M31.57 14.9c.1-.5.1-1 .2-1.5-2.1-.3-2.9.2-3.2.7-1.1 1.5 1 5.3 1.9 7 .2.4.4.7.5.9l.3.6a6.87 6.87 0 0 0 .3-4 6.08 6.08 0 0 1-.1-1.9 5.15 5.15 0 0 1 .1-1.8zm-1.1-.3a.85.85 0 0 1-.6.3h-.1c-.4 0-.8-.3-.8-.5s.4-.5.8-.5.9 0 .9.3c.1.1 0 .3-.2.4zM13.37 19.4a15.94 15.94 0 0 0 .1-4.3v-.5c0-.3-.1-5.4 2.9-8.4l.1-.1c-1.8-.6-6.3-1.8-9 .2-1.7 1.2-2.47 3.4-2.3 6.6A52.73 52.73 0 0 0 7 21.1c1.3 4.1 2.7 6.7 3.9 7.1.2.1.8.3 1.6-.7 1.2-1.4 2.3-2.6 2.8-3.2-.1-.1-.3-.2-.4-.3a5.64 5.64 0 0 1-1.53-4.6z"/><path d="M39 24.9a1.72 1.72 0 0 0-1.5-1.2 2.63 2.63 0 0 0-1.2.1 7.18 7.18 0 0 1-1.9.2 34.44 34.44 0 0 0 3.8-9.1c1.3-4.9.6-7.1-.2-8.1a10.64 10.64 0 0 0-8.8-4.1 20.5 20.5 0 0 0-4.6.6 21.3 21.3 0 0 0-2.7-.2 10.18 10.18 0 0 0-4.7 1.1 22.81 22.81 0 0 0-3.3-.8c-3.2-.5-5.8-.1-7.7 1.2C3.87 6.2 2.77 9 3 13a52.13 52.13 0 0 0 1.9 8.7 25.8 25.8 0 0 0 2 5.1c1 1.9 2.1 3 3.2 3.4a3.24 3.24 0 0 0 3.2-.7 4.35 4.35 0 0 0 .7.6 5 5 0 0 0 1.3.5 6.55 6.55 0 0 0 4.4-.3v1.5a15.45 15.45 0 0 0 .6 4.4c0 .1 0 .1.1.2a5 5 0 0 0 1.3 2.3 3.74 3.74 0 0 0 2.8 1c.5 0 .9-.1 1.3-.1a5.76 5.76 0 0 0 4.1-2.4c1.1-1.5 1.6-3.8 1.7-7.5v-.5h.4a9.53 9.53 0 0 0 4.2-.7c.67-.2 3.37-1.6 2.8-3.6zm-3.4 2.8a8.45 8.45 0 0 1-3.3.6 6.05 6.05 0 0 1-1.5-.2c-.2 1.7-.6 5-.8 6.3-.4 2.5-1.6 3.7-4.2 4.3a4.87 4.87 0 0 1-1.2.1A3.75 3.75 0 0 1 21 36c-.4-1-.5-4.2-.5-7.5a4.79 4.79 0 0 1-3.3 1.2 11.14 11.14 0 0 1-1.7-.2c-.2 0-1.6-.4-1.6-1.4 0-.8 1.2-1.1 1.7-1.2 1.6-.3 1.7-.5 2.2-1.1.1-.1.2-.3.4-.4v-.1a4.2 4.2 0 0 1-2.1-.6c-.4.5-1.6 1.7-2.9 3.2a2.89 2.89 0 0 1-2.1 1.2 1.7 1.7 0 0 1-.7-.1c-1.6-.5-3.2-3.2-4.6-7.8A39.62 39.62 0 0 1 4 12.8q-.3-5.4 2.7-7.5c1.7-1.2 4-1.5 6.9-1.1a19.58 19.58 0 0 1 3.6 1A7.23 7.23 0 0 1 21.67 4a10.9 10.9 0 0 1 2.6.3 11.44 11.44 0 0 1 4.6-.7 9.74 9.74 0 0 1 8 3.7 4.6 4.6 0 0 1 .7 2.9 14.72 14.72 0 0 1-.7 4.3 34.56 34.56 0 0 1-4.5 10c.3.2 1.2.6 3.7.1.9-.2 1.4 0 1.5.5.7 1.1-1 2.1-2 2.6z"/><path d="M32.07 25.6a.1.1 0 0 1-.1-.1c-.1 0-.1 0-.2.1-.5.1-.9.3-.9 1.5a2.82 2.82 0 0 0 1.7.2 8.56 8.56 0 0 0 2.6-.5 4.83 4.83 0 0 0 1.5-1c-2.2.4-3.67.4-4.6-.2z"/><path d="M31.07 24.2A7 7 0 0 1 30 22.4a5.56 5.56 0 0 1-.4-.8c-1.1-1.9-3.3-6-1.9-8.1.7-1 2-1.3 3.9-1.1a11.91 11.91 0 0 0-2.1-3.6 10.27 10.27 0 0 0-7.7-3.7 6.41 6.41 0 0 0-4.7 1.8c-1.9 1.9-2.4 4.9-2.5 6.6.1 0 .2-.1.3-.2a8.12 8.12 0 0 1 2.5-.8 2.73 2.73 0 0 1 3.3 2.2c.9 4.3.1 6.2-.6 7.6a4.88 4.88 0 0 1-.3.7l-.1.2a12.13 12.13 0 0 0-.5 1.4 1.89 1.89 0 0 1 1.1.1 1.81 1.81 0 0 1 1.1 1.4c0 .1.1.2.1.3v.2c-.1 4.3 0 8.2.4 9.1a2.85 2.85 0 0 0 3.7 2c2.2-.5 3-1.3 3.4-3.4.3-1.6.8-6.2.9-7.2-.1-2 1-2.3 1.5-2.5-.13-.1-.23-.3-.33-.4z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 12</title><path d="M18.67 22.9l.1-.2c.1-.3.2-.5.3-.8.6-1.3 1.3-3 .5-6.9a1.75 1.75 0 0 0-1.2-1.4 6 6 0 0 0-3.9 1.1v.3a17.45 17.45 0 0 1-.1 4.5 4.47 4.47 0 0 0 1.1 3.7 3.57 3.57 0 0 0 2.7 1.2 8.8 8.8 0 0 1 .5-1.5zm-1.3-8a.76.76 0 0 1-.2-.4c0-.1 0-.1.1-.2a1.25 1.25 0 0 1 .9-.1c.5.1.9.3.9.6s-.5.6-.9.6h-.1a1.16 1.16 0 0 1-.7-.5zm2.5 10.8c-.3-.1-.4-.2-.8.2a3.81 3.81 0 0 1-.5.6c-.6.8-.9 1.1-2.8 1.5-.4.1-.6.2-.7.2a4.88 4.88 0 0 0 .7.3c1.4.3 3.3.4 4.6-1.5.2-.2.1-.5.1-.7a1.72 1.72 0 0 0-.6-.6zm10.3-17.6a9.77 9.77 0 0 1 2.5 4.8v.3a12.31 12.31 0 0 1-.2 2 7.77 7.77 0 0 0-.2 1.6c0 .6.1 1.2.1 1.8a7 7 0 0 1-.7 5l.1.1c0 .1.1.1.1.2 4.1-6.5 5.5-14 4.2-15.6A8.51 8.51 0 0 0 29 5a12.62 12.62 0 0 0-3 .3 7.81 7.81 0 0 1 4.17 2.8z"/><path d="M31.57 14.9c.1-.5.1-1 .2-1.5-2.1-.3-2.9.2-3.2.7-1.1 1.5 1 5.3 1.9 7 .2.4.4.7.5.9l.3.6a6.87 6.87 0 0 0 .3-4 6.08 6.08 0 0 1-.1-1.9 5.15 5.15 0 0 1 .1-1.8zm-1.1-.3a.85.85 0 0 1-.6.3h-.1c-.4 0-.8-.3-.8-.5s.4-.5.8-.5.9 0 .9.3c.1.1 0 .3-.2.4zm-17.1 4.8a15.94 15.94 0 0 0 .1-4.3v-.5c0-.3-.1-5.4 2.9-8.4l.1-.1c-1.8-.6-6.3-1.8-9 .2-1.7 1.2-2.47 3.4-2.3 6.6A52.73 52.73 0 0 0 7 21.1c1.3 4.1 2.7 6.7 3.9 7.1.2.1.8.3 1.6-.7 1.2-1.4 2.3-2.6 2.8-3.2-.1-.1-.3-.2-.4-.3a5.64 5.64 0 0 1-1.53-4.6z"/><path d="M39 24.9a1.72 1.72 0 0 0-1.5-1.2 2.63 2.63 0 0 0-1.2.1 7.18 7.18 0 0 1-1.9.2 34.44 34.44 0 0 0 3.8-9.1c1.3-4.9.6-7.1-.2-8.1a10.64 10.64 0 0 0-8.8-4.1 20.5 20.5 0 0 0-4.6.6 21.3 21.3 0 0 0-2.7-.2 10.18 10.18 0 0 0-4.7 1.1 22.81 22.81 0 0 0-3.3-.8c-3.2-.5-5.8-.1-7.7 1.2C3.87 6.2 2.77 9 3 13a52.13 52.13 0 0 0 1.9 8.7 25.8 25.8 0 0 0 2 5.1c1 1.9 2.1 3 3.2 3.4a3.24 3.24 0 0 0 3.2-.7 4.35 4.35 0 0 0 .7.6 5 5 0 0 0 1.3.5 6.55 6.55 0 0 0 4.4-.3v1.5a15.45 15.45 0 0 0 .6 4.4c0 .1 0 .1.1.2a5 5 0 0 0 1.3 2.3 3.74 3.74 0 0 0 2.8 1c.5 0 .9-.1 1.3-.1a5.76 5.76 0 0 0 4.1-2.4c1.1-1.5 1.6-3.8 1.7-7.5v-.5h.4a9.53 9.53 0 0 0 4.2-.7c.67-.2 3.37-1.6 2.8-3.6zm-3.4 2.8a8.45 8.45 0 0 1-3.3.6 6.05 6.05 0 0 1-1.5-.2c-.2 1.7-.6 5-.8 6.3-.4 2.5-1.6 3.7-4.2 4.3a4.87 4.87 0 0 1-1.2.1A3.75 3.75 0 0 1 21 36c-.4-1-.5-4.2-.5-7.5a4.79 4.79 0 0 1-3.3 1.2 11.14 11.14 0 0 1-1.7-.2c-.2 0-1.6-.4-1.6-1.4 0-.8 1.2-1.1 1.7-1.2 1.6-.3 1.7-.5 2.2-1.1.1-.1.2-.3.4-.4v-.1a4.2 4.2 0 0 1-2.1-.6c-.4.5-1.6 1.7-2.9 3.2a2.89 2.89 0 0 1-2.1 1.2 1.7 1.7 0 0 1-.7-.1c-1.6-.5-3.2-3.2-4.6-7.8A39.62 39.62 0 0 1 4 12.8q-.3-5.4 2.7-7.5c1.7-1.2 4-1.5 6.9-1.1a19.58 19.58 0 0 1 3.6 1A7.23 7.23 0 0 1 21.67 4a10.9 10.9 0 0 1 2.6.3 11.44 11.44 0 0 1 4.6-.7 9.74 9.74 0 0 1 8 3.7 4.6 4.6 0 0 1 .7 2.9 14.72 14.72 0 0 1-.7 4.3 34.56 34.56 0 0 1-4.5 10c.3.2 1.2.6 3.7.1.9-.2 1.4 0 1.5.5.7 1.1-1 2.1-2 2.6z"/><path d="M32.07 25.6a.1.1 0 0 1-.1-.1c-.1 0-.1 0-.2.1-.5.1-.9.3-.9 1.5a2.82 2.82 0 0 0 1.7.2 8.56 8.56 0 0 0 2.6-.5 4.83 4.83 0 0 0 1.5-1c-2.2.4-3.67.4-4.6-.2z"/><path d="M31.07 24.2A7 7 0 0 1 30 22.4a5.56 5.56 0 0 1-.4-.8c-1.1-1.9-3.3-6-1.9-8.1.7-1 2-1.3 3.9-1.1a11.91 11.91 0 0 0-2.1-3.6 10.27 10.27 0 0 0-7.7-3.7 6.41 6.41 0 0 0-4.7 1.8c-1.9 1.9-2.4 4.9-2.5 6.6.1 0 .2-.1.3-.2a8.12 8.12 0 0 1 2.5-.8 2.73 2.73 0 0 1 3.3 2.2c.9 4.3.1 6.2-.6 7.6a4.88 4.88 0 0 1-.3.7l-.1.2a12.13 12.13 0 0 0-.5 1.4 1.89 1.89 0 0 1 1.1.1 1.81 1.81 0 0 1 1.1 1.4c0 .1.1.2.1.3v.2c-.1 4.3 0 8.2.4 9.1a2.85 2.85 0 0 0 3.7 2c2.2-.5 3-1.3 3.4-3.4.3-1.6.8-6.2.9-7.2-.1-2 1-2.3 1.5-2.5-.13-.1-.23-.3-.33-.4z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.3 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

2
packages/my-joy-beta/src/assets/redis.svg
View File

@ -1 +1 @@
<svg id="svg4300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><defs><style>.cls-1,.cls-2{fill:#fff}.cls-1{opacity:.25;isolation:isolate}.cls-3{fill:#333}</style></defs><title>Artboard 1 copy 20</title><path d="M37.57 23.65c-1.9-.7-11.8-4.6-13.7-5.3s-2.7-.7-4.9.1-12.8 4.9-14.6 5.7c-.9.4-1.4.7-1.4 1.1H3v3.6c0 .4.5.7 1.5 1.2 1.9.9 12.5 5.2 14.2 6s2.9.8 5-.3 12.1-5.2 14-6.2c1-.5 1.4-.9 1.4-1.3v-3.6c-.1-.4-.53-.65-1.53-1z"/><path class="cls-1" d="M37.57 25.85c-1.9 1-11.9 5.1-14 6.2s-3.3 1.1-5 .3-12.3-5.1-14.2-6-1.9-1.5-.1-2.3 12.4-4.9 14.6-5.7 3-.8 4.9-.1 11.8 4.6 13.7 5.3 2 1.3.1 2.3z"/><path d="M37.57 17.75c-1.9-.7-11.8-4.6-13.7-5.3s-2.7-.7-4.9.1-12.8 4.9-14.6 5.7c-.9.4-1.4.7-1.4 1.1H3V23c0 .4.5.7 1.5 1.2 1.9.9 12.5 5.2 14.2 6s2.9.8 5-.3 12.1-5.2 14-6.2c1-.5 1.4-.9 1.4-1.3v-3.6c-.1-.35-.53-.75-1.53-1.05z"/><path class="cls-1" d="M37.57 20c-1.9 1-11.9 5.1-14 6.2s-3.3 1.1-5 .3-12.3-5.1-14.2-6-1.9-1.5-.1-2.3 12.4-4.9 14.6-5.7 3-.8 4.9-.1 11.8 4.6 13.7 5.3 2 1.3.1 2.3z"/><path d="M37.57 11.55c-1.9-.7-11.8-4.6-13.7-5.3s-2.7-.7-4.9.1-12.8 4.9-14.6 5.7c-.9.4-1.4.7-1.4 1.1H3v3.6c0 .4.5.7 1.5 1.2 1.9.9 12.5 5.2 14.2 6s2.9.8 5-.3 12.1-5.2 14-6.2c1-.5 1.4-.9 1.4-1.3v-3.6c-.1-.3-.53-.7-1.53-1z"/><path class="cls-1" d="M37.57 13.75c-1.9 1-11.9 5.1-14 6.2s-3.3 1.1-5 .3-12.3-5.1-14.2-6-1.9-1.5-.1-2.3 12.4-4.9 14.6-5.7 3-.8 4.9-.1 11.8 4.6 13.7 5.3 2 1.3.1 2.3z"/><path class="cls-2" d="M25.77 10.25l-3.2.4-.7 1.6-1.1-1.8-3.6-.4 2.7-.9-.8-1.5 2.5 1 2.4-.8-.7 1.5 2.5.9zM21.67 18.45l-5.8-2.4 8.4-1.3-2.6 3.7z"/><ellipse class="cls-2" cx="13.67" cy="12.95" rx="4.5" ry="1.7"/><path d="M29.37 10.75l5 1.9-5 2v-3.9z"/><path class="cls-3" d="M23.97 12.95l5.4-2.2v3.9l-.5.2-4.9-1.9z"/></svg>
<svg id="svg4300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><defs><style>.cls-1,.cls-2{fill:#fff}.cls-1{opacity:.25;isolation:isolate}.cls-3{fill:#333}</style></defs><title>Artboard 1 copy 20</title><path d="M37.57 23.65c-1.9-.7-11.8-4.6-13.7-5.3s-2.7-.7-4.9.1-12.8 4.9-14.6 5.7c-.9.4-1.4.7-1.4 1.1H3v3.6c0 .4.5.7 1.5 1.2 1.9.9 12.5 5.2 14.2 6s2.9.8 5-.3 12.1-5.2 14-6.2c1-.5 1.4-.9 1.4-1.3v-3.6c-.1-.4-.53-.65-1.53-1z"/><path class="cls-1" d="M37.57 25.85c-1.9 1-11.9 5.1-14 6.2s-3.3 1.1-5 .3-12.3-5.1-14.2-6-1.9-1.5-.1-2.3 12.4-4.9 14.6-5.7 3-.8 4.9-.1 11.8 4.6 13.7 5.3 2 1.3.1 2.3z"/><path d="M37.57 17.75c-1.9-.7-11.8-4.6-13.7-5.3s-2.7-.7-4.9.1-12.8 4.9-14.6 5.7c-.9.4-1.4.7-1.4 1.1H3V23c0 .4.5.7 1.5 1.2 1.9.9 12.5 5.2 14.2 6s2.9.8 5-.3 12.1-5.2 14-6.2c1-.5 1.4-.9 1.4-1.3v-3.6c-.1-.35-.53-.75-1.53-1.05z"/><path class="cls-1" d="M37.57 20c-1.9 1-11.9 5.1-14 6.2s-3.3 1.1-5 .3-12.3-5.1-14.2-6-1.9-1.5-.1-2.3 12.4-4.9 14.6-5.7 3-.8 4.9-.1 11.8 4.6 13.7 5.3 2 1.3.1 2.3z"/><path d="M37.57 11.55c-1.9-.7-11.8-4.6-13.7-5.3s-2.7-.7-4.9.1-12.8 4.9-14.6 5.7c-.9.4-1.4.7-1.4 1.1H3v3.6c0 .4.5.7 1.5 1.2 1.9.9 12.5 5.2 14.2 6s2.9.8 5-.3 12.1-5.2 14-6.2c1-.5 1.4-.9 1.4-1.3v-3.6c-.1-.3-.53-.7-1.53-1z"/><path class="cls-1" d="M37.57 13.75c-1.9 1-11.9 5.1-14 6.2s-3.3 1.1-5 .3-12.3-5.1-14.2-6-1.9-1.5-.1-2.3 12.4-4.9 14.6-5.7 3-.8 4.9-.1 11.8 4.6 13.7 5.3 2 1.3.1 2.3z"/><path class="cls-2" d="M25.77 10.25l-3.2.4-.7 1.6-1.1-1.8-3.6-.4 2.7-.9-.8-1.5 2.5 1 2.4-.8-.7 1.5 2.5.9zm-4.1 8.2l-5.8-2.4 8.4-1.3-2.6 3.7z"/><ellipse class="cls-2" cx="13.67" cy="12.95" rx="4.5" ry="1.7"/><path d="M29.37 10.75l5 1.9-5 2v-3.9z"/><path class="cls-3" d="M23.97 12.95l5.4-2.2v3.9l-.5.2-4.9-1.9z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

2
packages/my-joy-beta/src/assets/smart.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 43</title><path d="M19.11 22.13l-1.62 1.28a37.59 37.59 0 0 1-7.34 4.51.48.48 0 0 1-.71-.18 37.78 37.78 0 0 1-6.27-14.13A5.29 5.29 0 0 1 3 12.37a1 1 0 0 1 .26-.65C4 11 4.76 10.19 5.57 9.51c1.52-1.3 3.09-2.51 4.64-3.8.07-.06.14-.1.28-.2.07.51.12 1 .18 1.43a20.7 20.7 0 0 0 2.87 7.93 39.56 39.56 0 0 0 5.22 6.86zM22.9 19.26a40.15 40.15 0 0 1 9.1-5.84c.3-.14.43 0 .59.19A35.64 35.64 0 0 1 37.81 24c.44 1.35.73 2.75 1.1 4.12a1.87 1.87 0 0 1-.63 2.08c-1.9 1.61-3.78 3.23-5.68 4.85-.32.27-.66.51-1.08.82-.06-.53-.12-1-.17-1.45a20.15 20.15 0 0 0-2.6-7.42 38.72 38.72 0 0 0-5.53-7.39zM22.42 22.58c.93 1.25 1.84 2.44 2.7 3.66a32.47 32.47 0 0 1 3.05 5.31.51.51 0 0 1-.2.74 36.18 36.18 0 0 1-10.91 5.38c-1.39.43-2.84.7-4.27 1a1 1 0 0 1-.78-.2c-.88-.86-1.75-1.72-2.54-2.65C8.3 34.45 7.19 33 6.05 31.64q-.13-.18-.27-.39c1-.16 2-.27 3-.48a22.65 22.65 0 0 0 8.5-4c1.68-1.22 3.23-2.6 4.84-3.91zM19.62 18.78c-.7-.91-1.39-1.78-2-2.67a35.8 35.8 0 0 1-3.69-6.18.61.61 0 0 1 .2-.93 37.82 37.82 0 0 1 14.56-6.25 1.75 1.75 0 0 1 1.78.52A77.82 77.82 0 0 1 36.16 10a.78.78 0 0 1 .06.16c-.68.08-1.34.15-2 .26a21.55 21.55 0 0 0-7.71 3 40.5 40.5 0 0 0-6.46 5c-.12.1-.25.2-.43.36zM27.07 35.7l2.08-1.41a5.22 5.22 0 0 1 .27 2.09c0 .06-.26.18-.36.15-.67-.21-1.33-.44-2-.67zM5.89 26.72L7.39 29c-.8.06-1.46.12-2.12.15-.07 0-.21-.18-.2-.25a6.43 6.43 0 0 1 .82-2.18zM15 5.67l-2.14 1.41A5.47 5.47 0 0 1 12.6 5c0-.06.23-.17.32-.14.68.21 1.36.44 2 .67zM36.14 14.65l-1.45-2.12a5.14 5.14 0 0 1 2.1-.27c.06 0 .17.14.16.2a6.64 6.64 0 0 1-.81 2.19z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><title>Artboard 1 copy 43</title><path d="M19.11 22.13l-1.62 1.28a37.59 37.59 0 0 1-7.34 4.51.48.48 0 0 1-.71-.18 37.78 37.78 0 0 1-6.27-14.13A5.29 5.29 0 0 1 3 12.37a1 1 0 0 1 .26-.65C4 11 4.76 10.19 5.57 9.51c1.52-1.3 3.09-2.51 4.64-3.8.07-.06.14-.1.28-.2.07.51.12 1 .18 1.43a20.7 20.7 0 0 0 2.87 7.93 39.56 39.56 0 0 0 5.22 6.86zm3.79-2.87a40.15 40.15 0 0 1 9.1-5.84c.3-.14.43 0 .59.19A35.64 35.64 0 0 1 37.81 24c.44 1.35.73 2.75 1.1 4.12a1.87 1.87 0 0 1-.63 2.08c-1.9 1.61-3.78 3.23-5.68 4.85-.32.27-.66.51-1.08.82-.06-.53-.12-1-.17-1.45a20.15 20.15 0 0 0-2.6-7.42 38.72 38.72 0 0 0-5.53-7.39zm-.48 3.32c.93 1.25 1.84 2.44 2.7 3.66a32.47 32.47 0 0 1 3.05 5.31.51.51 0 0 1-.2.74 36.18 36.18 0 0 1-10.91 5.38c-1.39.43-2.84.7-4.27 1a1 1 0 0 1-.78-.2c-.88-.86-1.75-1.72-2.54-2.65C8.3 34.45 7.19 33 6.05 31.64q-.13-.18-.27-.39c1-.16 2-.27 3-.48a22.65 22.65 0 0 0 8.5-4c1.68-1.22 3.23-2.6 4.84-3.91zm-2.8-3.8c-.7-.91-1.39-1.78-2-2.67a35.8 35.8 0 0 1-3.69-6.18.61.61 0 0 1 .2-.93 37.82 37.82 0 0 1 14.56-6.25 1.75 1.75 0 0 1 1.78.52A77.82 77.82 0 0 1 36.16 10a.78.78 0 0 1 .06.16c-.68.08-1.34.15-2 .26a21.55 21.55 0 0 0-7.71 3 40.5 40.5 0 0 0-6.46 5c-.12.1-.25.2-.43.36zm7.45 16.92l2.08-1.41a5.22 5.22 0 0 1 .27 2.09c0 .06-.26.18-.36.15-.67-.21-1.33-.44-2-.67zM5.89 26.72L7.39 29c-.8.06-1.46.12-2.12.15-.07 0-.21-.18-.2-.25a6.43 6.43 0 0 1 .82-2.18zM15 5.67l-2.14 1.41A5.47 5.47 0 0 1 12.6 5c0-.06.23-.17.32-.14.68.21 1.36.44 2 .67zm21.14 8.98l-1.45-2.12a5.14 5.14 0 0 1 2.1-.27c.06 0 .17.14.16.2a6.64 6.64 0 0 1-.81 2.19z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

798
packages/my-joy-beta/src/components/create-instance/__tests__/__snapshots__/package.spec.js.snap
View File

File diff suppressed because it is too large Load Diff

87
packages/my-joy-beta/src/components/create-instance/package.js
View File

@ -1,14 +1,15 @@
import React, { Fragment } from 'react';
import { Field } from 'redux-form';
import styled from 'styled-components';
import { Margin } from 'styled-components-spacing';
import { Margin, Padding } from 'styled-components-spacing';
import remcalc from 'remcalc';
import Flex from 'styled-flex-component';
import pretty from 'prettysize';
import bytes from 'bytes';
import {
H3,
H4,
Card,
FormGroup,
Button,
TableTh,
@ -26,6 +27,8 @@ import {
MemoryIcon
} from 'joyent-ui-toolkit';
import NoPackagesImage from '../../assets/no-packages.svg';
const GroupIcons = {
MEMORY: <MemoryIcon fill="#32ABCF" />,
STORAGE: <StorageIcon fill="#A88A83" />,
@ -43,7 +46,7 @@ const VerticalDivider = styled.div`
box-sizing: border-box;
`;
const Badge = styled.div`
const SuperScript = styled.div`
background: ${props => props.theme.primary};
border-radius: ${remcalc(3)};
font-weight: 600;
@ -54,12 +57,16 @@ const Badge = styled.div`
align-items: center;
justify-content: center;
padding: ${remcalc(3)};
position: relative;
top: ${remcalc(-8)};
position: absolute;
margin-top: ${remcalc(-8)};
margin-left: ${remcalc(6)};
`;
export const Filters = () => (
const NoPackagesTitle = styled(H3)`
color: ${props => props.theme.greyDark};
`;
export const Filters = ({ resetFilters }) => (
<Margin top={4} bottom={3}>
<H4>Filters</H4>
<Flex alignCenter justifyBetween>
@ -69,7 +76,7 @@ export const Filters = () => (
<Flex alignCenter>
{GroupIcons.COMPUTE}
<Margin right={1} left={1}>
Compute optimized
Compute Optimized
</Margin>
</Flex>
</Label>
@ -81,7 +88,7 @@ export const Filters = () => (
<Flex alignCenter>
{GroupIcons.MEMORY}
<Margin left={1} right={2}>
Memory optimized
Memory Optimized
</Margin>
</Flex>
</Label>
@ -105,7 +112,7 @@ export const Filters = () => (
<Flex alignCenter>
{GroupIcons.STORAGE}
<Margin left={1} right={2}>
Storage optimized
Storage Optimized
</Margin>
</Flex>
</Label>
@ -117,9 +124,29 @@ export const Filters = () => (
</Checkbox>
</FormGroup>
</Flex>
<Margin top={2} bottom={1}>
<Button secondary onClick={resetFilters}>
Reset Filters
</Button>
</Margin>
</Margin>
);
export const NoPackages = () => (
<Card>
<Padding all={6}>
<Flex alignCenter justifyCenter column>
<Margin bottom={2}>
<img src={NoPackagesImage} alt="No packages were found" />
</Margin>
<NoPackagesTitle>
Sorry, but we weren’t able to find any packages with that filter
</NoPackagesTitle>
</Flex>
</Padding>
</Card>
);
export const Package = ({
selected = false,
id,
@ -133,7 +160,7 @@ export const Package = ({
hasVms
}) => (
<TableTr>
<TableTd selected={selected}>
<TableTd right selected={selected}>
<FormGroup name="package" value={id} type="radio" field={Field} fluid>
<Radio noMargin>
<Flex alignCenter>
@ -145,13 +172,21 @@ export const Package = ({
</Radio>
</FormGroup>
</TableTd>
<TableTd selected={selected}>{pretty(memory)}</TableTd>
<TableTd selected={selected}>
{pretty(disk)}
{ssd && <Badge>SSD</Badge>}
<TableTd right selected={selected}>
{bytes(memory, { decimalPlaces: 0 })}
</TableTd>
<TableTd right selected={selected}>
{bytes(disk, { decimalPlaces: 0 })}
{ssd && <SuperScript>SSD</SuperScript>}
</TableTd>
{hasVms && (
<TableTd right selected={selected}>
{vcpus}
</TableTd>
)}
<TableTd right selected={selected}>
{price}
</TableTd>
{hasVms && <TableTd selected={selected}>{vcpus}</TableTd>}
<TableTd selected={selected}>{price}</TableTd>
</TableTr>
);
@ -162,7 +197,8 @@ export const Packages = ({
sortOrder = 'desc',
onSortBy = () => null,
hasVms,
children
children,
packages
}) => (
<form onSubmit={handleSubmit}>
<Table>
@ -181,10 +217,10 @@ export const Packages = ({
</TableTh>
<TableTh
xs="100"
onClick={() => onSortBy('ram', sortOrder)}
onClick={() => onSortBy('memory', sortOrder)}
sortOrder={sortOrder}
showSort={sortBy === 'ram'}
left
showSort={sortBy === 'memory'}
right
middle
actionable
>
@ -195,7 +231,7 @@ export const Packages = ({
onClick={() => onSortBy('disk', sortOrder)}
sortOrder={sortOrder}
showSort={sortBy === 'disk'}
left
right
middle
actionable
>
@ -207,7 +243,7 @@ export const Packages = ({
onClick={() => onSortBy('vcpu', sortOrder)}
sortOrder={sortOrder}
showSort={sortBy === 'vcpu'}
left
right
middle
actionable
>
@ -219,7 +255,7 @@ export const Packages = ({
onClick={() => onSortBy('price', sortOrder)}
sortOrder={sortOrder}
showSort={sortBy === 'price'}
left
right
middle
actionable
>
@ -229,6 +265,7 @@ export const Packages = ({
</TableThead>
<TableTbody>{children}</TableTbody>
</Table>
{!packages ? <NoPackages /> : null}
<Margin top={4}>
<Button type="submit" disabled={pristine}>
Next
@ -253,7 +290,7 @@ export const Overview = ({
<Flex alignCenter>
<span>{price} $</span>
<VerticalDivider />
<span>{pretty(memory)}</span>
<span>{bytes(memory, { decimalPlaces: 0 })}</span>
{hasVms && (
<Fragment>
<VerticalDivider />
@ -261,7 +298,7 @@ export const Overview = ({
</Fragment>
)}
<VerticalDivider />
<span>{pretty(disk)} disk</span>
<span>{bytes(disk, { decimalPlaces: 0 })} disk</span>
<VerticalDivider />
{ssd && <span>SSD</span>}
</Flex>

86
packages/my-joy-beta/src/containers/create-instance/package.js
View File

@ -8,13 +8,15 @@ import { set } from 'react-redux-values';
import sortBy from 'lodash.sortby';
import find from 'lodash.find';
import constantCase from 'constant-case';
import { reset } from 'redux-form';
import { PackageIcon, StatusLoader } from 'joyent-ui-toolkit';
import {
Filters,
Packages,
Package,
Overview
Overview,
NoPackages
} from '@components/create-instance/package';
import Title from '@components/create-instance/title';
import Description from '@components/create-instance/description';
@ -23,6 +25,7 @@ import priceData from '../../data/prices.json';
import getPackages from '../../graphql/get-packages.gql';
const FORM_NAME = 'create-instance-package';
const FILTERS = 'create-instance-package-filters';
const PackageContainer = ({
expanded,
@ -34,7 +37,8 @@ const PackageContainer = ({
selected = {},
sortOrder,
handleSortBy,
sortBy
sortBy,
resetFilters
}) => (
<Fragment>
<Title icon={<PackageIcon />}>Package</Title>
@ -52,33 +56,35 @@ const PackageContainer = ({
</a>
</Description>
) : null}
{!loading && expanded ? (
<ReduxForm
form={`${FORM_NAME}-filters`}
destroyOnUnmount={false}
forceUnregisterOnUnmount={true}
>
{props => <Filters {...props} />}
</ReduxForm>
) : null}
{loading && expanded ? (
<StatusLoader />
) : (
<ReduxForm
form={FORM_NAME}
destroyOnUnmount={false}
forceUnregisterOnUnmount={true}
onSubmit={handleSubmit}
>
{props => (
<Fragment>
{expanded ? (
{!loading && expanded ? (
<ReduxForm
form={`${FORM_NAME}-filters`}
destroyOnUnmount={false}
forceUnregisterOnUnmount={true}
>
{props => <Filters {...props} resetFilters={resetFilters} />}
</ReduxForm>
) : null}
{loading && expanded ? (
<StatusLoader />
) : (
<ReduxForm
form={FORM_NAME}
destroyOnUnmount={false}
forceUnregisterOnUnmount={true}
onSubmit={handleSubmit}
>
{props => (
<Fragment>
{expanded ? (
<Fragment>
<Packages
{...props}
hasVms={hasVms}
sortBy={sortBy}
sortOrder={sortOrder}
onSortBy={handleSortBy}
packages={packages.length}
>
{packages.map(({ id, ...pkg }) => (
<Package
@ -90,18 +96,15 @@ const PackageContainer = ({
/>
))}
</Packages>
) : null}
{!expanded && selected.id ? (
<Overview
{...selected}
hasVms={hasVms}
onCancel={handleCancel}
/>
) : null}
</Fragment>
)}
</ReduxForm>
)}
</Fragment>
) : null}
{!expanded && selected.id ? (
<Overview {...selected} hasVms={hasVms} onCancel={handleCancel} />
) : null}
</Fragment>
)}
</ReduxForm>
)}
</div>
</Fragment>
);
@ -134,25 +137,25 @@ export default compose(
const _sortBy = get(values, 'packages-list-sort-by', 'price');
const _sortOrder = get(values, 'packages-list-sort-order', 'asc');
const ssdOnly = get(form, `${FORM_NAME}-filters.values.ssd`, false);
const ssdOnly = get(form, `${FILTERS}.values.ssd`, false);
const computeOptimized = get(
form,
`${FORM_NAME}-filters.values.compute-optimized`,
`${FILTERS}.values.compute-optimized`,
false
);
const generalPurpose = get(
form,
`${FORM_NAME}-filters.values.general-purpose`,
`${FILTERS}.values.general-purpose`,
false
);
const storageOptimized = get(
form,
`${FORM_NAME}-filters.values.storage-optimized`,
`${FILTERS}.values.storage-optimized`,
false
);
const memoryOptimized = get(
form,
`${FORM_NAME}-filters.values.memory-optimized`,
`${FILTERS}.values.memory-optimized`,
false
);
const vmSelected = get(form, 'create-instance-image.values.vms', false);
@ -191,6 +194,9 @@ export default compose(
(dispatch, { history }) => ({
handleSubmit: () => history.push('/instances/~create/tags'),
handleCancel: () => history.push('/instances/~create/package'),
resetFilters: () => {
dispatch(reset(`${FILTERS}-filters`));
},
handleSortBy: (newSortBy, sortOrder) => {
dispatch([
set({

1
packages/ui-toolkit/src/base/global.js
View File

@ -26,6 +26,7 @@ export default ({ theme }) => css`
margin: 0;
padding: 0;
background: ${theme.background};
color: ${theme.text};
}
html,

5
packages/ui-toolkit/src/form/__tests__/__snapshots__/form.spec.js.snap
View File

@ -164,7 +164,10 @@ exports[`Form Checkbox 1`] = `
/>
</div>
<div
checked={false}
className="c4"
disabled={false}
id=""
>
<label
className="c5"
@ -539,6 +542,8 @@ exports[`Form Radio 1`] = `
</div>
<div
className="c4"
disabled={false}
id=""
>
<label
className="c5"

2
packages/ui-toolkit/src/form/base/toggle.js
View File

@ -181,7 +181,7 @@ const ToggleBase = ({ container = null, type = 'radio' }) =>
const el = OuterContainer ? (
<OuterContainer {...rest}>
{toggle}
{children ? <Container>{children}</Container> : null}
{children ? <Container {...rest}>{children}</Container> : null}
</OuterContainer>
) : (
toggle

1
packages/ui-toolkit/src/table/index.js
View File

@ -210,6 +210,7 @@ const BaseTd = styled.td`
${is('selected')`
border-color: ${props => props.theme.primary};
background-color: rgba(59, 70, 204, 0.05);
border-bottom-width: ${remcalc(1)};
`};
${ColumnBorder};

6
yarn.lock
View File

@ -1953,7 +1953,7 @@ byline@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/byline/-/byline-5.0.0.tgz#741c5216468eadc457b03410118ad77de8c1ddb1"
bytes@3.0.0:
bytes@3.0.0, bytes@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
@ -8088,10 +8088,6 @@ pretty-format@^20.0.3:
ansi-regex "^2.1.1"
ansi-styles "^3.0.0"
prettysize@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/prettysize/-/prettysize-1.1.0.tgz#c6c52f87161ff172ea435f375f99831dd9a97bb0"
private@^0.1.6, private@^0.1.7, private@~0.1.5:
version "0.1.8"
resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"