Skip to content

Commit fa1a4c6

Browse files
raduwenraduwen
authored
feat: set page title (#113)
1 parent bf77923 commit fa1a4c6

File tree

4 files changed

+186
-156
lines changed

4 files changed

+186
-156
lines changed

‎src/pages/admin/[id]/index.tsx

Lines changed: 94 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { useEffect, useState, MouseEvent } from 'react';
2-
import { useRouter} from 'next/router';
2+
import Head from 'next/head';
3+
import { useRouter } from 'next/router';
34
import styled from 'styled-components';
45
import {
56
CssBaseline,
@@ -247,97 +248,105 @@ const AdminIndexPage = () => {
247248
setProfileAnchorEl(null);
248249
};
249250

250-
return currentUser !== null ? (
251-
<AuthProvider>
252-
<CssBaseline />
253-
<div className={classes.root}>
254-
<AppBar position="static">
255-
<Toolbar>
256-
<Typography variant="h6" className={classes.title}>
257-
Admin
258-
</Typography>
259-
<Typography variant="h6" className={classes.title}>
260-
Profile:{' '}
261-
{currentProfile}
262-
</Typography>
263-
<Box sx={{ flexGrow: 1 }} />
264-
<Box sx={{ display: { xs: 'none', md: 'flex' } }}>
265-
<IconButton
266-
size="large"
267-
color="inherit"
268-
edge="end"
269-
aria-controls={profileMenuId}
270-
aria-haspopup="true"
271-
aria-expanded={isProfileMenuOpen ? 'true' : undefined}
272-
onClick={handleProfileMenuOpen}
273-
>
274-
<WidgetsIcon />
275-
</IconButton>
276-
<IconButton
277-
size="large"
278-
color="inherit"
279-
onClick={()=>{setAddWidgetDialogOpened(true);}}
280-
>
281-
<AddIcon />
282-
</IconButton>
283-
<IconButton
284-
size="large"
285-
color="inherit"
286-
edge="end"
287-
aria-controls={userMenuId}
288-
aria-haspopup="true"
289-
aria-expanded={isUserMenuOpen ? 'true' : undefined}
290-
onClick={handleUserMenuOpen}
291-
>
292-
<AccountCircleIcon />
293-
</IconButton>
294-
</Box>
295-
</Toolbar>
296-
</AppBar>
297-
<Menu
298-
id={profileMenuId}
299-
anchorEl={profileAnchorEl}
300-
open={isProfileMenuOpen}
301-
onClose={handleProfileMenuClose}
251+
return (
252+
<>
253+
<Head>
254+
<title>{currentProfile} : Admin - Raduwen OBS Widgets</title>
255+
</Head>
256+
{
257+
currentUser !== null ? (
258+
<AuthProvider>
259+
<CssBaseline />
260+
<div className={classes.root}>
261+
<AppBar position="static">
262+
<Toolbar>
263+
<Typography variant="h6" className={classes.title}>
264+
Admin
265+
</Typography>
266+
<Typography variant="h6" className={classes.title}>
267+
Profile:{' '}
268+
{currentProfile}
269+
</Typography>
270+
<Box sx={{ flexGrow: 1 }} />
271+
<Box sx={{ display: { xs: 'none', md: 'flex' } }}>
272+
<IconButton
273+
size="large"
274+
color="inherit"
275+
edge="end"
276+
aria-controls={profileMenuId}
277+
aria-haspopup="true"
278+
aria-expanded={isProfileMenuOpen ? 'true' : undefined}
279+
onClick={handleProfileMenuOpen}
302280
>
303-
{profiles.map((profile) => (
304-
<MenuItem key={profile} color="inherit" onClick={() => { router.push(`/admin/${profile}`); }}>{profile}</MenuItem>
305-
))}
306-
<Divider />
307-
<MenuItem color="inherit" onClick={() => { setAddProfileDialogOpened(true);}}>Add</MenuItem>
308-
</Menu>
309-
<Menu
310-
id={userMenuId}
311-
anchorEl={userAnchorEl}
312-
open={isUserMenuOpen}
313-
onClose={handleUserMenuClose}
281+
<WidgetsIcon />
282+
</IconButton>
283+
<IconButton
284+
size="large"
285+
color="inherit"
286+
onClick={()=>{setAddWidgetDialogOpened(true);}}
314287
>
315-
<MenuItem color="inherit" onClick={signout}>Logout</MenuItem>
316-
</Menu>
317-
<AddProfileDialog
318-
open={addProfileDialogOpened}
319-
onClose={() => {
320-
setAddProfileDialogOpened(false);
321-
}}
322-
/>
323-
<AddWidgetDialog
324-
profile={currentProfile}
325-
open={addWidgetDialogOpened}
326-
onClose={() => {
327-
setAddWidgetDialogOpened(false);
328-
}}
329-
/>
288+
<AddIcon />
289+
</IconButton>
290+
<IconButton
291+
size="large"
292+
color="inherit"
293+
edge="end"
294+
aria-controls={userMenuId}
295+
aria-haspopup="true"
296+
aria-expanded={isUserMenuOpen ? 'true' : undefined}
297+
onClick={handleUserMenuOpen}
298+
>
299+
<AccountCircleIcon />
300+
</IconButton>
301+
</Box>
302+
</Toolbar>
303+
</AppBar>
304+
<Menu
305+
id={profileMenuId}
306+
anchorEl={profileAnchorEl}
307+
open={isProfileMenuOpen}
308+
onClose={handleProfileMenuClose}
309+
>
310+
{profiles.map((profile) => (
311+
<MenuItem key={profile} color="inherit" onClick={() => { router.push(`/admin/${profile}`); }}>{profile}</MenuItem>
312+
))}
313+
<Divider />
314+
<MenuItem color="inherit" onClick={() => { setAddProfileDialogOpened(true);}}>Add</MenuItem>
315+
</Menu>
316+
<Menu
317+
id={userMenuId}
318+
anchorEl={userAnchorEl}
319+
open={isUserMenuOpen}
320+
onClose={handleUserMenuClose}
321+
>
322+
<MenuItem color="inherit" onClick={signout}>Logout</MenuItem>
323+
</Menu>
324+
<AddProfileDialog
325+
open={addProfileDialogOpened}
326+
onClose={() => {
327+
setAddProfileDialogOpened(false);
328+
}}
329+
/>
330+
<AddWidgetDialog
331+
profile={currentProfile}
332+
open={addWidgetDialogOpened}
333+
onClose={() => {
334+
setAddWidgetDialogOpened(false);
335+
}}
336+
/>
330337

331-
<Container className={classes.content}>
332-
<Box my={4}>
333-
<Widgets profile={currentProfile} />
334-
</Box>
335-
</Container>
338+
<Container className={classes.content}>
339+
<Box my={4}>
340+
<Widgets profile={currentProfile} />
341+
</Box>
342+
</Container>
336343
</div>
337344
</AuthProvider>
338345
) : (
339346
<Signin />
340-
);
347+
)}
348+
</>)
349+
;
341350
};
342351

343352
export default AdminIndexPage;

‎src/pages/admin/index.tsx

Lines changed: 76 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { useEffect, useState, MouseEvent } from 'react';
2+
import Head from 'next/head';
23
import { useRouter } from 'next/router';
34
import styled from 'styled-components';
45
import {
@@ -139,72 +140,81 @@ const AdminIndexPage = () => {
139140
setProfileAnchorEl(null);
140141
};
141142

142-
return currentUser !== null ? (
143-
<AuthProvider>
144-
<CssBaseline />
145-
<div className={classes.root}>
146-
<AppBar position="static">
147-
<Toolbar>
148-
<Typography variant="h6" className={classes.title}>
149-
Admin
150-
</Typography>
151-
<Box sx={{ flexGrow: 1 }} />
152-
<Box sx={{ display: { xs: 'none', md: 'flex' } }}>
153-
<IconButton
154-
size="large"
155-
color="inherit"
156-
edge="end"
157-
aria-controls={profileMenuId}
158-
aria-haspopup="true"
159-
aria-expanded={isProfileMenuOpen ? 'true' : undefined}
160-
onClick={handleProfileMenuOpen}
161-
>
162-
<WidgetsIcon />
163-
</IconButton>
164-
<IconButton
165-
size="large"
166-
color="inherit"
167-
edge="end"
168-
aria-controls={userMenuId}
169-
aria-haspopup="true"
170-
aria-expanded={isUserMenuOpen ? 'true' : undefined}
171-
onClick={handleUserMenuOpen}
172-
>
173-
<AccountCircleIcon />
174-
</IconButton>
175-
</Box>
176-
</Toolbar>
177-
</AppBar>
178-
<Menu
179-
id={profileMenuId}
180-
anchorEl={profileAnchorEl}
181-
open={isProfileMenuOpen}
182-
onClose={handleProfileMenuClose}
183-
>
184-
{profiles.map((profile) => (
185-
<MenuItem key={profile} color="inherit" onClick={() => { router.push(`/admin/${profile}`); }}>{profile}</MenuItem>
186-
))}
187-
<Divider />
188-
<MenuItem color="inherit" onClick={() => { setAddProfileDialogOpened(true);}}>Add</MenuItem>
189-
</Menu>
190-
<Menu
191-
id={userMenuId}
192-
anchorEl={userAnchorEl}
193-
open={isUserMenuOpen}
194-
onClose={handleUserMenuClose}
195-
>
196-
<MenuItem color="inherit" onClick={signout}>Logout</MenuItem>
197-
</Menu>
198-
<AddProfileDialog
199-
open={addProfileDialogOpened}
200-
onClose={() => {
201-
setAddProfileDialogOpened(false);
202-
}}
203-
/>
204-
</div>
205-
</AuthProvider>
206-
) : (
207-
<Signin />
143+
return (
144+
<>
145+
<Head>
146+
<title>Admin - Raduwen OBS Widgets</title>
147+
</Head>
148+
{
149+
currentUser !== null ? (
150+
<AuthProvider>
151+
<CssBaseline />
152+
<div className={classes.root}>
153+
<AppBar position="static">
154+
<Toolbar>
155+
<Typography variant="h6" className={classes.title}>
156+
Admin
157+
</Typography>
158+
<Box sx={{ flexGrow: 1 }} />
159+
<Box sx={{ display: { xs: 'none', md: 'flex' } }}>
160+
<IconButton
161+
size="large"
162+
color="inherit"
163+
edge="end"
164+
aria-controls={profileMenuId}
165+
aria-haspopup="true"
166+
aria-expanded={isProfileMenuOpen ? 'true' : undefined}
167+
onClick={handleProfileMenuOpen}
168+
>
169+
<WidgetsIcon />
170+
</IconButton>
171+
<IconButton
172+
size="large"
173+
color="inherit"
174+
edge="end"
175+
aria-controls={userMenuId}
176+
aria-haspopup="true"
177+
aria-expanded={isUserMenuOpen ? 'true' : undefined}
178+
onClick={handleUserMenuOpen}
179+
>
180+
<AccountCircleIcon />
181+
</IconButton>
182+
</Box>
183+
</Toolbar>
184+
</AppBar>
185+
<Menu
186+
id={profileMenuId}
187+
anchorEl={profileAnchorEl}
188+
open={isProfileMenuOpen}
189+
onClose={handleProfileMenuClose}
190+
>
191+
{profiles.map((profile) => (
192+
<MenuItem key={profile} color="inherit" onClick={() => { router.push(`/admin/${profile}`); }}>{profile}</MenuItem>
193+
))}
194+
<Divider />
195+
<MenuItem color="inherit" onClick={() => { setAddProfileDialogOpened(true);}}>Add</MenuItem>
196+
</Menu>
197+
<Menu
198+
id={userMenuId}
199+
anchorEl={userAnchorEl}
200+
open={isUserMenuOpen}
201+
onClose={handleUserMenuClose}
202+
>
203+
<MenuItem color="inherit" onClick={signout}>Logout</MenuItem>
204+
</Menu>
205+
<AddProfileDialog
206+
open={addProfileDialogOpened}
207+
onClose={() => {
208+
setAddProfileDialogOpened(false);
209+
}}
210+
/>
211+
</div>
212+
</AuthProvider>
213+
) : (
214+
<Signin />
215+
)
216+
}
217+
</>
208218
);
209219
};
210220

‎src/pages/index.tsx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
1+
import Head from 'next/head';
2+
13
const IndexPage = () => {
24
return (
3-
<div>NO Content</div>
5+
<>
6+
<Head>
7+
<title>Raduwen OBS Widgets</title>
8+
</Head>
9+
<div>NO Content</div>
10+
</>
411
);
512
};
613

‎src/pages/preview/[id]/index.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { useEffect, useState } from 'react';
2+
import Head from 'next/head';
23
import { useRouter } from 'next/router';
34
import { ref, onValue, DataSnapshot } from '@firebase/database';
45

@@ -35,15 +36,18 @@ const PreviewPage = () => {
3536
}, [profile]);
3637

3738
return (
38-
<div>
39-
{
39+
<>
40+
<Head>
41+
<title>{profile} - Raduwen OBS Widgets</title>
42+
</Head>
43+
<div>{
4044
Object.keys(widgets).map((id) => {
4145
const widget: any = widgets[id];
4246
const Widget = Widgets[widget.name];
4347
return <Widget key={id} {...widget.props} />
4448
})
45-
}
46-
</div>
49+
}</div>
50+
</>
4751
);
4852
};
4953

0 commit comments

Comments
 (0)