mirror
/
photoview
mirror of https://github.com/photoview/photoview.git
1
Fork 0
Code

Make faces clickable

This commit is contained in:
viktorstrate 2021-02-16 16:06:28 +01:00
parent c3eda0feab
commit c0d289eb41
No known key found for this signature in database
GPG Key ID: 3F855605109C1E8A
6 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/src/Layout.js
View File

@ -117,9 +117,9 @@ export const SideMenu = () => {
<SideButtonLabel>Places</SideButtonLabel> <SideButtonLabel>Places</SideButtonLabel>
</SideButton> </SideButton>
) : null} ) : null}
<SideButton to="/faces" exact> <SideButton to="/people" exact>
<Icon name="user outline" /> <Icon name="user outline" />
<SideButtonLabel>Faces</SideButtonLabel> <SideButtonLabel>People</SideButtonLabel>
</SideButton> </SideButton>
{isAdmin ? ( {isAdmin ? (
<SideButton to="/settings" exact> <SideButton to="/settings" exact>

12
ui/src/Pages/FacesPage/FacesPage.js → ui/src/Pages/PeoplePage/PeoplePage.js
View File

@ -49,7 +49,7 @@ const FaceImage = styled(ProtectedImage)`
` `
const FaceGroup = ({ group }) => ( const FaceGroup = ({ group }) => (
<Link to={`/faces/${group.id}`}> <Link to={`/people/${group.id}`}>
<CircleImageWrapper> <CircleImageWrapper>
<FaceImage src={group.imageFaces[0].media.thumbnail.url} /> <FaceImage src={group.imageFaces[0].media.thumbnail.url} />
</CircleImageWrapper> </CircleImageWrapper>
@ -65,14 +65,14 @@ const FaceGroupsWrapper = styled.div`
flex-wrap: wrap; flex-wrap: wrap;
` `
const FacesPage = ({ match }) => { const PeoplePage = ({ match }) => {
const { data, error } = useQuery(MY_FACES_QUERY) const { data, error } = useQuery(MY_FACES_QUERY)
if (error) { if (error) {
return error.message return error.message
} }
const faceGroup = match.params.face const faceGroup = match.params.person
if (faceGroup) { if (faceGroup) {
return ( return (
<Layout> <Layout>
@ -91,14 +91,14 @@ const FacesPage = ({ match }) => {
} }
return ( return (
<Layout> <Layout title={'People'}>
<FaceGroupsWrapper>{faces}</FaceGroupsWrapper> <FaceGroupsWrapper>{faces}</FaceGroupsWrapper>
</Layout> </Layout>
) )
} }
FacesPage.propTypes = { PeoplePage.propTypes = {
match: PropTypes.object.isRequired, match: PropTypes.object.isRequired,
} }
export default FacesPage export default PeoplePage

0
ui/src/Pages/FacesPage/SingleFaceGroup.js → ui/src/Pages/PeoplePage/SingleFaceGroup.js
View File

2
ui/src/Pages/PlacesPage/PlacesPage.js
View File

@ -112,7 +112,7 @@ const MapPage = () => {
} }
return ( return (
<Layout> <Layout title="Places">
<MapWrapper> <MapWrapper>
<MapContainer ref={mapContainer}></MapContainer> <MapContainer ref={mapContainer}></MapContainer>
</MapWrapper> </MapWrapper>

2
ui/src/Pages/SettingsPage/SettingsPage.js
View File

@ -25,7 +25,7 @@ export const InputLabelDescription = styled.p`
const SettingsPage = () => { const SettingsPage = () => {
return ( return (
<Layout> <Layout title="Settings">
<ScannerSection /> <ScannerSection />
<UsersTable /> <UsersTable />
</Layout> </Layout>

4
ui/src/components/routes/Routes.js
View File

@ -14,7 +14,7 @@ const AlbumPage = React.lazy(() => import('../../Pages/AlbumPage/AlbumPage'))
const PhotosPage = React.lazy(() => import('../../Pages/PhotosPage/PhotosPage')) const PhotosPage = React.lazy(() => import('../../Pages/PhotosPage/PhotosPage'))
const PlacesPage = React.lazy(() => import('../../Pages/PlacesPage/PlacesPage')) const PlacesPage = React.lazy(() => import('../../Pages/PlacesPage/PlacesPage'))
const SharePage = React.lazy(() => import('../../Pages/SharePage/SharePage')) const SharePage = React.lazy(() => import('../../Pages/SharePage/SharePage'))
const FacesPage = React.lazy(() => import('../../Pages/FacesPage/FacesPage')) const PeoplePage = React.lazy(() => import('../../Pages/PeoplePage/PeoplePage'))
const LoginPage = React.lazy(() => import('../../Pages/LoginPage/LoginPage')) const LoginPage = React.lazy(() => import('../../Pages/LoginPage/LoginPage'))
const InitialSetupPage = React.lazy(() => const InitialSetupPage = React.lazy(() =>
@ -48,7 +48,7 @@ const Routes = () => {
<AuthorizedRoute path="/album/:id" component={AlbumPage} /> <AuthorizedRoute path="/album/:id" component={AlbumPage} />
<AuthorizedRoute path="/photos" component={PhotosPage} /> <AuthorizedRoute path="/photos" component={PhotosPage} />
<AuthorizedRoute path="/places" component={PlacesPage} /> <AuthorizedRoute path="/places" component={PlacesPage} />
<AuthorizedRoute path="/faces/:face?" component={FacesPage} /> <AuthorizedRoute path="/people/:person?" component={PeoplePage} />
<AuthorizedRoute admin path="/settings" component={SettingsPage} /> <AuthorizedRoute admin path="/settings" component={SettingsPage} />
<Route path="/" exact render={() => <Redirect to="/photos" />} /> <Route path="/" exact render={() => <Redirect to="/photos" />} />
<Route render={() => <div>Page not found</div>} /> <Route render={() => <div>Page not found</div>} />