Setting IDPs to an "enabled" state programmatically with AWS CDK is a powerful feature that allows for seamless management of

I have successfully set up Facebook and Google IDPs in my User Pool, but they remain in a 'disabled' state after running CDK deploy. I have to manually go into the UI and click on enabled for them to work as expected. How can I programmatically enable them?

this.userPool = new UserPool(this, props.userPoolId, {
  selfSignUpEnabled: true,
  autoVerify: { email: true },
  signInAliases: { email: true },
});

const googleIdp = new UserPoolIdentityProviderGoogle(
  this,
  "UserPoolIdentityProviderGoogle",
  {
    userPool: this.userPool,
    // Removed
  }
);

this.userPool.identityProviders.push(googleIdp);

const facebookIdp = new UserPoolIdentityProviderFacebook(
  this,
  "UserPoolIdentityProviderFacebook",
  {
    userPool: this.userPool,
    // Removed
  }
);

this.userPool.identityProviders.push(facebookIdp);

const userPoolClient = new UserPoolClient(this, props.userPoolClientId, {
  userPool: this.userPool,
  generateSecret: false,
  supportedIdentityProviders: [
    UserPoolClientIdentityProvider.GOOGLE,
    UserPoolClientIdentityProvider.FACEBOOK,
  ],
});

userPoolClient.node.addDependency(googleIdp, facebookIdp)

I thought I was enabling those values with the

UserPoolClientIdentityProvider.GOOGLE
and
UserPoolClientIdentityProvider.FACEBOOK
line but I might have missed something?

Answer №1

Resolved by reordering the sequence of events:

userPoolClient.node.addDependency(googleIdp, facebookIdp)

this.userPool.identityProviders.push(googleIdp);
this.userPool.identityProviders.push(facebookIdp);

I'm not entirely certain why this works, but it seems important to ensure that the userPoolClient has the appropriate IDP resources before adding them to the userPool.

If anyone has a clearer explanation, I would be interested in hearing it!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Create a unique custom design for your Mapbox GL control

When developing the website, we utilized Angular 8, Typescript, and SCSS. We are using mgl-map to display a map, and I wanted to create a custom control for it with unique styles. I added the custom control to the map using: const centerOnCoordinatesC ...

Troubleshooting the lack of success in enhancing global scope within Typescript

Currently, I am working on a microservices application where I have two very similar services that use practically the same packages. To perform some testing, I decided to add a function to the global scope and modified it slightly to prevent any TypeScrip ...

How can I determine which dist folder is utilized during the building of my App if an npm package contains multiple dist folders?

I have integrated an npm package called aurelia-google-maps into my application. This package includes various distribution folders such as AMD, System, CommonJS, Native Modules, and ES2015 within the /node_modules/ directory like so: /node_modules/ /a ...

Is it possible to pass a number instead of a string to Angular's matToolTip within a mat-icon-button? If not, is there a way to convert the number to a string within an Angular

In my current situation, I am facing a challenge with the following line of code: [matTooltip]="ratingId + 1". This line is crucial as it forms part of the arguments for a Material Design button. However, in this case, things are not straightfo ...

Creating a custom data type for the Tanstack table filtering function

I developed a unique filter function specifically for enhancing the functionality of Tanstack Table by utilizing fuse.js. Despite my efforts, TypeScript consistently raises concerns when I try to define the type for my custom function. My goal is to alig ...

The Vercel error indicates that the file or directory '/var/task/node_modules/shiki/themes/one-dark-pro.json' does not exist

import { serialize } from 'next-mdx-remote/serialize'; import readingTime from 'reading-time'; import remarkGfm from 'remark-gfm'; import rehypeSlug from 'rehype-slug'; import rehypeAutolinkHeadings from 'rehype ...

Injecting multiple instances of an abstract service in Angular can be achieved using the following techniques

I am fairly new to Angular and currently trying to make sense of the code written by a more experienced developer. Please excuse me if I'm not adhering to the standard communication practices and vocabulary. There is an abstract class called abstract ...

Acquire information from an Angular service and output it to the console

I am having trouble logging data from my service file in the app.component file. It keeps showing up as undefined. Below is the code snippet: service.ts getBillingCycles() { return this.http.get('../../assets/download_1.json'); }; app.com ...

Omit an enum item from selection when referencing the key within the Enum

Within my enum, I have defined multiple keys: export enum MyTypeEnum { one = 'one', two = 'two', three = 'three', four = 'four' } To ensure certain types must contain these keys, I use the following ...

A combination of MVC6, tsd, and typings has proven to be

Given that TSD has been officially deprecated, I am looking towards the future and seeking guidance on how to use typings in the MVC6 framework. Any advice or tips would be greatly appreciated. I attempted following a tutorial from the typings website, wh ...

Angular router for displaying multiple view groups

What is the most effective strategy for handling two groups of views in Angular? Let me explain how I typically structure my layout in app.component.html: <app-header></app-header> <router-outlet></router-outlet> <app-footer> ...

It seems like the recent upgrade to yarn 2 has caused issues with typescript types, whereas the installation of the same project with yarn 1 was

Recently, I've been attempting to update a typescript monorepo to utilize yarn 2, but I've encountered an issue where typescript is struggling to recognize certain react props. This functionality was working fine in yarn 1.x, leading me to believ ...

Utilizing span elements to display error messages

Currently, I am using a directive on a field to prevent users from entering HTML tags and JavaScript events. However, I am encountering a few challenges: a) My goal is to display an error message immediately when a user tries to input HTML tags or JavaScr ...

What is the reason behind the lack of exported interfaces in the redux-form typings?

I've been exploring how to create custom input fields for redux-form. My journey began by examining the Material UI example found in the documentation here. const renderTextField = ({input, label, meta: { touched, error }, ...custom }) => < ...

Enhancing TypeScript Native Interface Properties in TypeScript 2.4

After discovering an error in the native Typescript interface for HTMLTextAreaElement, I realized the need to make a correction. The current interface looks like this: interface HTMLTextAreaElement { setSelectionRange(start: number, end: number): void; ...

Unable to load class; unsure of origin for class labeled as 'cached'

Working on an Angular 10 project in visual studio code, I've encountered a strange issue. In the /app/_model/ folder, I have classes 'a', 'b', and 'c'. When running the application in MS Edge, I noticed that only classes ...

Could one retrieve the value of a type and save it as a constant?

Can I achieve something similar to this: type YesType = true; const myVar = GetTypeValue<YesType>(); // In this instance, the value true is assigned Is it feasible to assign other fixed values to constant variables like in C++? ...

Transferring information to a navigated module using Angular2

I am currently facing a scenario where I have a component being loaded via routing, and my goal is to pass data from the parent component into this child component. How exactly can I achieve this task effectively? Parent Component Class export class Home ...

Instructions for setting 0 as a valid value in Html code and displaying it

I have a query regarding HTML code within an Angular app. My inquiry is, is there an alternative method to check for null or undefined values in an ngIf statement? The code I am working with looks like this: <div ngif= "value !== null and value ! ...

Potential absence of the object has been detected after performing object verification

I encountered an issue with the following error message: Object is possibly 'undefined'.ts(2532) This is what my configuration looks like: export interface IDataColumns { name: string; label: string; display: string; empty: boolean; fi ...