Backup_Repos/stash
1
0
Fork 0
mirror of https://github.com/stashapp/stash.git synced 2025-12-09 18:04:33 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #141 from WithoutPants/scene_list_view

Browse source 
Add scene list view
This commit is contained in:
Leopere 2019-10-15 10:13:54 -04:00 committed by GitHub
commit 37ffa67e15
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 106 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
ui/v2/src/components/scenes/SceneList.tsx
View file

@ -8,6 +8,7 @@ import { ListFilterModel } from "../../models/list-filter/filter";
import { DisplayMode, FilterMode } from "../../models/list-filter/types";
import { WallPanel } from "../Wall/WallPanel";
import { SceneCard } from "./SceneCard";
import { SceneListTable } from "./SceneListTable";
interface ISceneListProps extends IBaseProps {}
@ -27,7 +28,7 @@ export const SceneList: FunctionComponent<ISceneListProps> = (props: ISceneListP
</div>
);
} else if (filter.displayMode === DisplayMode.List) {
return <h1>TODO</h1>;
return <SceneListTable scenes={result.data.findScenes.scenes}/>;
} else if (filter.displayMode === DisplayMode.Wall) {
return <WallPanel scenes={result.data.findScenes.scenes} />;
}

104
ui/v2/src/components/scenes/SceneListTable.tsx Normal file
View file

@ -0,0 +1,104 @@
import {
H4,
HTMLTable,
H5,
H6,
} from "@blueprintjs/core";
import React, { FunctionComponent } from "react";
import { Link } from "react-router-dom";
import * as GQL from "../../core/generated-graphql";
import { TextUtils } from "../../utils/text";
import { TagLink } from "../Shared/TagLink";
import { NavigationUtils } from "../../utils/navigation";
interface ISceneListTableProps {
scenes: GQL.SlimSceneDataFragment[];
}
export const SceneListTable: FunctionComponent<ISceneListTableProps> = (props: ISceneListTableProps) => {
function renderDuration(scene : GQL.SlimSceneDataFragment) {
if (scene.file.duration === undefined) { return; }
return TextUtils.secondsToTimestamp(scene.file.duration);
}
function renderTags(tags : GQL.SlimSceneDataTags[]) {
return tags.map((tag) => (
<Link to={NavigationUtils.makeTagScenesUrl(tag)}>
<H6>{tag.name}</H6>
</Link>
));
}
function renderPerformers(performers : GQL.SlimSceneDataPerformers[]) {
return performers.map((performer) => (
<Link to={NavigationUtils.makePerformerScenesUrl(performer)}>
<H6>{performer.name}</H6>
</Link>
));
}
function renderStudio(studio : GQL.SlimSceneDataStudio | undefined) {
if (!!studio) {
return (
<Link to={NavigationUtils.makeStudioScenesUrl(studio)}>
<H6>{studio.name}</H6>
</Link>
);
}
}
function renderSceneRow(scene : GQL.SlimSceneDataFragment) {
return (
<>
<tr>
<td>
<Link to={`/scenes/${scene.id}`}>
<H5 style={{textOverflow: "ellipsis", overflow: "hidden"}}>
{!!scene.title ? scene.title : TextUtils.fileNameFromPath(scene.path)}
</H5>
</Link>
</td>
<td>
{scene.rating ? scene.rating : ''}
</td>
<td>
{renderDuration(scene)}
</td>
<td>
{renderTags(scene.tags)}
</td>
<td>
{renderPerformers(scene.performers)}
</td>
<td>
{renderStudio(scene.studio)}
</td>
</tr>
</>
)
}
return (
<>
<div className="grid">
<HTMLTable>
<thead>
<tr>
<th>Title</th>
<th>Rating</th>
<th>Duration</th>
<th>Tags</th>
<th>Performers</th>
<th>Studio</th>
</tr>
</thead>
<tbody>
{props.scenes.map(renderSceneRow)}
</tbody>
</HTMLTable>
</div>
</>
);
};