Merge pull request #39 from jaaneh/fix/defaultprops-to-default-params

fix/defaultprops to default params
moonstar-x · Jan 6, 2024 · 8a3e15c · 8a3e15c
2 parents c198a9f + 389b090
commit 8a3e15c
Show file tree

Hide file tree

Showing 7 changed files with 4,119 additions and 24,011 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-twitch-embed",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "A collection of components to embed Twitch.",
   "author": "moonstar-x",
   "license": "MIT",

diff --git a/src/components/TwitchChat.tsx b/src/components/TwitchChat.tsx
@@ -13,21 +13,14 @@ export interface TwitchChatProps extends React.HTMLAttributes<HTMLIFrameElement>
   width?: string | number
 }
 
-const defaultProps: Partial<TwitchChatProps> = {
-  darkMode: DEFAULTS.DARK_MODE,
-  title: DEFAULTS.TITLE.TWITCH_CHAT,
-  height: DEFAULTS.CHAT.HEIGHT,
-  width: DEFAULTS.CHAT.WIDTH
-};
-
 const TwitchChat: React.FC<TwitchChatProps> = ({
   channel,
   parent,
-  darkMode,
+  darkMode = DEFAULTS.DARK_MODE,
 
-  title,
-  height,
-  width,
+  title = DEFAULTS.TITLE.TWITCH_CHAT,
+  height = DEFAULTS.CHAT.HEIGHT,
+  width = DEFAULTS.CHAT.WIDTH,
   ...props
 }) => {
   const hostname = useHostname();
@@ -52,6 +45,4 @@ const TwitchChat: React.FC<TwitchChatProps> = ({
   );
 };
 
-TwitchChat.defaultProps = defaultProps;
-
 export default TwitchChat;
diff --git a/src/components/TwitchClip.tsx b/src/components/TwitchClip.tsx
@@ -14,23 +14,15 @@ export interface TwitchClipProps extends React.HTMLAttributes<HTMLIFrameElement>
   width?: string | number
 }
 
