diff --git a/app/components-react/shared/NewBadge.tsx b/app/components-react/shared/NewBadge.tsx index 2354eea1f199..58118af59b4d 100644 --- a/app/components-react/shared/NewBadge.tsx +++ b/app/components-react/shared/NewBadge.tsx @@ -7,6 +7,9 @@ import cx from 'classnames'; import { $t } from 'services/i18n'; interface INewButtonProps { + // children is a special React property which allows access any child elements including text + children?: string; + dismissableKey: EDismissable; size?: 'standard' | 'small'; absolute?: boolean; @@ -14,6 +17,7 @@ interface INewButtonProps { } export default function NewButton({ + children = "", dismissableKey, size = 'standard', absolute = false, @@ -37,7 +41,7 @@ export default function NewButton({ )} style={style} > - {$t('New')} + {children.length !== 0 ? $t(children) : $t('New')} ); } diff --git a/app/components-react/windows/go-live/PlatformSettings.tsx b/app/components-react/windows/go-live/PlatformSettings.tsx index b77aa55928e0..86b0d2f581aa 100644 --- a/app/components-react/windows/go-live/PlatformSettings.tsx +++ b/app/components-react/windows/go-live/PlatformSettings.tsx @@ -61,6 +61,9 @@ export default function PlatformSettings() { get value() { return getDefined(settings.platforms[platform]); }, + get enabledPlatformsCount() { + return enabledPlatforms.length; + }, onChange(newSettings) { updatePlatform(platform, newSettings); }, diff --git a/app/components-react/windows/go-live/platforms/PlatformSettingsLayout.tsx b/app/components-react/windows/go-live/platforms/PlatformSettingsLayout.tsx index 0efbbe59e47b..292c2f78c00e 100644 --- a/app/components-react/windows/go-live/platforms/PlatformSettingsLayout.tsx +++ b/app/components-react/windows/go-live/platforms/PlatformSettingsLayout.tsx @@ -46,4 +46,5 @@ export interface IPlatformComponentParams { layoutMode: TLayoutMode; isUpdateMode?: boolean; isScheduleMode?: boolean; + enabledPlatformsCount?: number; } diff --git a/app/components-react/windows/go-live/platforms/TwitchEditStreamInfo.tsx b/app/components-react/windows/go-live/platforms/TwitchEditStreamInfo.tsx index 8c484cb0bb2a..8f8bc0b1727e 100644 --- a/app/components-react/windows/go-live/platforms/TwitchEditStreamInfo.tsx +++ b/app/components-react/windows/go-live/platforms/TwitchEditStreamInfo.tsx @@ -16,6 +16,9 @@ import AiHighlighterToggle from '../AiHighlighterToggle'; import { Services } from 'components-react/service-provider'; import { EAvailableFeatures } from 'services/incremental-rollout'; +import Badge from 'components-react/shared/NewBadge'; +import { EDismissable } from 'services/dismissables'; + export function TwitchEditStreamInfo(p: IPlatformComponentParams<'twitch'>) { const twSettings = p.value; const aiHighlighterFeatureEnabled = Services.IncrementalRolloutService.views.featureIsEnabled( @@ -25,6 +28,7 @@ export function TwitchEditStreamInfo(p: IPlatformComponentParams<'twitch'>) { p.onChange({ ...twSettings, ...patch }); } + const enhancedBroadcastingTooltipText = $t('Enhanced broadcasting automatically optimizes your settings to encode and send multiple video qualities to Twitch. Selecting this option will send basic information about your computer and software setup.'); const bind = createBinding(twSettings, updatedSettings => updateSettings(updatedSettings)); const optionalFields = ( @@ -34,6 +38,12 @@ export function TwitchEditStreamInfo(p: IPlatformComponentParams<'twitch'>) { + {p.enabledPlatformsCount === 1 && +
+ + Beta +
+
} ); return ( diff --git a/app/components-react/windows/go-live/useGoLiveSettings.ts b/app/components-react/windows/go-live/useGoLiveSettings.ts index f9fa60ab5dd2..290d3c19fbe4 100644 --- a/app/components-react/windows/go-live/useGoLiveSettings.ts +++ b/app/components-react/windows/go-live/useGoLiveSettings.ts @@ -49,6 +49,12 @@ class GoLiveSettingsState extends StreamInfoView { * Update top level settings */ updateSettings(patch: Partial) { + if (patch.platforms?.twitch) { + Services.SettingsService.actions.setEnhancedBroadcasting( + patch.platforms.twitch.isEnhancedBroadcasting, + ); + } + const newSettings = { ...this.state, ...patch }; // we should re-calculate common fields before applying new settings const platforms = this.getViewFromState(newSettings).applyCommonFields(newSettings.platforms); diff --git a/app/i18n/en-US/streaming.json b/app/i18n/en-US/streaming.json index 2477815bae7b..693dcd427aea 100644 --- a/app/i18n/en-US/streaming.json +++ b/app/i18n/en-US/streaming.json @@ -289,6 +289,8 @@ "Issues": "Issues", "Multistream Error": "Multistream Error", "One of destinations might have incomplete permissions. Reconnect the destinations in settings and try again.": "One of destinations might have incomplete permissions. Reconnect the destinations in settings and try again.", + "Enhanced broadcasting": "Enhanced broadcasting", + "Enhanced broadcasting automatically optimizes your settings to encode and send multiple video qualities to Twitch. Selecting this option will send basic information about your computer and software setup.": "Enhanced broadcasting automatically optimizes your settings to encode and send multiple video qualities to Twitch. Selecting this option will send basic information about your computer and software setup.", "Failed Checks": "Failed Checks", "Video Transmission": "Video Transmission", "Optimized Settings": "Optimized Settings", diff --git a/app/services/dismissables.ts b/app/services/dismissables.ts index b232d49e679c..6e8a0b5633e5 100644 --- a/app/services/dismissables.ts +++ b/app/services/dismissables.ts @@ -17,6 +17,7 @@ export enum EDismissable { LoginPrompt = 'login_prompt', TikTokRejected = 'tiktok_rejected', TikTokEligible = 'tiktok_eligible', + EnhancedBroadcasting = 'enhanced_broadcasting', } interface IDismissablesServiceState { diff --git a/app/services/platforms/twitch.ts b/app/services/platforms/twitch.ts index 16925e78ba7e..d269516816e0 100644 --- a/app/services/platforms/twitch.ts +++ b/app/services/platforms/twitch.ts @@ -10,6 +10,7 @@ import { HostsService } from 'services/hosts'; import { Inject } from 'services/core/injector'; import { authorizedHeaders, jfetch } from 'util/requests'; import { UserService } from 'services/user'; +import { SettingsService } from 'services/settings'; import { TTwitchOAuthScope, TwitchTagsService } from './twitch/index'; import { platformAuthorizedRequest } from './utils'; import { CustomizationService } from 'services/customization'; @@ -36,6 +37,7 @@ export interface ITwitchStartStreamOptions { mode?: TOutputOrientation; contentClassificationLabels: string[]; isBrandedContent: boolean; + isEnhancedBroadcasting: boolean; } export interface ITwitchChannelInfo extends ITwitchStartStreamOptions { @@ -81,6 +83,7 @@ export class TwitchService @Inject() twitchTagsService: TwitchTagsService; @Inject() twitchContentClassificationService: TwitchContentClassificationService; @Inject() notificationsService: NotificationsService; + @Inject() settingsService: SettingsService; static initialState: ITwitchServiceState = { ...BasePlatformService.initialState, @@ -94,6 +97,7 @@ export class TwitchService tags: [], contentClassificationLabels: [], isBrandedContent: false, + isEnhancedBroadcasting: false, }, }; @@ -302,11 +306,13 @@ export class TwitchService ? this.twitchTagsService.views.tags : []; this.SET_PREPOPULATED(true); + this.SET_STREAM_SETTINGS({ tags, title: channelInfo.title, game: channelInfo.game, isBrandedContent: channelInfo.is_branded_content, + isEnhancedBroadcasting: this.settingsService.isEnhancedBroadcasting(), contentClassificationLabels: channelInfo.content_classification_labels, }); } diff --git a/app/services/settings/settings.ts b/app/services/settings/settings.ts index 6958e4d6ac3e..ad99d4f78979 100644 --- a/app/services/settings/settings.ts +++ b/app/services/settings/settings.ts @@ -690,6 +690,14 @@ export class SettingsService extends StatefulService { } } + isEnhancedBroadcasting() { + return obs.NodeObs.OBS_settings_isEnhancedBroadcasting(); + } + + setEnhancedBroadcasting(enable: boolean) { + obs.NodeObs.OBS_settings_setEnhancedBroadcasting(enable); + } + @mutation() SET_SETTINGS(settingsData: ISettingsServiceState) { this.state = Object.assign({}, this.state, settingsData);