Skip to content

Commit

Permalink
Update readme, package.json and build-and-release
Browse files Browse the repository at this point in the history
  • Loading branch information
talk2MeGooseman authored Mar 13, 2024
1 parent 77a3223 commit bf0c767
Show file tree
Hide file tree
Showing 3 changed files with 42 additions and 37 deletions.
41 changes: 29 additions & 12 deletions .github/workflows/build-and-release.yml
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,7 @@ on:
types: [published]

jobs:
build:

build_and_publish:
runs-on: ubuntu-latest

steps:
Expand All @@ -24,16 +23,6 @@ jobs:
run: |
yarn lint
- name: Build Storybook
run: |
yarn release-storybook
# Switch to use https://github.com/actions/deploy-pages
# - name: Publish to Github Pages
# uses: maxheld83/[email protected]
# env:
# GH_PAT: ${{ secrets.GH_PAT }}
# BUILD_DIR: ".out/"

- name: Build Package Release
run: |
yarn release
Expand All @@ -42,3 +31,31 @@ jobs:
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN}}

deploy:
# Add a dependency to the build job
needs: build_and_publish

# Grant GITHUB_TOKEN the permissions required to make a Pages deployment
permissions:
pages: write # to deploy to Pages
id-token: write # to verify the deployment originates from an appropriate source

# Deploy to the github-pages environment
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}

# Specify runner + deployment step
runs-on: ubuntu-latest
steps:
- name: Build Storybook
run: |
yarn release-storybook
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
path: '.out/'
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4

35 changes: 11 additions & 24 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,20 +26,7 @@ import ReactTwitchEmbedVideo from "react-twitch-embed-video"
<ReactTwitchEmbedVideo channel="talk2megooseman" />
```

## Version 2 Notes

### Updates/Changes
- Refactor all code to use React Hooks instead of a class based component.
- Lowest version of React supported is now 16.8 (version React Hooks was introduced in)
- Removed onUserLogin, it appears Twitch stopped supporting this all together based off the docs
- Added targetId property for defining mutiple video players
- `onPlayerReady` renamed to `onReady`
- `onVideoPlay` renamed to `onPlay`

### Breaking Changes
In version one I was mistakenly using `targetClass` prop for populating the `id` attribute for the Twitch Player. So I created a new prop called `targetId` to use to define more then one Twitch Player on your page. `targetClass` now properly sets the class for the player for proper styling.
If you were one of the users the was creating more then on Twitch player on your page, just switch from using `targetClass` to `targetId` and things should still work properly.
If you're using `onPlayerReady` or `onVideoPlay`, make sure to rename them to the new prop names.
For full documentation on how to use React Twitch Embed Video visit: https://talk2megooseman.github.io/react-twitch-embed-video/

## Troubleshooting

Expand All @@ -53,26 +40,26 @@ If you're using `onPlayerReady` or `onVideoPlay`, make sure to rename them to th
1. Install modules
> yarn
2. Check **_package.json_** so that the information is correct.
3. Start storybook and start coding!
> yarn start
1. Start storybook and start coding!
> yarn dev
4. Bundle with `yarn build --watch`
5. Make project available locally by using `npm link`
6. To test if it works correctly in another project you can use npm `npm link react-twitch-embed-video`
1. Make project available locally by using `npm link`
1. To test if it works correctly in another project you can use npm `npm link react-twitch-embed-video`
1. Verify all tests are passing
> yarn test
#### Extra
* If you want to run eslint:
> yarn lint

* If you want to automatically fix lint problems run :
> yarn lint-fix
> yarn lint:fix
Commands
----
- `yarn`
- `yarn build`
- `yarn test`
- `yarn coverage`
- `yarn start`
- `yarn release`
- `yarn lint`
- `yarn lint-fix`
- `yarn lint:fix`
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-twitch-embed-video",
"version": "3.0.3",
"version": "3.1.0",
"author": "Erik Guzman <[email protected]>",
"description": "Allows you to easily embed a twitch video in your ReactJS application",
"bugs": {
Expand Down Expand Up @@ -31,6 +31,7 @@
"build": "vite build",
"dev": "storybook dev -p 9001",
"lint": "eslint --color --ext .js,.md,.ts,.tsx src",
"lint:fix": "eslint --fix --color --ext .js,.md,.ts,.tsx src",
"release-storybook": "storybook build -o .out",
"release": "vite build",
"test": "vitest",
Expand Down

0 comments on commit bf0c767

Please sign in to comment.