-const defaultProps: Partial<TwitchClipProps> = {
-  autoplay: DEFAULTS.AUTOPLAY,
-  muted: DEFAULTS.MUTED,
-  title: DEFAULTS.TITLE.TWITCH_CLIP,
-  height: DEFAULTS.MEDIA.HEIGHT,
-  width: DEFAULTS.MEDIA.WIDTH
-};
-
 const TwitchClip: React.FC<TwitchClipProps> = ({
   clip,
   parent,
-  autoplay,
-  muted,
+  autoplay = DEFAULTS.AUTOPLAY,
+  muted = DEFAULTS.MUTED,
 
-  title,
-  height,
-  width,
+  title = DEFAULTS.TITLE.TWITCH_CLIP,
+  height = DEFAULTS.MEDIA.HEIGHT,
+  width = DEFAULTS.MEDIA.WIDTH,
   ...props
 }) => {
   const hostname = useHostname();
@@ -56,6 +48,4 @@ const TwitchClip: React.FC<TwitchClipProps> = ({
   );
 };
 
-TwitchClip.defaultProps = defaultProps;
-
 export default TwitchClip;
diff --git a/src/components/TwitchEmbed.tsx b/src/components/TwitchEmbed.tsx
@@ -30,23 +30,6 @@ export interface TwitchEmbedProps extends React.HTMLAttributes<HTMLDivElement> {
   width?: string | number
 }
 
-const defaultProps: Partial<TwitchEmbedProps> = {
-  allowFullscreen: DEFAULTS.ALLOW_FULLSCREEN,
-  autoplay: DEFAULTS.AUTOPLAY,
-  withChat: DEFAULTS.WITH_CHAT,
-  muted: DEFAULTS.MUTED,
-  darkMode: DEFAULTS.DARK_MODE,
-  time: DEFAULTS.TIME,
-  hideControls: DEFAULTS.HIDE_CONTROLS,
-  onAuthenticate: typedNoop2<TwitchEmbedInstance, OnAuthenticateData>(),
-  onVideoPlay: typedNoop2<TwitchEmbedInstance, OnPlayData>(),
-  onVideoPause: typedNoop<TwitchEmbedInstance>(),
-  onVideoReady: typedNoop<TwitchEmbedInstance>(),
-  id: DEFAULTS.ID.TWITCH_EMBED,
-  height: DEFAULTS.MEDIA.HEIGHT,
-  width: DEFAULTS.MEDIA.WIDTH
-};
-
 const nonReconstructTriggeringProps: (keyof TwitchEmbedProps)[] = ['channel', 'video', 'collection', 'height', 'width'];
 const shouldReconstructEmbed = (previousProps: TwitchEmbedProps | undefined, props: TwitchEmbedProps): boolean => {
   return objectCompareWithIgnoredKeys(
@@ -58,26 +41,26 @@ const shouldReconstructEmbed = (previousProps: TwitchEmbedProps | undefined, pro
 
 const TwitchEmbed: React.FC<TwitchEmbedProps> = (props) => {
   const {
-    allowFullscreen,
-    autoplay,
+    allowFullscreen = DEFAULTS.ALLOW_FULLSCREEN,
+    autoplay = DEFAULTS.AUTOPLAY,
     channel,
     video,
     collection,
-    withChat,
-    muted,
+    withChat = DEFAULTS.WITH_CHAT,
+    muted = DEFAULTS.MUTED,
     parent,
-    darkMode,
-    time,
-    hideControls,
-
-    onAuthenticate,
-    onVideoPlay,
-    onVideoPause,
-    onVideoReady,
-
-    id,
-    height,
-    width,
+    darkMode = DEFAULTS.DARK_MODE,
+    time = DEFAULTS.TIME,
+    hideControls = DEFAULTS.HIDE_CONTROLS,
+
+    onAuthenticate = typedNoop2<TwitchEmbedInstance, OnAuthenticateData>(),
+    onVideoPlay = typedNoop2<TwitchEmbedInstance, OnPlayData>(),
+    onVideoPause = typedNoop<TwitchEmbedInstance>(),
+    onVideoReady = typedNoop<TwitchEmbedInstance>(),
+
+    id = DEFAULTS.ID.TWITCH_EMBED,
+    height = DEFAULTS.MEDIA.HEIGHT,
+    width = DEFAULTS.MEDIA.WIDTH,
     ...restOfProps
   } = props;
 
@@ -173,6 +156,4 @@ const TwitchEmbed: React.FC<TwitchEmbedProps> = (props) => {
   );
 };
 
-TwitchEmbed.defaultProps = defaultProps;
-
 export default TwitchEmbed;
diff --git a/src/components/TwitchPlayer.tsx b/src/components/TwitchPlayer.tsx
@@ -35,28 +35,6 @@ export interface TwitchPlayerProps extends Omit<React.HTMLAttributes<HTMLDivElem
   width?: string | number
 }
 
-const defaultProps: Partial<TwitchPlayerProps> = {
-  autoplay: DEFAULTS.AUTOPLAY,
-  muted: DEFAULTS.MUTED,
-  time: DEFAULTS.TIME,
-  allowFullscreen: DEFAULTS.ALLOW_FULLSCREEN,
-  playsInline: DEFAULTS.INLINE,
-  hideControls: DEFAULTS.HIDE_CONTROLS,
-  onCaptions: typedNoop2<TwitchPlayerInstance, string>(),
-  onEnded: typedNoop<TwitchPlayerInstance>(),
-  onPause: typedNoop<TwitchPlayerInstance>(),
-  onPlay: typedNoop2<TwitchPlayerInstance, OnPlayData>(),
-  onPlaybackBlocked: typedNoop<TwitchPlayerInstance>(),
-  onPlaying: typedNoop<TwitchPlayerInstance>(),
-  onOffline: typedNoop<TwitchPlayerInstance>(),
-  onOnline: typedNoop<TwitchPlayerInstance>(),
-  onReady: typedNoop<TwitchPlayerInstance>(),
-  onSeek: typedNoop2<TwitchPlayerInstance, OnSeekData>(),
-  id: DEFAULTS.ID.TWITCH_PLAYER,
-  height: DEFAULTS.MEDIA.HEIGHT,
-  width: DEFAULTS.MEDIA.WIDTH
-};
-
 const nonReconstructTriggeringProps: (keyof TwitchPlayerProps)[] = ['channel', 'video', 'collection', 'height', 'width'];
 const shouldReconstructPlayer = (previousProps: TwitchPlayerProps | undefined, props: TwitchPlayerProps): boolean => {
   return objectCompareWithIgnoredKeys(
@@ -72,27 +50,27 @@ const TwitchPlayer: React.FC<TwitchPlayerProps> = (props) => {
     video,
     collection,
     parent,
-    autoplay,
-    muted,
-    time,
-    allowFullscreen,
-    playsInline,
-    hideControls,
-
-    onCaptions,
-    onEnded,
-    onPause,
-    onPlay,
-    onPlaybackBlocked,
-    onPlaying,
-    onOffline,
-    onOnline,
-    onReady,
-    onSeek,
-
-    id,
-    height,
-    width,
+    autoplay = DEFAULTS.AUTOPLAY,
+    muted = DEFAULTS.MUTED,
+    time = DEFAULTS.TIME,
+    allowFullscreen = DEFAULTS.ALLOW_FULLSCREEN,
+    playsInline = DEFAULTS.INLINE,
+    hideControls = DEFAULTS.HIDE_CONTROLS,
+
+    onCaptions = typedNoop2<TwitchPlayerInstance, string>(),
+    onEnded = typedNoop<TwitchPlayerInstance>(),
+    onPause = typedNoop<TwitchPlayerInstance>(),
+    onPlay = typedNoop2<TwitchPlayerInstance, OnPlayData>(),
+    onPlaybackBlocked = typedNoop<TwitchPlayerInstance>(),
+    onPlaying = typedNoop<TwitchPlayerInstance>(),
+    onOffline = typedNoop<TwitchPlayerInstance>(),
+    onOnline = typedNoop<TwitchPlayerInstance>(),
+    onReady = typedNoop<TwitchPlayerInstance>(),
+    onSeek = typedNoop2<TwitchPlayerInstance, OnSeekData>(),
+
+    id = DEFAULTS.ID.TWITCH_PLAYER,
+    height = DEFAULTS.MEDIA.HEIGHT,
+    width = DEFAULTS.MEDIA.WIDTH,
     ...restOfProps
   } = props;
 
@@ -198,6 +176,4 @@ const TwitchPlayer: React.FC<TwitchPlayerProps> = (props) => {
   );
 };
 
-TwitchPlayer.defaultProps = defaultProps;
-
 export default TwitchPlayer;
diff --git a/src/components/TwitchPlayerNonInteractive.tsx b/src/components/TwitchPlayerNonInteractive.tsx
@@ -17,27 +17,18 @@ export interface TwitchPlayerNonInteractiveProps extends React.HTMLAttributes<HT
   width?: string | number
 }
 
-const defaultProps: Partial<TwitchPlayerNonInteractiveProps> = {
-  autoplay: DEFAULTS.AUTOPLAY,
-  muted: DEFAULTS.MUTED,
-  time: DEFAULTS.TIME,
-  title: DEFAULTS.TITLE.TWITCH_PLAYER_NON_INTERACTIVE,
-  height: DEFAULTS.MEDIA.HEIGHT,
-  width: DEFAULTS.MEDIA.WIDTH
-};
-
 const TwitchPlayerNonInteractive: React.FC<TwitchPlayerNonInteractiveProps> = ({
   parent,
   channel,
   video,
   collection,
-  autoplay,
-  muted,
-  time,
+  autoplay = DEFAULTS.AUTOPLAY,
+  muted = DEFAULTS.MUTED,
+  time = DEFAULTS.TIME,
 
-  title,
-  height,
-  width,
+  title = DEFAULTS.TITLE.TWITCH_PLAYER_NON_INTERACTIVE,
+  height = DEFAULTS.MEDIA.HEIGHT,
+  width = DEFAULTS.MEDIA.WIDTH,
   ...props
 }) => {
   const hostname = useHostname();
@@ -68,6 +59,4 @@ const TwitchPlayerNonInteractive: React.FC<TwitchPlayerNonInteractiveProps> = ({
   );
 };
 
-TwitchPlayerNonInteractive.defaultProps = defaultProps;
-
 export default TwitchPlayerNonInteractive;