@brightcove/components-embed-code-modal 0.8.1 → 0.8.3

package/.eslintignore

@@ -0,0 +1,7 @@
+# node_modules, root dot file and folders are always ignored
+build/*
+scripts/*
+*.config.*
+package.json
+package-lock.json
+.*

package/.eslintrc

@@ -0,0 +1,23 @@
+{
+  "extends": [
+    "@brightcove/eslint-config-applications",
+    "@brightcove/eslint-config-applications/react",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:import/typescript",
+    "plugin:react-hooks/recommended",
+    "prettier"
+  ],
+  "rules": {
+    "react-hooks/rules-of-hooks": "warn",
+    "react-hooks/exhaustive-deps": "warn" 
+  },
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaVersion": 2020
+  } ,
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  }
+}

package/.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npm run pre-commit

package/.nvmrc

@@ -0,0 +1 @@
+v22.9.0

package/.prettierignore

@@ -0,0 +1,7 @@
+build/*
+scripts/*
+node_modules/*
+*.config.*
+package.json
+package-lock.json
+CODEOWNERS

package/.prettierrc

@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "jsxSingleQuote": true,
+  "trailingComma": "all"
+}

package/.release-it.json

@@ -0,0 +1,40 @@
+{
+  "hooks": {
+    "before:init": ["npm run lint", "npm install --legacy-peer-deps", "kacl prerelease"],
+    "after:bump": ["kacl release", "npm run build"],
+    "after:release": ["npm run notify", "echo Successfully released ${name} v${version} to ${repo.repository}."]
+  },
+  "git": {
+    "changelog": "git log --pretty=format:\"* %s (%h)\" ${latestTag}...HEAD",
+    "requireCleanWorkingDir": false,
+    "requireUpstream": false,
+    "requireCommits": true,
+    "addUntrackedFiles": false,
+    "commit": true,
+    "commitMessage": "Release v${version}",
+    "commitArgs": "",
+    "tag": true,
+    "tagName": "v${version}",
+    "tagAnnotation": "Release v${version}",
+    "tagArgs": "",
+    "push": true,
+    "pushArgs": "--follow-tags",
+    "pushRepo": "origin"
+  },
+  "github": {
+    "release": true,
+    "releaseName": "v${version}",
+    "releaseNotes": null,
+    "preRelease": false,
+    "draft": false,
+    "tokenRef": "GITHUB_TOKEN",
+    "assets": [],
+    "host": null,
+    "timeout": 0,
+    "proxy": null
+  },
+  "npm": {
+    "publish": true,
+    "publishPath": "./build"
+  }
+}

package/.whitesource

@@ -0,0 +1,3 @@
+{
+  "settingsInheritedFrom": "whitesource-config/whitesource-config@master"
+}

package/CHANGELOG.md

@@ -0,0 +1,342 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
+and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
+
+## [Unreleased]
+### Changed
+- [PLAYCUST-3043](https://brightcove.atlassian.net/browse/PLAYCUST-3043) Update to node v22.9.0
+
+## [0.8.2] - 2024-10-31
+### Added
+- [PLAYCUST-2953](https://brightcove.atlassian.net/browse/PLAYCUST-2953) Add translations
+
+## [0.8.1] - 2024-10-22
+### Fixed
+- [PLAYCUST-3157](https://brightcove.atlassian.net/browse/PLAYCUST-3157) Fix dvr default state and render logic
+
+## [0.8.0] - 2024-10-21
+### Added
+- [PLAYCUST-3157](https://brightcove.atlassian.net/browse/PLAYCUST-3157) Add support for low latency
+
+## [0.7.2] - 2024-10-03
+### Added
+- [PLAYCUST-3082](https://brightcove.atlassian.net/browse/PLAYCUST-3082) Update Embed Code Modal Library in Live 2.0
+
+## [0.7.1] - 2024-09-24
+### Fixed
+- [PLAYCUST-2882](https://brightcove.atlassian.net/browse/PLAYCUST-2882) Fix iframe embed code aspect ratio padding
+
+## [0.7.1] - 2024-09-24
+### Fixed
+- [PLAYCUST-2937](https://brightcove.atlassian.net/browse/PLAYCUST-2937) playerListForSelection breaking the module when being an empty array
+
+## [0.7.0] - 2024-09-23
+### Added
+- [PLAYCUST-2938](https://brightcove.atlassian.net/browse/PLAYCUST-2938) Add DVR livePlaybackToken option
+
+## [0.6.0] - 2024-08-14
+### Added
+- [PLAYCUST-2595](https://brightcove.atlassian.net/browse/PLAYCUST-2595) Display custom settings for Project type
+
+### Fixed
+- [PLAYCUST-2595](https://brightcove.atlassian.net/browse/PLAYCUST-2595) Horizontal scroll getting displayed when expanding custom settings section
+- [PLAYCUST-2584](https://brightcove.atlassian.net/browse/PLAYCUST-2584) Use correct aspect ratio class
+
+## [0.5.1] - 2024-07-22
+### Fixed
+- [PLAYCUST-2799](https://brightcove.atlassian.net/browse/PLAYCUST-2799) Disable iframe for MAPs enabled player
+
+## [0.5.0] - 2024-04-17
+### Changed
+- [PLAYCUST-2449](https://brightcove.atlassian.net/browse/PLAYCUST-2449) Remove Player Preview and links when player is of type outstream
+
+### Fixed
+- [PLAYCUST-2455](https://brightcove.atlassian.net/browse/PLAYCUST-2455) Fix viewer ID tracking validation
+
+## [0.4.4] - 2024-03-29
+### Added
+- [PLAYCUST-2249](https://brightcove.atlassian.net/browse/PLAYCUST-2249) Support for interactivityProjectId
+
+## [0.4.3] - 2024-03-29
+### Added
+- [PLAYCUST-2368](https://brightcove.atlassian.net/browse/PLAYCUST-2368) Disable iframe publish for Viewer ID Tracking
+- [PLAYCUST-2249](https://brightcove.atlassian.net/browse/PLAYCUST-2249) Player select component
+
+## [0.4.2] - 2023-12-29
+### Fixed
+- [PLAYCUST-2002](https://brightcove.atlassian.net/browse/PLAYCUST-2002) Demo site not working
+
+## [0.4.1] - 2023-11-24
+### Fixed
+- [PLAYCUST-2050](https://brightcove.atlassian.net/browse/PLAYCUST-2050) Fix Javascript tab crash
+
+## [0.4.0] - 2023-11-02
+### Added
+- [PLAYCUST-1941](https://brightcove.atlassian.net/browse/PLAYCUST-1941) Preselect favorite player in Video Embed
+- [PLAYCUST-1946](https://brightcove.atlassian.net/browse/PLAYCUST-1946) Custom settings dropdown for TYPE VIDEO
+
+### Changed
+- [PLAYCUST-1469](https://brightcove.atlassian.net/browse/PLAYCUST-1469) `preview` link from Player Type now redirects to preview-players.brightcove.net
+
+## [0.3.7] - 2023-09-18
+### Added
+- [PLAYCUST-1947](https://brightcove.atlassian.net/browse/PLAYCUST-1947)`embedCodeProperties` prop for the Embed Code generation
+
+## [0.3.6] - 2023-07-19
+### Fixed
+- [PLAYCUST-1720](https://brightcove.atlassian.net/browse/PLAYCUST-1720) Fix typography for iframe text from `iFrame` to `iframe`
+- [PLAYCUST-1899](https://brightcove.atlassian.net/browse/PLAYCUST-1899) Create player with v2 interactivity plugin
+
+## [0.3.5] - 2023-04-19
+### Changed
+- [PLAYCUST-1618](https://brightcove.atlassian.net/browse/PLAYCUST-1618) [BREAKING] Change prop name from `playerPayload` to `data`
+
+## [0.3.4] - 2023-03-23
+### Fixed
+- Internal: Updated peerDependencies
+
+## [0.3.3] - 2023-03-23
+### Fixed
+- [PLAYCUST-1648](https://brightcove.atlassian.net/browse/PLAYCUST-1648) Project Player Preview when player has been created
+
+## [0.3.2] - 2023-03-07
+### Fixed
+- [PLAYCUST-1637](https://brightcove.atlassian.net/browse/PLAYCUST-1637) Fixed Project Player Preview
+- [PLAYCUST-1624](https://brightcove.atlassian.net/browse/PLAYCUST-1624) Update no player modal text to reference players module
+
+## [0.3.1] - 2023-03-02
+### Fixed
+- [PLAYCUST-1625](https://brightcove.atlassian.net/browse/PLAYCUST-1625) Check for Interactivity Plugin using Registry ID OR Name
+
+## [0.3.0] - 2023-03-01
+### Changed
+- [PLAYCUST-1625](https://brightcove.atlassian.net/browse/PLAYCUST-1625) Check for Interactivity Plugin using Registry ID
+
+## [0.2.2] - 2023-02-21
+### Changed
+- [LIVE-2447](https://brightcove.atlassian.net/browse/LIVE-2447) Default playerID to be the first in the list
+
+## [0.2.1] - 2023-02-15
+### Fixed
+- [LIVE-2447](https://brightcove.atlassian.net/browse/LIVE-2447) Update peerDependencies and dependencies
+
+## [0.2.0] - 2023-02-08
+### Fixed
+- [LIVE-2447](https://brightcove.atlassian.net/browse/LIVE-2447) Interactivity params for preview, player and embed code
+
+## [0.1.28] - 2023-02-01
+### Added
+- [LIVE-2455](https://brightcove.atlassian.net/browse/LIVE-2455) Create Player if no Interactivity-enabled Player is found
+- [LIVE-2533](https://brightcove.atlassian.net/browse/LIVE-2533) Embed Code Modal Translations
+
+## [0.1.27] - 2022-12-21
+### Added
+- [LIVE-2448](https://brightcove.atlassian.net/browse/LIVE-2448) Interactivity attribute to react player loader when using the interactivity modal
+
+## [0.1.26] - 2022-11-18
+### Added
+- Support for Interactivity player
+
+## [0.1.25] - 2022-10-06
+### Added
+- Campaign Plugin and Plugins notice for Player embed
+
+### Changed
+- VideoPayload type
+
+## [0.1.24] - 2022-09-29
+### Changed
+- Export for payload types
+
+## [0.1.23] - 2022-09-28
+### Added
+- Export for `PlayerPayload`
+
+### Fixed
+- Typings in `package.json`
+
+## [0.1.22] - 2022-09-27
+### Fixed
+- Type exports for build
+
+## [0.1.21] - 2022-09-01
+### Added
+- Player type context
+
+### Changed
+- **BREAKING CHANGE** `video` prop to `data`
+
+## [0.1.20] - 2022-08-11
+### Fixed
+- Video title truncation small fix
+
+## [0.1.19] - 2022-08-09
+### Fixed
+- PLAYCUST-1254 add support for safari clipboard
+- PLAYCUST-1254 make sure peerDep for @brightcove/react-player-loader matches with media-four module
+- remove unused variables
+- Long video titles are now truncated
+
+## [0.1.18] - 2022-08-03
+### Changed
+- upgrade `@brightcove/studio-components` to 7.0.0
+- remove deprecated props
+
+## [0.1.17] - 2022-07-26
+### Changed
+- Add `@brightcove/react-player-loader` as peerDependency so its handled by parent module
+
+## [0.1.16] - 2022-07-22
+### Changed
+- Removed older design
+
+### Fixed
+- Translation strings when copying url
+- Support custom css on player configuration by using iframes
+- Translation string when Campaign player is selected
+
+## [0.1.15] - 2022-07-13
+### Added
+- Sort players dropdown
+
+### Fixed
+- Trigger Toast notifications up to parent module
+
+## [0.1.14] - 2022-07-05
+### Fixed
+- Hide iFrame embed code for Campaign-enabled players
+
+## [0.1.13] - 2022-06-29
+### Added
+- Shorten url on preview button click
+
+### Fixed
+- Show Config Message only for players with non-bc plugins
+
+## [0.1.12] - 2022-06-24
+### Fixed
+- Remove extra preview button
+
+## [0.1.11] - 2022-06-20
+### Added
+- Add Copy URL and Preview button
+
+## [0.1.10] - 2022-06-01
+### Changed
+- update custom copy field
+
+## [0.1.9] - 2022-05-26
+### Changed
+- `CopyField` to use latest `studio-components` version
+
+### Fixed
+- Keep Javascript enabled for campaign players
+
+## [0.1.8] - 2022-05-26
+### Added
+- Prevent iFrame from being copied when the selected player is campaign
+
+## [0.1.7] - 2022-05-23
+### Fixed
+- `EmbedCodeModalTypes` export change to value instead of type
+
+## [0.1.6] - 2022-05-18
+### Added
+- Notice when player selected has plugins
+- Update iFrame/Javascript code snippet when selected player changes
+- Player preview using ReactPlayerLoader
+- Player preview link updates with player selected
+
+### Fixed
+- Only fetch list of players when modal is open
+
+## [0.1.5] - 2022-05-10
+### Added
+- Feature switch for new enhancements
+- Component now receives a `type` prop
+- Fetch list of players
+
+### Changed
+- Design updates
+
+## [0.1.4] - 2022-04-28
+### Added
+- KACL validation
+
+### Fixed
+- Missing docs link in tooltip
+
+## [0.1.3] - 2022-04-12
+### Changed
+- Toaster moved to be inside modal content
+
+## [0.1.2] - 2022-02-23
+### Changed
+- Style tweaks for the modal
+
+## [0.1.1] - 2021-12-21
+### Added
+- Trigger open when video object gets passed into props
+
+## 0.1.0 - 2021-11-26
+### Added
+- Initial commit of embed code modal component
+
+[Unreleased]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.8.2...HEAD
+[0.8.2]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.8.1...v0.8.2
+[0.8.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.8.0...v0.8.1
+[0.8.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.7.2...v0.8.0
+[0.7.2]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.7.1...v0.7.2
+[0.7.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.7.1...v0.7.1
+[0.7.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.7.0...v0.7.1
+[0.7.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.6.0...v0.7.0
+[0.6.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.5.1...v0.6.0
+[0.5.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.5.0...v0.5.1
+[0.5.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.4.4...v0.5.0
+[0.4.4]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.4.3...v0.4.4
+[0.4.3]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.4.2...v0.4.3
+[0.4.2]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.4.1...v0.4.2
+[0.4.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.4.0...v0.4.1
+[0.4.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.7...v0.4.0
+[0.3.7]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.6...v0.3.7
+[0.3.6]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.5...v0.3.6
+[0.3.5]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.4...v0.3.5
+[0.3.4]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.3...v0.3.4
+[0.3.3]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.2...v0.3.3
+[0.3.2]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.1...v0.3.2
+[0.3.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.3.0...v0.3.1
+[0.3.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.2.2...v0.3.0
+[0.2.2]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.2.1...v0.2.2
+[0.2.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.2.0...v0.2.1
+[0.2.0]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.28...v0.2.0
+[0.1.28]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.27...v0.1.28
+[0.1.27]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.26...v0.1.27
+[0.1.26]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.25...v0.1.26
+[0.1.25]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.24...v0.1.25
+[0.1.24]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.23...v0.1.24
+[0.1.23]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.22...v0.1.23
+[0.1.22]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.21...v0.1.22
+[0.1.21]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.20...v0.1.21
+[0.1.20]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.19...v0.1.20
+[0.1.19]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.18...v0.1.19
+[0.1.18]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.17...v0.1.18
+[0.1.17]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.16...v0.1.17
+[0.1.16]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.15...v0.1.16
+[0.1.15]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.14...v0.1.15
+[0.1.14]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.13...v0.1.14
+[0.1.13]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.12...v0.1.13
+[0.1.12]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.11...v0.1.12
+[0.1.11]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.10...v0.1.11
+[0.1.10]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.9...v0.1.10
+[0.1.9]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.8...v0.1.9
+[0.1.8]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.7...v0.1.8
+[0.1.7]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.6...v0.1.7
+[0.1.6]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.5...v0.1.6
+[0.1.5]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.4...v0.1.5
+[0.1.4]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.3...v0.1.4
+[0.1.3]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.2...v0.1.3
+[0.1.2]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.1...v0.1.2
+[0.1.1]: https://bithub.brightcove.com/studio-ui-kit/studio-components-embed-code-modal/compare/v0.1.0...v0.1.1

package/CODEOWNERS

@@ -0,0 +1,37 @@
+# This is a comment.
+# Each line is a file pattern followed by one or more owners.
+
+# These owners will be the default owners for everything in
+# the repo. Unless a later match takes precedence,
+# @global-owner1 and @global-owner2 will be requested for
+# review when someone opens a pull request.
+*       @studio-ui-kit/player-customization-team
+
+# Order is important; the last matching pattern takes the most
+# precedence. When someone opens a pull request that only
+# modifies JS files, only @js-owner and not the global
+# owner(s) will be requested for a review.
+# *.js    @js-owner
+
+# You can also use email addresses if you prefer. They'll be
+# used to look up users just like we do for commit author
+# emails.
+# *.go docs@example.com
+
+# In this example, @doctocat owns any files in the build/logs
+# directory at the root of the repository and any of its
+# subdirectories.
+# /build/logs/ @doctocat
+
+# The `docs/*` pattern will match files like
+# `docs/getting-started.md` but not further nested files like
+# `docs/build-app/troubleshooting.md`.
+# docs/*  docs@example.com
+
+# In this example, @octocat owns any file in an apps directory
+# anywhere in your repository.
+# apps/ @octocat
+
+# In this example, @doctocat owns any file in the `/docs`
+# directory in the root of your repository.
+# /docs/ @doctocat

package/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,17 @@
+## Description
+
+Give context for the issue/feature you worked on and a brief explanation on how you solved it.
+
+## Screenshots _[Optional]_
+
+If applicable, attach images of the before and after of the changes
+
+## PR Checklist
+
+- [ ] New components have `testName` or `data-test-name` props
+
+_Checklist items are optional if you do not need to make any changes to them_
+
+## Link to issue
+
+Link to Jira ticket

package/__tests__/EmbedCode.test.tsx

@@ -0,0 +1,51 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { ModalContainer } from '../src/js/components';
+import { EmbedCodeModalTypes } from '../src';
+import { QueryClientProvider, QueryClient } from 'react-query';
+
+const DEFAULT_MODAL_COMP = {
+  videoId: '123',
+  videoName: 'test video',
+  accountId: '456',
+  duration: 10,
+};
+
+const wrappedComponent = (children: React.ReactElement) => (
+  <QueryClientProvider client={new QueryClient()}>
+    {children}
+  </QueryClientProvider>
+);
+
+const handleSetComponentKey = jest.fn;
+const handleSetHasCreatedPlayer = jest.fn;
+
+test('does not render player with wrong information but right type', () => {
+  const { container } = render(
+    wrappedComponent(
+      <ModalContainer
+        handleSetComponentKey={handleSetComponentKey}
+        data={DEFAULT_MODAL_COMP}
+        hasCreatedPlayer={false}
+        handleSetHasCreatedPlayer={handleSetHasCreatedPlayer}
+        embedCodeModalType={EmbedCodeModalTypes.PLAYER}
+      />,
+    ),
+  );
+  expect(container.innerHTML).toBe('');
+});
+
+test('does not render project with wrong information but right type', () => {
+  const { container } = render(
+    wrappedComponent(
+      <ModalContainer
+        handleSetComponentKey={handleSetComponentKey}
+        data={DEFAULT_MODAL_COMP}
+        hasCreatedPlayer={false}
+        handleSetHasCreatedPlayer={handleSetHasCreatedPlayer}
+        embedCodeModalType={EmbedCodeModalTypes.PROJECT}
+      />,
+    ),
+  );
+  expect(container.innerHTML).toBe('');
+});

package/__tests__/InteractivityProject.test.tsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import { QueryClientProvider, QueryClient } from 'react-query';
+import { render, screen } from '@testing-library/react';
+import { VideoPlayer } from 'js/components';
+import { EmbedCodeModalTypes } from 'js/types/EmbedCodeModalProps';
+import { PLAYER_LIST_FOR_SELECTION, PLAYERS } from 'js/constants/player';
+
+jest.mock('../src/js/utils/featureSwitches');
+
+const wrappedComponent = (children: React.ReactElement) => (
+  <QueryClientProvider client={new QueryClient()}>
+    {children}
+  </QueryClientProvider>
+);
+
+const DEFAULT_MODAL_COMP = {
+  videoId: '123',
+  videoName: 'test video',
+  interactivityProjectId: '9876',
+  interactivityProjectName: 'test project',
+  accountId: '456',
+  duration: 10,
+};
+
+test('renders EmbedCodeModal component with right information', () => {
+  render(
+    wrappedComponent(
+      <VideoPlayer
+        video={DEFAULT_MODAL_COMP}
+        embedCodeModalType={EmbedCodeModalTypes.PROJECT}
+        playerListForSelection={PLAYER_LIST_FOR_SELECTION}
+        players={PLAYERS}
+      />,
+    ),
+  );
+  expect(
+    screen.getByText(DEFAULT_MODAL_COMP.interactivityProjectId),
+  ).toBeInTheDocument();
+  expect(
+    screen.getByText(DEFAULT_MODAL_COMP.interactivityProjectName),
+  ).toBeInTheDocument();
+  expect(
+    screen.queryByText(DEFAULT_MODAL_COMP.videoId),
+  ).not.toBeInTheDocument();
+  expect(
+    screen.queryByText(DEFAULT_MODAL_COMP.videoName),
+  ).not.toBeInTheDocument();
+  expect(screen.getByRole('tab', { name: /javascript/i })).toBeInTheDocument();
+  expect(screen.getByRole('tab', { name: /IFrame/i })).toBeInTheDocument();
+});

package/__tests__/PlayerPreview.test.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { PlayerPreview } from '../src/js/components';
+import { QueryClientProvider, QueryClient } from 'react-query';
+
+const DEFAULT_MODAL_COMP = {
+  id: 'default',
+  accountId: '456',
+};
+
+const wrappedComponent = (children: React.ReactElement) => (
+  <QueryClientProvider client={new QueryClient()}>
+    {children}
+  </QueryClientProvider>
+);
+
+test('renders PlayerPreview component with right information', () => {
+  render(wrappedComponent(<PlayerPreview {...DEFAULT_MODAL_COMP} />));
+  expect(screen.getByText('getURL')).toBeInTheDocument();
+  expect(screen.getByText('previewButton')).toBeInTheDocument();
+  expect(screen.getByRole('tab', { name: /javascript/i })).toBeInTheDocument();
+  expect(screen.getByRole('tab', { name: /IFrame/i })).toBeInTheDocument();
+});

package/__tests__/TabsHeader.test.tsx

@@ -0,0 +1,19 @@
+import React from 'react';
+import { act, fireEvent, render } from '@testing-library/react';
+import { TabsHeader } from '../src/js/components';
+
+const DEFAULT_MODAL_COMP = {
+  currentTab: 'iframe',
+  handleTabChange: jest.fn(),
+  iframeLabel: 'iframe',
+  jsLabel: 'js',
+};
+
+test('renders TabsHeader clickeable tabs', async () => {
+  const { getByRole } = render(<TabsHeader {...DEFAULT_MODAL_COMP} />);
+  const jsBtn = getByRole('tab', { name: DEFAULT_MODAL_COMP.jsLabel });
+  act(() => {
+    fireEvent.click(jsBtn);
+  });
+  expect(DEFAULT_MODAL_COMP.handleTabChange).toBeCalled();
+});