From cb82268d70215adae8465019b1ca58ec22768b99 Mon Sep 17 00:00:00 2001 From: tidusjar Date: Tue, 9 Aug 2022 10:43:07 +0100 Subject: [PATCH] stories --- .../ClientApp/.storybook/preview-body.html | 1 + src/Ombi/ClientApp/.storybook/preview.js | 2 +- .../detailed-card.component.stories.ts | 148 +++++++++++++++++- 3 files changed, 148 insertions(+), 3 deletions(-) diff --git a/src/Ombi/ClientApp/.storybook/preview-body.html b/src/Ombi/ClientApp/.storybook/preview-body.html index b043609bf..15a751241 100644 --- a/src/Ombi/ClientApp/.storybook/preview-body.html +++ b/src/Ombi/ClientApp/.storybook/preview-body.html @@ -5,5 +5,6 @@ body { background: #0f171f; + color: white; } \ No newline at end of file diff --git a/src/Ombi/ClientApp/.storybook/preview.js b/src/Ombi/ClientApp/.storybook/preview.js index ff244b84e..c132642cc 100644 --- a/src/Ombi/ClientApp/.storybook/preview.js +++ b/src/Ombi/ClientApp/.storybook/preview.js @@ -1,6 +1,6 @@ import { setCompodocJson } from "@storybook/addon-docs/angular"; import docJson from "../documentation.json"; -// import '../src/styles/Styles.scss'; + import '../src/styles/_imports.scss'; setCompodocJson(docJson); diff --git a/src/Ombi/ClientApp/src/app/components/detailed-card/detailed-card.component.stories.ts b/src/Ombi/ClientApp/src/app/components/detailed-card/detailed-card.component.stories.ts index b71756723..6b38fa2fb 100644 --- a/src/Ombi/ClientApp/src/app/components/detailed-card/detailed-card.component.stories.ts +++ b/src/Ombi/ClientApp/src/app/components/detailed-card/detailed-card.component.stories.ts @@ -1,9 +1,23 @@ // also exported from '@storybook/angular' if you can deal with breaking changes in 6.1 -import { APP_BASE_HREF } from '@angular/common'; +import { APP_BASE_HREF, CommonModule } from '@angular/common'; import { Story, Meta, moduleMetadata } from '@storybook/angular'; import { IRecentlyRequested, RequestType } from '../../interfaces'; import { DetailedCardComponent } from './detailed-card.component'; import { TranslateModule } from "@ngx-translate/core"; +import { ImageService } from "../../services/image.service"; +import { Observable, of } from 'rxjs'; +import { SharedModule } from '../../shared/shared.module'; +import { PipeModule } from '../../pipes/pipe.module'; +import { ImageComponent } from '../image/image.component'; + +function imageServiceMock(): Partial { + return { + getMoviePoster: () : Observable => of("https://assets.fanart.tv/fanart/movies/603/movieposter/the-matrix-52256ae1021be.jpg"), + getMovieBackground : () : Observable => of("https://assets.fanart.tv/fanart/movies/603/movieposter/the-matrix-52256ae1021be.jpg"), + getTmdbTvPoster : () : Observable => of("/bfxwMdQyJc0CL24m5VjtWAN30mt.jpg"), + getTmdbTvBackground : () : Observable => of("/bfxwMdQyJc0CL24m5VjtWAN30mt.jpg"), + }; +} // More on default export: https://storybook.js.org/docs/angular/writing-stories/introduction#default-export export default { @@ -16,9 +30,17 @@ export default { provide: APP_BASE_HREF, useValue: {} }, + { + provide: ImageService, + useValue: imageServiceMock() + } ], imports: [ TranslateModule.forRoot(), + CommonModule, + ImageComponent, + SharedModule, + PipeModule ] }) ] @@ -44,6 +66,128 @@ NewMovieRequest.args = { mediaId: '603', overview: 'The Matrix is a movie about a group of people who are forced to fight against a powerful computer system that controls them.', releaseDate: new Date(2020, 1, 1), - posterPath: "https://assets.fanart.tv/fanart/movies/603/movieposter/the-matrix-52256ae1021be.jpg" + } as IRecentlyRequested, +}; + +export const MovieNoUsername = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +MovieNoUsername.args = { + request: { + title: 'The Matrix', + approved: false, + available: false, + tvPartiallyAvailable: false, + requestDate: new Date(2022, 1, 1), + userId: '12345', + type: RequestType.movie, + mediaId: '603', + overview: 'The Matrix is a movie about a group of people who are forced to fight against a powerful computer system that controls them.', + releaseDate: new Date(2020, 1, 1), + } as IRecentlyRequested, +}; + +export const AvailableMovie = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +AvailableMovie.args = { + request: { + title: 'The Matrix', + approved: false, + available: true, + tvPartiallyAvailable: false, + requestDate: new Date(2022, 1, 1), + username: 'John Doe', + userId: '12345', + type: RequestType.movie, + mediaId: '603', + overview: 'The Matrix is a movie about a group of people who are forced to fight against a powerful computer system that controls them.', + releaseDate: new Date(2020, 1, 1), + } as IRecentlyRequested, +}; + +export const ApprovedMovie = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +ApprovedMovie.args = { + request: { + title: 'The Matrix', + approved: true, + available: false, + tvPartiallyAvailable: false, + requestDate: new Date(2022, 1, 1), + username: 'John Doe', + userId: '12345', + type: RequestType.movie, + mediaId: '603', + overview: 'The Matrix is a movie about a group of people who are forced to fight against a powerful computer system that controls them.', + releaseDate: new Date(2020, 1, 1), + } as IRecentlyRequested, +}; + +export const NewTvRequest = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +NewTvRequest.args = { + request: { + title: 'For All Mankind', + approved: false, + available: false, + tvPartiallyAvailable: false, + requestDate: new Date(2022, 1, 1), + username: 'John Doe', + userId: '12345', + type: RequestType.tvShow, + mediaId: '603', + releaseDate: new Date(2020, 1, 1), + } as IRecentlyRequested, +}; + + +export const ApprovedTv = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +ApprovedTv.args = { + request: { + title: 'For All Mankind', + approved: true, + available: false, + tvPartiallyAvailable: false, + requestDate: new Date(2022, 1, 1), + username: 'John Doe', + userId: '12345', + type: RequestType.tvShow, + mediaId: '603', + releaseDate: new Date(2020, 1, 1), + } as IRecentlyRequested, +}; + +export const AvailableTv = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +AvailableTv.args = { + request: { + title: 'For All Mankind', + approved: true, + available: true, + tvPartiallyAvailable: false, + requestDate: new Date(2022, 1, 1), + username: 'John Doe', + userId: '12345', + type: RequestType.tvShow, + mediaId: '603', + releaseDate: new Date(2020, 1, 1), + } as IRecentlyRequested, +}; + + +export const PartiallyAvailableTv = Template.bind({}); +// More on args: https://storybook.js.org/docs/angular/writing-stories/args +PartiallyAvailableTv.args = { + request: { + title: 'For All Mankind', + approved: true, + available: false, + tvPartiallyAvailable: true, + requestDate: new Date(2022, 1, 1), + username: 'John Doe', + userId: '12345', + type: RequestType.tvShow, + mediaId: '603', + releaseDate: new Date(2020, 1, 1), } as IRecentlyRequested, }; \ No newline at end of file