From f16e612384b7daf6e73024847ba0062cb6b72708 Mon Sep 17 00:00:00 2001 From: Martastain Date: Thu, 30 Nov 2023 15:46:42 +0100 Subject: [PATCH 1/8] connect clean-up --- src/components/YnputConnect/YnputConnector.jsx | 6 +++--- src/pages/SettingsPage/Secrets.jsx | 13 ++++++++++--- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/src/components/YnputConnect/YnputConnector.jsx b/src/components/YnputConnect/YnputConnector.jsx index 720851100..3f31cc758 100644 --- a/src/components/YnputConnect/YnputConnector.jsx +++ b/src/components/YnputConnect/YnputConnector.jsx @@ -117,10 +117,10 @@ const YnputConnector = ({ - Name: {connectData?.userName || user?.name} - Email: {connectData?.userEmail || user?.email} + Instance: {connectData?.instanceName || '???'} + Organization: {connectData?.orgName || '???'} - {showDisconnect && ( + {showDisconnect && !connectData?.managed && ( Disconnect diff --git a/src/pages/SettingsPage/Secrets.jsx b/src/pages/SettingsPage/Secrets.jsx index 38f9c7ccf..9f218703a 100644 --- a/src/pages/SettingsPage/Secrets.jsx +++ b/src/pages/SettingsPage/Secrets.jsx @@ -116,9 +116,16 @@ const Secrets = () => {

Stored secrets

{data?.length && - data.map((secret) => ( - - ))} + data + .filter((secret) => secret.name !== 'ynput_cloud_key') + .map((secret) => ( + + ))} From 94f4d1864729b403bb48864387284c8d569d367b Mon Sep 17 00:00:00 2001 From: Martin Wacker Date: Wed, 6 Dec 2023 10:42:08 +0100 Subject: [PATCH 2/8] renamed ynputconnect to ynputcloud --- public/ynput-cloud-logo.svg | 15 +++++++++++++++ src/components/Menu/Menus/AppMenu.jsx | 2 +- .../YnputCloud.styled.js} | 0 .../YnputCloudButton.jsx} | 10 +++++----- .../YnputConnector.jsx | 6 +++--- src/pages/OnBoarding/Step/BoostrapStart.jsx | 4 ++-- src/pages/OnBoarding/Step/ConnectionDetails.jsx | 2 +- src/pages/OnBoarding/Step/Landing.jsx | 8 ++++---- 8 files changed, 31 insertions(+), 16 deletions(-) create mode 100644 public/ynput-cloud-logo.svg rename src/components/{YnputConnect/YnputConnect.styled.js => YnputCloud/YnputCloud.styled.js} (100%) rename src/components/{YnputConnect/YnputConnectButton.jsx => YnputCloud/YnputCloudButton.jsx} (83%) rename src/components/{YnputConnect => YnputCloud}/YnputConnector.jsx (96%) diff --git a/public/ynput-cloud-logo.svg b/public/ynput-cloud-logo.svg new file mode 100644 index 000000000..17d5cf671 --- /dev/null +++ b/public/ynput-cloud-logo.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/src/components/Menu/Menus/AppMenu.jsx b/src/components/Menu/Menus/AppMenu.jsx index fc872e89e..d5a8a55ae 100644 --- a/src/components/Menu/Menus/AppMenu.jsx +++ b/src/components/Menu/Menus/AppMenu.jsx @@ -3,7 +3,7 @@ import InstallerDownload from '/src/components/InstallerDownload/InstallerDownlo import Menu from '../MenuComponents/Menu' import { confirmDialog } from 'primereact/confirmdialog' import { useRestartServerMutation } from '/src/services/restartServer' -import YnputConnector from '/src/components/YnputConnect/YnputConnector' +import YnputConnector from '/src/components/YnputCloud/YnputConnector' import { useRestartOnBoardingMutation } from '/src/services/onBoarding/onBoarding' import { toast } from 'react-toastify' diff --git a/src/components/YnputConnect/YnputConnect.styled.js b/src/components/YnputCloud/YnputCloud.styled.js similarity index 100% rename from src/components/YnputConnect/YnputConnect.styled.js rename to src/components/YnputCloud/YnputCloud.styled.js diff --git a/src/components/YnputConnect/YnputConnectButton.jsx b/src/components/YnputCloud/YnputCloudButton.jsx similarity index 83% rename from src/components/YnputConnect/YnputConnectButton.jsx rename to src/components/YnputCloud/YnputCloudButton.jsx index 7c99bd167..655ca7fa3 100644 --- a/src/components/YnputConnect/YnputConnectButton.jsx +++ b/src/components/YnputCloud/YnputCloudButton.jsx @@ -1,9 +1,9 @@ import React from 'react' -import * as Styled from './YnputConnect.styled' +import * as Styled from './YnputCloud.styled' import { Icon, Spacer } from '@ynput/ayon-react-components' import Type from '/src/theme/typography.module.css' -const YnputConnectButton = React.forwardRef( +const YnputCloudButton = React.forwardRef( ({ isConnected, showStatus, showDropdown, isOpen, isLoading, smallLogo, ...props }, ref) => { return ( - { return ( diff --git a/src/pages/OnBoarding/Step/Landing.jsx b/src/pages/OnBoarding/Step/Landing.jsx index 0fd4c446c..154dea6b0 100644 --- a/src/pages/OnBoarding/Step/Landing.jsx +++ b/src/pages/OnBoarding/Step/Landing.jsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import * as Styled from '../util/OnBoardingStep.styled' -import YnputConnector from '../../../components/YnputConnect/YnputConnector' +import YnputConnector from '/src/components/YnputCloud/YnputConnector' export const Landing = ({ Header, Body, nextStep, setUserForm, setIsConnecting }) => { const [showMore, setShowMore] = useState(false) @@ -19,13 +19,13 @@ export const Landing = ({ Header, Body, nextStep, setUserForm, setIsConnecting } {showMore && ( <> -
{`What is Ynput Connect?`}
+
{`What is Ynput Cloud?`}
- AYON is a highly modular platform. Connecting your Ynput account to AYON lets us + AYON is a highly modular platform. Connecting your Ynput Cloud account to AYON lets us automatically download and setup all you need to take full advantage of AYON in your production.

- If you are in offline environment or you would rather download and install all the + If you are in an offline environment or you would rather download and install all the addons, desktop distribution and dependencies manually, you can skip this step. nextStep(e, 1)}> From a5c81ed012dc948134538a5f6347d94d5a7b921a Mon Sep 17 00:00:00 2001 From: Innders <49156310+Innders@users.noreply.github.com> Date: Tue, 12 Dec 2023 08:54:32 +0000 Subject: [PATCH 3/8] feature: ynput connector button dark mode --- src/components/Menu/Menus/AppMenu.jsx | 9 +++- .../YnputConnect/YnputConnect.styled.js | 22 ++++++++- .../YnputConnect/YnputConnectButton.jsx | 14 +++--- .../YnputConnect/YnputConnector.jsx | 10 ++-- .../OnBoarding/Step/ConnectionDetails.jsx | 1 - src/svg/CloudLogo.jsx | 49 +++++++++++++++++++ 6 files changed, 89 insertions(+), 16 deletions(-) create mode 100644 src/svg/CloudLogo.jsx diff --git a/src/components/Menu/Menus/AppMenu.jsx b/src/components/Menu/Menus/AppMenu.jsx index fc872e89e..e48425094 100644 --- a/src/components/Menu/Menus/AppMenu.jsx +++ b/src/components/Menu/Menus/AppMenu.jsx @@ -105,7 +105,14 @@ export const AppMenu = ({ user, ...props }) => { return ( <> - {isAdmin && } + {isAdmin && ( + + )} ) } diff --git a/src/components/YnputConnect/YnputConnect.styled.js b/src/components/YnputConnect/YnputConnect.styled.js index 25b03764e..c68428a12 100644 --- a/src/components/YnputConnect/YnputConnect.styled.js +++ b/src/components/YnputConnect/YnputConnect.styled.js @@ -35,10 +35,25 @@ export const HeaderButton = styled(ayonButton)` .icon { color: var(--md-sys-color-on-tertiary); - font-size: 2rem; + font-size: 1.5rem; font-variation-settings: 'FILL' 1; } + /* if $darkMode show inverse colors */ + ${({ $darkMode }) => + $darkMode && + css` + background-color: var(--md-sys-color-surface-container-lowest); + color: var(--md-sys-color-on-surface); + &:hover { + background-color: var(--md-sys-color-surface-container-low); + } + + .icon { + color: var(--md-sys-color-on-surface); + } + `} + /* when loading show shimmer */ ${({ $isLoading }) => $isLoading && @@ -72,7 +87,10 @@ export const Container = styled.div` display: grid; flex-direction: column; align-items: center; - background-color: var(--md-sys-color-tertiary-container); + background-color: ${({ $darkMode }) => + $darkMode + ? 'var(--md-sys-color-surface-container-lowest)' + : 'var(--md-sys-color-tertiary-container)'}; border-radius: 8px; gap: 0; ` diff --git a/src/components/YnputConnect/YnputConnectButton.jsx b/src/components/YnputConnect/YnputConnectButton.jsx index 7c99bd167..1ca5f64ca 100644 --- a/src/components/YnputConnect/YnputConnectButton.jsx +++ b/src/components/YnputConnect/YnputConnectButton.jsx @@ -2,9 +2,13 @@ import React from 'react' import * as Styled from './YnputConnect.styled' import { Icon, Spacer } from '@ynput/ayon-react-components' import Type from '/src/theme/typography.module.css' +import CloudLogo from '/src/svg/CloudLogo' const YnputConnectButton = React.forwardRef( - ({ isConnected, showStatus, showDropdown, isOpen, isLoading, smallLogo, ...props }, ref) => { + ( + { isConnected, showStatus, showDropdown, isOpen, isLoading, smallLogo, darkMode, ...props }, + ref, + ) => { return ( - + {(showStatus || showDropdown) && ( {showStatus && ( diff --git a/src/components/YnputConnect/YnputConnector.jsx b/src/components/YnputConnect/YnputConnector.jsx index 720851100..12a966f27 100644 --- a/src/components/YnputConnect/YnputConnector.jsx +++ b/src/components/YnputConnect/YnputConnector.jsx @@ -102,7 +102,7 @@ const YnputConnector = ({ } return ( - + Name: {connectData?.userName || user?.name} Email: {connectData?.userEmail || user?.email} - - {showDisconnect && ( + {showDisconnect && ( + Disconnect - )} - + + )} diff --git a/src/pages/OnBoarding/Step/ConnectionDetails.jsx b/src/pages/OnBoarding/Step/ConnectionDetails.jsx index 4abc25d5e..a10e24c1e 100644 --- a/src/pages/OnBoarding/Step/ConnectionDetails.jsx +++ b/src/pages/OnBoarding/Step/ConnectionDetails.jsx @@ -10,7 +10,6 @@ export const ConnectionDetails = ({ Header, Body, Footer, userForm }) => { ( + + + + + + + + + + + + + + + + + + +) + +export default CloudLogo From 425bacd68be930039f1e96f014345fcbcd9d7c71 Mon Sep 17 00:00:00 2001 From: Innders <49156310+Innders@users.noreply.github.com> Date: Tue, 12 Dec 2023 09:23:50 +0000 Subject: [PATCH 4/8] fix: rename to ynput cloud --- src/components/Menu/Menus/AppMenu.jsx | 2 +- .../YnputCloud.styled.js} | 0 .../YnputCloudButton.jsx} | 8 ++++---- .../{YnputConnect => YnputCloud}/YnputConnector.jsx | 4 ++-- src/pages/OnBoarding/Step/BoostrapStart.jsx | 4 ++-- src/pages/OnBoarding/Step/ConnectionDetails.jsx | 2 +- src/pages/OnBoarding/Step/Landing.jsx | 2 +- 7 files changed, 11 insertions(+), 11 deletions(-) rename src/components/{YnputConnect/YnputConnect.styled.js => YnputCloud/YnputCloud.styled.js} (100%) rename src/components/{YnputConnect/YnputConnectButton.jsx => YnputCloud/YnputCloudButton.jsx} (87%) rename src/components/{YnputConnect => YnputCloud}/YnputConnector.jsx (97%) diff --git a/src/components/Menu/Menus/AppMenu.jsx b/src/components/Menu/Menus/AppMenu.jsx index e48425094..7ebc35868 100644 --- a/src/components/Menu/Menus/AppMenu.jsx +++ b/src/components/Menu/Menus/AppMenu.jsx @@ -3,7 +3,7 @@ import InstallerDownload from '/src/components/InstallerDownload/InstallerDownlo import Menu from '../MenuComponents/Menu' import { confirmDialog } from 'primereact/confirmdialog' import { useRestartServerMutation } from '/src/services/restartServer' -import YnputConnector from '/src/components/YnputConnect/YnputConnector' +import YnputConnector from '../../YnputCloud/YnputConnector' import { useRestartOnBoardingMutation } from '/src/services/onBoarding/onBoarding' import { toast } from 'react-toastify' diff --git a/src/components/YnputConnect/YnputConnect.styled.js b/src/components/YnputCloud/YnputCloud.styled.js similarity index 100% rename from src/components/YnputConnect/YnputConnect.styled.js rename to src/components/YnputCloud/YnputCloud.styled.js diff --git a/src/components/YnputConnect/YnputConnectButton.jsx b/src/components/YnputCloud/YnputCloudButton.jsx similarity index 87% rename from src/components/YnputConnect/YnputConnectButton.jsx rename to src/components/YnputCloud/YnputCloudButton.jsx index 1ca5f64ca..4db861685 100644 --- a/src/components/YnputConnect/YnputConnectButton.jsx +++ b/src/components/YnputCloud/YnputCloudButton.jsx @@ -1,10 +1,10 @@ import React from 'react' -import * as Styled from './YnputConnect.styled' +import * as Styled from './YnputCloud.styled' import { Icon, Spacer } from '@ynput/ayon-react-components' import Type from '/src/theme/typography.module.css' import CloudLogo from '/src/svg/CloudLogo' -const YnputConnectButton = React.forwardRef( +const YnputCloudButton = React.forwardRef( ( { isConnected, showStatus, showDropdown, isOpen, isLoading, smallLogo, darkMode, ...props }, ref, @@ -39,6 +39,6 @@ const YnputConnectButton = React.forwardRef( }, ) -YnputConnectButton.displayName = 'YnputConnectButton' +YnputCloudButton.displayName = 'YnputCloudButton' -export default YnputConnectButton +export default YnputCloudButton diff --git a/src/components/YnputConnect/YnputConnector.jsx b/src/components/YnputCloud/YnputConnector.jsx similarity index 97% rename from src/components/YnputConnect/YnputConnector.jsx rename to src/components/YnputCloud/YnputConnector.jsx index 12a966f27..d9a9ea412 100644 --- a/src/components/YnputConnect/YnputConnector.jsx +++ b/src/components/YnputCloud/YnputConnector.jsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react' import { Section } from '@ynput/ayon-react-components' import { StringParam, useQueryParam, withDefault } from 'use-query-params' -import YnputConnectButton from './YnputConnectButton' +import YnputCloudButton from './YnputCloudButton' import { useConnectYnputMutation, useDiscountYnputMutation, @@ -103,7 +103,7 @@ const YnputConnector = ({ return ( - { return ( diff --git a/src/pages/OnBoarding/Step/Landing.jsx b/src/pages/OnBoarding/Step/Landing.jsx index 0fd4c446c..9caf65b48 100644 --- a/src/pages/OnBoarding/Step/Landing.jsx +++ b/src/pages/OnBoarding/Step/Landing.jsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import * as Styled from '../util/OnBoardingStep.styled' -import YnputConnector from '../../../components/YnputConnect/YnputConnector' +import YnputConnector from '../../../components/YnputCloud/YnputConnector' export const Landing = ({ Header, Body, nextStep, setUserForm, setIsConnecting }) => { const [showMore, setShowMore] = useState(false) From 3108eb263c2a7a09dea6581556981729e74c47ae Mon Sep 17 00:00:00 2001 From: Innders <49156310+Innders@users.noreply.github.com> Date: Tue, 12 Dec 2023 10:55:27 +0000 Subject: [PATCH 5/8] fix: show green when not connected --- src/components/YnputCloud/YnputConnector.jsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/YnputCloud/YnputConnector.jsx b/src/components/YnputCloud/YnputConnector.jsx index d33f2725c..700e9c43b 100644 --- a/src/components/YnputCloud/YnputConnector.jsx +++ b/src/components/YnputCloud/YnputConnector.jsx @@ -27,6 +27,7 @@ const YnputConnector = ({ onClick, styleContainer, user, + darkMode, ...props }) => { const location = useLocation() @@ -102,7 +103,7 @@ const YnputConnector = ({ } return ( - + From 06014da97963d5d5ecbdbee6dd34f40eb19b2c63 Mon Sep 17 00:00:00 2001 From: Innders <49156310+Innders@users.noreply.github.com> Date: Tue, 12 Dec 2023 11:06:25 +0000 Subject: [PATCH 6/8] fix: use colored triangle for white logo --- src/components/YnputCloud/YnputCloudButton.jsx | 2 +- src/svg/CloudLogo.jsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/YnputCloud/YnputCloudButton.jsx b/src/components/YnputCloud/YnputCloudButton.jsx index 4db861685..33ce5e3b2 100644 --- a/src/components/YnputCloud/YnputCloudButton.jsx +++ b/src/components/YnputCloud/YnputCloudButton.jsx @@ -19,7 +19,7 @@ const YnputCloudButton = React.forwardRef( $darkMode={darkMode} style={{ borderRadius: 8 }} > - + {(showStatus || showDropdown) && ( {showStatus && ( diff --git a/src/svg/CloudLogo.jsx b/src/svg/CloudLogo.jsx index 49c4d5d9c..b2907f319 100644 --- a/src/svg/CloudLogo.jsx +++ b/src/svg/CloudLogo.jsx @@ -1,4 +1,4 @@ -const CloudLogo = ({ darkMode, monoChrome, ...props }) => ( +const CloudLogo = ({ darkMode, ...props }) => ( ( /> From a4f4132faa1e18cd9a9081ec659965e519e7c983 Mon Sep 17 00:00:00 2001 From: Martin Wacker Date: Tue, 12 Dec 2023 12:57:09 +0100 Subject: [PATCH 7/8] do not show ynputconnector when connect status is not loaded yet --- src/components/YnputCloud/YnputConnector.jsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/components/YnputCloud/YnputConnector.jsx b/src/components/YnputCloud/YnputConnector.jsx index 700e9c43b..60fa0b37c 100644 --- a/src/components/YnputCloud/YnputConnector.jsx +++ b/src/components/YnputCloud/YnputConnector.jsx @@ -102,6 +102,8 @@ const YnputConnector = ({ } } + if (isLoading) return null + return ( Date: Tue, 12 Dec 2023 17:02:17 +0100 Subject: [PATCH 8/8] fix: addon upload error message --- src/pages/SettingsPage/AddonInstall/AddonUpload.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/SettingsPage/AddonInstall/AddonUpload.jsx b/src/pages/SettingsPage/AddonInstall/AddonUpload.jsx index 7567f0823..ebe4c1a0e 100644 --- a/src/pages/SettingsPage/AddonInstall/AddonUpload.jsx +++ b/src/pages/SettingsPage/AddonInstall/AddonUpload.jsx @@ -84,7 +84,7 @@ const AddonUpload = ({ onClose, type = 'addon', onInstall }) => { console.log('finished: created ' + type) return true } catch (error) { - setErrorMessage(error?.data?.detail) + setErrorMessage(error?.response?.data?.detail) console.error(error) return false } @@ -215,7 +215,7 @@ const AddonUpload = ({ onClose, type = 'addon', onInstall }) => { setIsUploading(false) setIsComplete(true) dispatch(onUploadFinished()) - setErrorMessage('ERROR: ' + error?.response?.data?.traceback) + setErrorMessage('ERROR: ' + error?.response?.data?.detail) } }