error Couldn't find package "@twilio/frame-ui@^0.23.1" required by "@twilio/flex-ui@^1" on the "npm" registry.

Which package?

react-intl

Describe the bug

Could not resolve dependency:
npm ERR! peerOptional typescript@"^4.2" from [email protected]

To Reproduce

Do npm i react-intl with fresh new twilio flex plugin --typescript

Screenshots

as mentioned in the react-router-redux repo:

This project is no longer maintained. For your Redux <-> Router syncing needs with React Router 4+, please see one of these libraries instead:

- connected-react-router: https://github.com/supasate/connected-react-router

I am trying to change the login view page logo (https://imgur.com/a/TQ3Y1bj) of flex.twilio.com on a self hosted instance.
As guided by twilio how to change login view logo (https://www.twilio.com/docs/flex/developer/ui/configuration#flex-agent-and-supervisor-ui) , I followed this :

flex.LoginView.defaultProps.logoUrl = "https://sample-logo-url.svg";
But,it doesn't seems to work.
does anyone have faced similar bug or solved it?

I am getting "Error: elements without key in MainHeader" with react-hot-loader

I'm trying to use twilio flex in my application, but every time i tries to logout and login to my application whole redux store crashes with error:
TypeError: Cannot read property 'getState' of null

With new release we can add custom store for flex, and since i'm using typescript in my application it is failing with the error:

Type 'Reducer<AppState>' is not assignable to type 'Reducer<AppState, AnyAction>'.
  Types of parameters 'state' and 'state' are incompatible.
    Type 'AppState | undefined' is not assignable to type 'AppState'.
      Type 'undefined' is not assignable to type 'AppState'.ts(2322)
rootReducer.tsx(45, 3): The expected type comes from property 'flex' which is declared here on type 'ReducersMapObject<{ flex: AppState; }, AnyAction>'

Is it possible to put or add two CRM container in Twilio Flex

When running locally the flex ui, there is an error:

Failed to load resource: the server responded with a status of 403 ()
:1 Failed to load https://flex.twilio.com/plugins?roles=agent&serviceBaseUrl=http:%2F%2Flocalhost:8080%2F&version=1.0.1: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
index.js:1452 failed to reach plugin service at https://flex.twilio.com/plugins Error: Network Error
at createError (createError.js:17)
at XMLHttpRequest.handleError (xhr.js:87)

I'm asking here because I have no idea where to ask...

I'm working on an "old" projects which was using frame-ui package and I'm getting this error:
npm ERR! 404 Not Found: @twilio/frame-ui@^0.16.0

I think (as far as I know) that I should move to this new package: https://www.npmjs.com/package/@twilio/flex-ui
but it has frame-ui as a dependency as well as @twilio/twilio-flex-insights, which also gives me an error.

What should I use?

Expected Behavior

The project is launched after executing the npm start command.

Current Behavior

The projet failed to compile with the error message

./node_modules/value-or-promise/build/module/ValueOrPromise.js 8:7
Module parse failed: Unexpected token (8:7)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| };
| export class ValueOrPromise {
>   state;
|   constructor(executor) {
|     let value;

Steps to Reproduce

1. Install node v16.13.1 and npm v8.1.2
2. Clone flex-ui-sample from the main branch.
3. Runnpm install at the root of the project.
4. Run npm start at the root of the project.

Context (Environment)

node: v16.13.1

npm: v8.1.2

package.json:

{
  "name": "@twilio/flex-ui-sample",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@twilio/flex-ui": "^2.0.0-beta.1",
    "history": "4.7.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "3.2.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

twilio/twilio-flex-insights is listed in dependencies for @twilio/flex-ui

however there is no way to install this package, what breaks overall ability to run the sample.

[npm-debug.log](https://github.com/twilio/flex-ui-sample/files/2808532/npm-debug.log)
$ npm install @twilio/twilio-flex-insights
npm ERR! Linux 4.15.0-43-generic
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "install" "@twilio/twilio-flex-insights"
npm ERR! node v8.10.0
npm ERR! npm  v3.5.2
npm ERR! code E404

npm ERR! 404 Not found : @twilio/twilio-flex-insights
npm ERR! 404 
npm ERR! 404  '@twilio/twilio-flex-insights' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! Please include the following file with any support request:
npm ERR!     /home/dima/Projects/learn_twilio/npm-debug.log

//edit
in case anyone would encounter this kind of bug, it's due to old npm version.

Hello,

I've brought in a custom component developed separately into this UI. How do we load it up?

In the plugin source code, it was doing:

import * as FlexPlugin from 'flex-plugin';
import RlPlugin from './RlPlugin';

FlexPlugin.loadPlugin(RlPlugin);

However, when trying to do this inside of the index.js file, if I place it at the top of the code, nothing happens. It's supposed to be modifying the CRM container.