瀏覽代碼

Abstract the DialogWithTabs title so it can be reused with other components

master
mmoanis 6 年之前
父節點
當前提交
b844a9f06b

+ 13
- 3
react/features/base/dialog/components/DialogWithTabs.web.js 查看文件

18
      */
18
      */
19
     closeDialog: Function,
19
     closeDialog: Function,
20
 
20
 
21
+    /**
22
+     * Css class name that will be added to the dialog.
23
+     */
24
+    cssClassName: string,
25
+
21
     /**
26
     /**
22
      * Which settings tab should be initially displayed. If not defined then
27
      * Which settings tab should be initially displayed. If not defined then
23
      * the first tab will be displayed.
28
      * the first tab will be displayed.
44
     /**
49
     /**
45
      * Information about the tabs that will be rendered.
50
      * Information about the tabs that will be rendered.
46
      */
51
      */
47
-    tabs: Array<Object>
52
+    tabs: Array<Object>,
53
+
54
+    /**
55
+     * Key to use for showing a title.
56
+     */
57
+    titleKey: string
48
 
58
 
49
 };
59
 };
50
 
60
 
102
                     = { this.props.disableBlanketClickDismiss }
112
                     = { this.props.disableBlanketClickDismiss }
103
                 onCancel = { onCancel }
113
                 onCancel = { onCancel }
104
                 onSubmit = { this._onSubmit }
114
                 onSubmit = { this._onSubmit }
105
-                titleKey = 'settings.title'>
106
-                <div className = 'settings-dialog'>
115
+                titleKey = { this.props.titleKey } >
116
+                <div className = { this.props.cssClassName } >
107
                     { this._renderTabs() }
117
                     { this._renderTabs() }
108
                 </div>
118
                 </div>
109
             </StatelessDialog>
119
             </StatelessDialog>

+ 3
- 1
react/features/settings/DeviceSelectionPopup.js 查看文件

262
                 <AtlasKitThemeProvider mode = 'dark'>
262
                 <AtlasKitThemeProvider mode = 'dark'>
263
                     <DialogWithTabs
263
                     <DialogWithTabs
264
                         closeDialog = { this.close }
264
                         closeDialog = { this.close }
265
+                        cssClassName = 'settings-dialog'
265
                         onSubmit = { onSubmit }
266
                         onSubmit = { onSubmit }
266
                         tabs = { [ {
267
                         tabs = { [ {
267
                             component: DeviceSelection,
268
                             component: DeviceSelection,
268
                             label: 'settings.devices',
269
                             label: 'settings.devices',
269
                             props: this._dialogProps,
270
                             props: this._dialogProps,
270
                             submit: this._onSubmit
271
                             submit: this._onSubmit
271
-                        } ] } />
272
+                        } ] }
273
+                        titleKey = 'settings.title' />
272
                 </AtlasKitThemeProvider>
274
                 </AtlasKitThemeProvider>
273
             </I18nextProvider>,
275
             </I18nextProvider>,
274
             document.getElementById('react'));
276
             document.getElementById('react'));

+ 3
- 1
react/features/settings/components/web/SettingsDialog.js 查看文件

91
         return (
91
         return (
92
             <DialogWithTabs
92
             <DialogWithTabs
93
                 closeDialog = { this._closeDialog }
93
                 closeDialog = { this._closeDialog }
94
+                cssClassName = 'settings-dialog'
94
                 defaultTab = {
95
                 defaultTab = {
95
                     defaultTabIdx === -1 ? undefined : defaultTabIdx
96
                     defaultTabIdx === -1 ? undefined : defaultTabIdx
96
                 }
97
                 }
97
                 onSubmit = { onSubmit }
98
                 onSubmit = { onSubmit }
98
-                tabs = { tabs } />
99
+                tabs = { tabs }
100
+                titleKey = 'settings.title' />
99
         );
101
         );
100
     }
102
     }
101
 
103
 

Loading…
取消
儲存