[frontend-api] social network login types config (#3277)

shopsys · Aug 15, 2024 · b6a4dfe · b6a4dfe
2 parents de84d05 + 2dcd9e3
commit b6a4dfe
Show file tree

Hide file tree

Showing 11 changed files with 99 additions and 46 deletions.
diff --git a/app/.env.test b/app/.env.test
@@ -12,3 +12,10 @@ GOPAY_EN_CLIENTSECRET=test-data
 GOPAY_CS_GOID=test-data
 GOPAY_CS_CLIENTID=test-data
 GOPAY_CS_CLIENTSECRET=test-data
+
+GOOGLE_CLIENT_ID=test-data
+GOOGLE_CLIENT_SECRET=test-data
+FACEBOOK_CLIENT_ID=test-data
+FACEBOOK_CLIENT_SECRET=test-data
+SEZNAM_CLIENT_ID=test-data
+SEZNAM_CLIENT_SECRET=test-data
diff --git a/app/config/packages/social_network_config.yaml b/app/config/packages/social_network_config.yaml
@@ -1,18 +1,18 @@
 parameters:
     social_network_login_config:
         providers:
-            google:
-                enabled: true
-                keys:
-                    id: '%env(GOOGLE_CLIENT_ID)%'
-                    secret: '%env(GOOGLE_CLIENT_SECRET)%'
             facebook:
-                enabled: true
+                enabledOnDomains: [1,2]
                 keys:
                     id: '%env(FACEBOOK_CLIENT_ID)%'
                     secret: '%env(FACEBOOK_CLIENT_SECRET)%'
+            google:
+                enabledOnDomains: [1,2]
+                keys:
+                    id: '%env(GOOGLE_CLIENT_ID)%'
+                    secret: '%env(GOOGLE_CLIENT_SECRET)%'
             seznam:
-                enabled: true
+                enabledOnDomains: [1,2]
                 keys:
                     id: '%env(SEZNAM_CLIENT_ID)%'
                     secret: '%env(SEZNAM_CLIENT_SECRET)%'

diff --git a/app/schema.graphql b/app/schema.graphql
@@ -2081,6 +2081,8 @@ type Settings {
   privacyPolicyArticleUrl: String
   "Settings related to SEO"
   seo: SeoSetting!
+  "Returns available social network logins"
+  socialNetworkLoginConfig: [LoginTypeEnum!]!
   "Returns Terms and Conditions article's url"
   termsAndConditionsArticleUrl: String
   "Returns User consent policy article's url"

diff --git a/app/tests/FrontendApiBundle/Functional/Settings/SocialNetworkLoginConfigQueryTest.php b/app/tests/FrontendApiBundle/Functional/Settings/SocialNetworkLoginConfigQueryTest.php
@@ -0,0 +1,27 @@
+<?php
+
+declare(strict_types=1);
+
+namespace FrontendApiBundle\Functional\Settings;
+
+use Shopsys\FrontendApiBundle\Model\Customer\User\LoginType\LoginTypeEnum;
+use Tests\FrontendApiBundle\Test\GraphQlTestCase;
+
+class SocialNetworkLoginConfigQueryTest extends GraphQlTestCase
+{
+    public function testSocialNetworkLoginConfigQuery(): void
+    {
+        $graphQlType = 'settings';
+        $response = $this->getResponseContentForGql(__DIR__ . '/graphql/SocialNetworkLoginConfigQuery.graphql');
+        $responseData = $this->getResponseDataForGraphQlType($response, $graphQlType);
+        $expectedData = [
+            'socialNetworkLoginConfig' => [
+                LoginTypeEnum::FACEBOOK,
+                LoginTypeEnum::GOOGLE,
+                LoginTypeEnum::SEZNAM,
+            ],
+        ];
+
+        self::assertSame($expectedData, $responseData);
+    }
+}
diff --git a/...tests/FrontendApiBundle/Functional/Settings/graphql/SocialNetworkLoginConfigQuery.graphql b/...tests/FrontendApiBundle/Functional/Settings/graphql/SocialNetworkLoginConfigQuery.graphql
@@ -0,0 +1,5 @@
+query SettingsQuery {
+    settings {
+        socialNetworkLoginConfig
+    }
+}
diff --git a/storefront/components/Blocks/Login/LoginForm.tsx b/storefront/components/Blocks/Login/LoginForm.tsx
@@ -10,6 +10,8 @@ import { PasswordInputControlled } from 'components/Forms/TextInput/PasswordInpu
 import { TextInputControlled } from 'components/Forms/TextInput/TextInputControlled';
 import { useDomainConfig } from 'components/providers/DomainConfigProvider';
 import { TIDs } from 'cypress/tids';
+import { useSettingsQuery } from 'graphql/requests/settings/queries/SettingsQuery.generated';
+import { TypeLoginTypeEnum } from 'graphql/types';
 import { GtmMessageOriginType } from 'gtm/enums/GtmMessageOriginType';
 import useTranslation from 'next-translate/useTranslation';
 import { FormProvider, SubmitHandler } from 'react-hook-form';
@@ -40,9 +42,10 @@ export const LoginForm: FC<LoginFormProps> = ({
     const [formProviderMethods] = useLoginForm(defaultEmail);
     const formMeta = useLoginFormMeta(formProviderMethods);
     const login = useLogin();
+    const [{ data: settingsData }] = useSettingsQuery();
 
     const getSocialNetworkLoginUrl = (
-        socialNetwork: 'facebook' | 'google' | 'seznam',
+        socialNetwork: TypeLoginTypeEnum,
         cartUuid: string | null,
         shouldOverwriteCustomerUserCart: boolean | undefined,
         productListUuids: string[],
@@ -113,40 +116,23 @@ export const LoginForm: FC<LoginFormProps> = ({
                                 <SubmitButton tid={TIDs.login_form_submit_button}>{t('Log-in')}</SubmitButton>
                             </FormButtonWrapper>
 
-                            <div className="flex gap-2 lg:order-2 w-full justify-center">
-                                <SocialNetworkLoginLink
-                                    href={getSocialNetworkLoginUrl(
-                                        'facebook',
-                                        cartUuid,
-                                        shouldOverwriteCustomerUserCart,
-                                        productListUuids,
-                                    )}
-                                >
-                                    <FacebookIcon className="w-7 text-[#1877f2]" />
-                                </SocialNetworkLoginLink>
-
-                                <SocialNetworkLoginLink
-                                    href={getSocialNetworkLoginUrl(
-                                        'google',
-                                        cartUuid,
-                                        shouldOverwriteCustomerUserCart,
-                                        productListUuids,
-                                    )}
-                                >
-                                    <GoogleIcon className="w-6" />
-                                </SocialNetworkLoginLink>
-
-                                <SocialNetworkLoginLink
-                                    href={getSocialNetworkLoginUrl(
-                                        'seznam',
-                                        cartUuid,
-                                        shouldOverwriteCustomerUserCart,
-                                        productListUuids,
-                                    )}
-                                >
-                                    <SeznamIcon className="w-6" />
-                                </SocialNetworkLoginLink>
-                            </div>
+                            {settingsData?.settings?.socialNetworkLoginConfig !== undefined &&
+                                settingsData.settings.socialNetworkLoginConfig.length > 0 && (
+                                    <div className="flex gap-2 lg:order-2 w-full justify-center">
+                                        {settingsData.settings.socialNetworkLoginConfig.map((socialNetwork) => (
+                                            <SocialNetworkLoginLink
+                                                key={socialNetwork}
+                                                socialNetwork={socialNetwork}
+                                                href={getSocialNetworkLoginUrl(
+                                                    socialNetwork,
+                                                    cartUuid,
+                                                    shouldOverwriteCustomerUserCart,
+                                                    productListUuids,
+                                                )}
+                                            />
+                                        ))}
+                                    </div>
+                                )}
 
                             <div className="lg:order-3 w-full flex justify-center items-center gap-1 whitespace-nowrap text-sm py-3">
                                 <ExtendedNextLink href={resetPasswordUrl}>{t('Lost your password?')}</ExtendedNextLink>
@@ -159,13 +145,26 @@ export const LoginForm: FC<LoginFormProps> = ({
     );
 };
 
-const SocialNetworkLoginLink: FC<{ href: string }> = ({ href, children }) => {
+const SocialNetworkLoginLink: FC<{ href: string; socialNetwork: TypeLoginTypeEnum }> = ({ href, socialNetwork }) => {
     return (
         <ExtendedNextLink
             className="bg-background h-12 w-full shadow-md rounded flex justify-center items-center hover:shadow-greyLight"
             href={href}
         >
-            {children}
+            <SocialNetworkIcon socialNetwork={socialNetwork} />
         </ExtendedNextLink>
     );
 };
+
+const SocialNetworkIcon: FC<{ socialNetwork: TypeLoginTypeEnum }> = ({ socialNetwork }) => {
+    switch (socialNetwork) {
+        case TypeLoginTypeEnum.Facebook:
+            return <FacebookIcon className="w-7 text-[#1877f2]" />;
+        case TypeLoginTypeEnum.Google:
+            return <GoogleIcon className="w-6" />;
+        case TypeLoginTypeEnum.Seznam:
+            return <SeznamIcon className="w-6" />;
+        default:
+            return null;
+    }
+};
diff --git a/storefront/graphql/docs/schema.md b/storefront/graphql/docs/schema.md
@@ -7578,6 +7578,15 @@ Returns privacy policy article's url
 
 Settings related to SEO
 
+</td>
+</tr>
+<tr>
+<td colspan="2" valign="top"><strong>socialNetworkLoginConfig</strong></td>
+<td valign="top">[<a href="#logintypeenum">LoginTypeEnum</a>!]!</td>
+<td>
+
+Returns available social network logins
+
 </td>
 </tr>
 <tr>

diff --git a/storefront/graphql/requests/settings/queries/SettingsQuery.generated.tsx b/storefront/graphql/requests/settings/queries/SettingsQuery.generated.tsx
@@ -8,7 +8,7 @@ export type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
 export type TypeSettingsQueryVariables = Types.Exact<{ [key: string]: never; }>;
 
 
-export type TypeSettingsQuery = { __typename?: 'Query', settings: { __typename?: 'Settings', contactFormMainText: string, maxAllowedPaymentTransactions: number, displayTimezone: string, heurekaEnabled: boolean, mainBlogCategoryUrl: string | null, privacyPolicyArticleUrl: string | null, termsAndConditionsArticleUrl: string | null, userConsentPolicyArticleUrl: string | null, pricing: { __typename: 'PricingSetting', defaultCurrencyCode: string, minimumFractionDigits: number }, seo: { __typename: 'SeoSetting', title: string, titleAddOn: string, metaDescription: string } } | null };
+export type TypeSettingsQuery = { __typename?: 'Query', settings: { __typename?: 'Settings', contactFormMainText: string, maxAllowedPaymentTransactions: number, displayTimezone: string, heurekaEnabled: boolean, mainBlogCategoryUrl: string | null, privacyPolicyArticleUrl: string | null, termsAndConditionsArticleUrl: string | null, userConsentPolicyArticleUrl: string | null, socialNetworkLoginConfig: Array<Types.TypeLoginTypeEnum>, pricing: { __typename: 'PricingSetting', defaultCurrencyCode: string, minimumFractionDigits: number }, seo: { __typename: 'SeoSetting', title: string, titleAddOn: string, metaDescription: string } } | null };
 
 
       export interface PossibleTypesResultData {
@@ -105,6 +105,7 @@ export const SettingsQueryDocument = gql`
     privacyPolicyArticleUrl
     termsAndConditionsArticleUrl
     userConsentPolicyArticleUrl
+    socialNetworkLoginConfig
   }
 }
     ${PricingSettingFragment}

diff --git a/storefront/graphql/requests/settings/queries/SettingsQuery.graphql b/storefront/graphql/requests/settings/queries/SettingsQuery.graphql
@@ -14,5 +14,6 @@ query SettingsQuery @redisCache(ttl: 3600) {
         privacyPolicyArticleUrl
         termsAndConditionsArticleUrl
         userConsentPolicyArticleUrl
+        socialNetworkLoginConfig
     }
 }
diff --git a/storefront/graphql/types.ts b/storefront/graphql/types.ts
@@ -2727,6 +2727,8 @@ export type TypeSettings = {
   privacyPolicyArticleUrl: Maybe<Scalars['String']['output']>;
   /** Settings related to SEO */
   seo: TypeSeoSetting;
+  /** Returns available social network logins */
+  socialNetworkLoginConfig: Array<TypeLoginTypeEnum>;
   /** Returns Terms and Conditions article's url */
   termsAndConditionsArticleUrl: Maybe<Scalars['String']['output']>;
   /** Returns User consent policy article's url */

diff --git a/storefront/schema-compressed.graphql.json b/storefront/schema-compressed.graphql.json