Skip to content

Commit dc27b6f

Browse files
gettinToastygettinToasty
authored
Refactor settings fix (#5643)
Also fixes spacing on some buttons
1 parent 02486b8 commit dc27b6f

File tree

4 files changed

+55
-48
lines changed

4 files changed

+55
-48
lines changed

‎app/components-react/windows/Settings.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,10 @@ export const SETTINGS_CONFIG: Record<ESettingsCategory, ISettingsConfig> = {
4646
},
4747
[ESettingsCategory.Advanced]: { icon: 'fas fa-cogs', component: pages.AdvancedSettings },
4848
[ESettingsCategory.Developer]: { icon: 'far fa-file-code', component: pages.DeveloperSettings },
49-
[ESettingsCategory.SceneCollections]: { icon: 'icon-themes', component: pages.OverlaySettings },
49+
[ESettingsCategory.SceneCollections]: {
50+
icon: 'icon-themes',
51+
component: pages.SceneCollectionsSettings,
52+
},
5053
[ESettingsCategory.Notifications]: {
5154
icon: 'icon-notifications',
5255
component: pages.NotificationSettings,
@@ -62,8 +65,6 @@ export const SETTINGS_CONFIG: Record<ESettingsCategory, ISettingsConfig> = {
6265
[ESettingsCategory.GetSupport]: { icon: 'icon-question', component: pages.Support },
6366
[ESettingsCategory.AI]: { icon: 'icon-ai', component: pages.AISettings },
6467
[ESettingsCategory.Ultra]: { icon: 'icon-ultra', component: pages.Ultra },
65-
// This isn't shown but is required for TS
66-
[ESettingsCategory.StreamSecond]: { icon: '', component: () => <></> },
6768
};
6869

6970
export default function Settings() {

‎app/components-react/windows/settings/Developer.tsx‎

Lines changed: 41 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -182,42 +182,46 @@ export function DualOutputDeveloperSettings(p: { collection?: string }) {
182182
</span>
183183
<div>
184184
<h4>{$t('Convert to Vanilla Scene')}</h4>
185-
<Button
186-
className="button--soft-warning"
187-
style={{ marginRight: '16px' }}
188-
onClick={() => convertDualOutputCollection()}
189-
disabled={busy}
190-
>
191-
{$t('Convert')}
192-
</Button>
193-
{!p.collection && (
185+
<div style={{ display: 'flex', justifyContent: 'space-evenly', paddingBottom: '16px' }}>
194186
<Button
195187
className="button--soft-warning"
196-
onClick={() => convertDualOutputCollection(false, true)}
188+
style={{ marginRight: '16px' }}
189+
onClick={() => convertDualOutputCollection()}
197190
disabled={busy}
198191
>
199-
{$t('Convert and Export Overlay')}
192+
{$t('Convert')}
200193
</Button>
201-
)}
194+
{!p.collection && (
195+
<Button
196+
className="button--soft-warning"
197+
onClick={() => convertDualOutputCollection(false, true)}
198+
disabled={busy}
199+
>
200+
{$t('Convert and Export Overlay')}
201+
</Button>
202+
)}
203+
</div>
202204
</div>
203205
{!p.collection && (
204206
<div style={{ marginTop: '10px' }}>
205207
<h4>{$t('Assign Vertical Sources to Horizontal Display')}</h4>
206-
<Button
207-
className="button--soft-warning"
208-
style={{ marginRight: '16px' }}
209-
onClick={() => convertDualOutputCollection(true)}
210-
disabled={busy}
211-
>
212-
{$t('Assign')}
213-
</Button>
214-
<Button
215-
className="button--soft-warning"
216-
onClick={() => convertDualOutputCollection(true, true)}
217-
disabled={busy}
218-
>
219-
{$t('Assign and Export Overlay')}
220-
</Button>
208+
<div style={{ display: 'flex', justifyContent: 'space-evenly', paddingBottom: '16px' }}>
209+
<Button
210+
className="button--soft-warning"
211+
style={{ marginRight: '16px' }}
212+
onClick={() => convertDualOutputCollection(true)}
213+
disabled={busy}
214+
>
215+
{$t('Assign')}
216+
</Button>
217+
<Button
218+
className="button--soft-warning"
219+
onClick={() => convertDualOutputCollection(true, true)}
220+
disabled={busy}
221+
>
222+
{$t('Assign and Export Overlay')}
223+
</Button>
224+
</div>
221225
</div>
222226
)}
223227
<div style={{ color: error ? 'red' : 'var(--teal)' }}>{message}</div>
@@ -322,14 +326,16 @@ function AppPlatformDeveloperSettings() {
322326
<p style={{ wordWrap: 'break-word' }}>{loadedUnpackedApp.appPath}</p>
323327
<h4>{$t('Token')}</h4>
324328
<p style={{ wordWrap: 'break-word' }}>{loadedUnpackedApp.appToken}</p>
325-
<Button onClick={reloadApp} type="primary" disabled={loading}>
326-
{$t('Reload')}
327-
{loading && <i className="fa fa-spinner fa-pulse" />}
328-
</Button>
329-
<Button onClick={unloadApp} type="primary" disabled={loading}>
330-
{$t('Unload')}
331-
{loading && <i className="fa fa-spinner fa-pulse" />}
332-
</Button>
329+
<div style={{ display: 'flex', justifyContent: 'space-evenly', paddingBottom: '16px' }}>
330+
<Button onClick={reloadApp} type="primary" disabled={loading}>
331+
{$t('Reload')}
332+
{loading && <i className="fa fa-spinner fa-pulse" />}
333+
</Button>
334+
<Button onClick={unloadApp} type="primary" disabled={loading}>
335+
{$t('Unload')}
336+
{loading && <i className="fa fa-spinner fa-pulse" />}
337+
</Button>
338+
</div>
333339
</>
334340
)}
335341
{!loadedUnpackedApp && (

‎app/components-react/windows/settings/SceneCollections.tsx‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { DualOutputDeveloperSettings } from './Developer';
1010
import { ObsSettingsSection } from './ObsSettings';
1111
import { CheckboxInput, SwitchInput, ListInput } from 'components-react/shared/inputs';
1212

13-
export function OverlaySettings() {
13+
export function SceneCollectionsSettings() {
1414
const {
1515
SceneCollectionsService,
1616
OverlaysPersistenceService,
@@ -116,24 +116,26 @@ export function OverlaySettings() {
116116
return (
117117
<>
118118
<ObsSettingsSection>
119-
<Button onClick={createSceneCollection}>{$t('Create Scene Collection')}</Button>
120-
<Button onClick={loadWidget}>{$t('Import Widget File in Current Scene')}</Button>
121-
<br />
119+
<div style={{ display: 'flex', justifyContent: 'space-evenly', paddingBottom: '16px' }}>
120+
<Button onClick={createSceneCollection}>{$t('Create Scene Collection')}</Button>
121+
<Button onClick={loadWidget}>{$t('Import Widget File in Current Scene')}</Button>
122+
</div>
122123
</ObsSettingsSection>
123124
<ObsSettingsSection>
124125
<p>
125126
{$t(
126127
'This feature is intended for overlay designers to export their work for our Overlay Library. Not all sources will be exported, use at your own risk.',
127128
)}
128129
</p>
129-
<Button onClick={saveOverlay}>{$t('Export Overlay File')}</Button>
130-
<Button onClick={loadOverlay}>{$t('Import Overlay File')}</Button>
130+
<div style={{ display: 'flex', justifyContent: 'space-evenly', paddingBottom: '16px' }}>
131+
<Button onClick={saveOverlay}>{$t('Export Overlay File')}</Button>
132+
<Button onClick={loadOverlay}>{$t('Import Overlay File')}</Button>
133+
</div>
131134
<SwitchInput
132135
label={$t('Enable Designer Mode')}
133136
value={designerMode}
134137
onChange={setDesignerMode}
135138
/>
136-
<br />
137139
{message}
138140
</ObsSettingsSection>
139141
<ObsSettingsSection>

‎app/services/settings/settings.ts‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,6 @@ export enum ESettingsCategory {
4848
GetSupport = 'Get Support',
4949
InstalledApps = 'Installed Apps',
5050
Stream = 'Stream',
51-
StreamSecond = 'StreamSecond',
5251
General = 'General',
5352
Mobile = 'Mobile',
5453
Hotkeys = 'Hotkeys',
@@ -325,7 +324,7 @@ export class SettingsService extends StatefulService<ISettingsServiceState> {
325324
}
326325
}
327326

328-
private fetchSettingsFromObs(categoryName: TCategoryName): ISettingsCategory {
327+
private fetchSettingsFromObs(categoryName: TCategoryName | 'StreamSecond'): ISettingsCategory {
329328
const settingsMetadata = obs.NodeObs.OBS_settings_getSettings(categoryName);
330329
let settings = settingsMetadata.data;
331330
if (!settings) settings = [];
@@ -444,7 +443,6 @@ export class SettingsService extends StatefulService<ISettingsServiceState> {
444443
settingsFormData[categoryName] = this.fetchSettingsFromObs(categoryName);
445444
});
446445
// These settings are not displayed in the menu but are still needed for dual output
447-
settingsFormData.Stream = this.fetchSettingsFromObs('Stream');
448446
settingsFormData.StreamSecond = this.fetchSettingsFromObs('StreamSecond');
449447

450448
this.SET_SETTINGS(settingsFormData);

0 commit comments

Comments
 (0)