Skip to content

Commit

Permalink
first
Browse files Browse the repository at this point in the history
  • Loading branch information
@panaC
panaC committed Oct 15, 2024
1 parent a613bc6 commit e849d15
Show file tree
Hide file tree
Showing 7 changed files with 98 additions and 45 deletions.
3 changes: 3 additions & 0 deletions src/common/redux/states/rendererCommonRootState.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,4 +18,7 @@ export interface IRendererCommonRootState extends ICommonRootState {
dialog: DialogState;
toast: ToastState;
importAnnotations: IImportAnnotationState,
publication: {
tag: string[]
}
}
13 changes: 12 additions & 1 deletion src/main/redux/sagas/win/reader.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { readerIpc } from "readium-desktop/common/ipc";
import { ReaderMode } from "readium-desktop/common/models/reader";
import { normalizeRectangle } from "readium-desktop/common/rectangle/window";
import { takeSpawnEvery } from "readium-desktop/common/redux/sagas/takeSpawnEvery";
import { getLibraryWindowFromDi, getReaderWindowFromDi } from "readium-desktop/main/di";
import { diMainGet, getLibraryWindowFromDi, getReaderWindowFromDi } from "readium-desktop/main/di";
import { error } from "readium-desktop/main/tools/error";
import { streamerActions, winActions } from "readium-desktop/main/redux/actions";
import { RootState } from "readium-desktop/main/redux/states";
Expand Down Expand Up @@ -45,6 +45,14 @@ function* winOpen(action: winActions.reader.openSucess.TAction) {
const transientConfigMerge = {...readerConfigInitialState, ...config};
const creator = yield* selectTyped((_state: RootState) => _state.creator);

const publicationRepository = diMainGet("publication-repository");
let tag: string[] = [];
try {
tag = yield* callTyped(() => publicationRepository.getAllTags());
} catch {
// ignore
}

webContents.send(readerIpc.CHANNEL, {
type: readerIpc.EventType.request,
payload: {
Expand Down Expand Up @@ -76,6 +84,9 @@ function* winOpen(action: winActions.reader.openSucess.TAction) {
mode,
theme,
creator,
publication: {
tag,
},
},
} as readerIpc.EventPayload);
}
Expand Down
11 changes: 5 additions & 6 deletions src/renderer/assets/styles/publicationInfos.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@
background-color: var(--color-extralight-grey);
border: 1px solid var(--color-light-grey);
border-radius: 6px;

.no_img_wrapper {
height: 350px;
width: 100%;
Expand All @@ -103,7 +103,7 @@
display: flex;
align-items: center;
justify-content: center;

& .no_img {
border: 1px black solid;
width: 100%;
Expand All @@ -113,7 +113,7 @@
flex-direction: column;
justify-content: center;
align-items: center;

& p {
word-break: break-all;
display: -webkit-inline-box;
Expand All @@ -123,7 +123,7 @@
text-align: center;
margin: 10px 5%;
color: var(--color-primary);

&:not(:first-child) {
font-size: 90%;
}
Expand All @@ -145,7 +145,7 @@
}

button {
flex: 1 0 25%;
flex: 1 0 25%;
margin: 5px 0;
}
}
Expand Down Expand Up @@ -225,7 +225,6 @@

button {
width: fit-content;
min-width: 50px;

svg {
fill: white;
Expand Down
84 changes: 54 additions & 30 deletions src/renderer/common/components/dialog/publicationInfos/tag/AddTag.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,65 +6,86 @@
// ==LICENSE-END==

import * as stylesButtons from "readium-desktop/renderer/assets/styles/components/buttons.scss";
import * as stylesTags from "readium-desktop/renderer/assets/styles/components/tags.scss";
import * as stylesInputs from "readium-desktop/renderer/assets/styles/components/inputs.scss";

import * as debug_ from "debug";
import * as React from "react";
import { I18nFunction } from "readium-desktop/common/services/translator";
import { IOpdsTagView } from "readium-desktop/common/views/opds";
import { TChangeEventOnInput, TFormEvent } from "readium-desktop/typings/react";
import { TFormEvent } from "readium-desktop/typings/react";
import SVG from "../../../SVG";
import * as AddTagIcon from "readium-desktop/renderer/assets/icons/addTag-icon.svg";
import classNames from "classnames";
import * as TagIcon from "readium-desktop/renderer/assets/icons/tag-icon.svg";
import { ComboBox, ComboBoxItem } from "readium-desktop/renderer/common/components/ComboBox";
import { connect } from "react-redux";
import { IRendererCommonRootState } from "readium-desktop/common/redux/states/rendererCommonRootState";
import { TranslatorProps, withTranslator } from "../../../hoc/translator";


// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface IProps {
interface IProps extends ReturnType<typeof mapStateToProps>, TranslatorProps {
pubId: string;
__: I18nFunction;
tagArray: string[] | IOpdsTagView[];
setTags: (tagsArray: string[]) => void;
}

interface IState {
newTagName: string;
tagName: string;
}

// Logger
const debug = debug_("readium-desktop:renderer:common:publication-info:AddTag");
debug("_");

export default class AddTag extends React.Component<IProps, IState> {
class AddTag extends React.Component<IProps, IState> {

constructor(props: IProps) {
super(props);

this.state = {
newTagName: "",
tagName: "",
};
}

public render() {

const { __ } = this.props;
const tagsOptions = this.props.tags.filter((name) => !this.props.tagArray.includes(name as any)).map((v, i) => ({ id: i, value: i, name: v }));

return (
this.props.pubId
? <form onSubmit={this.addTag}>
<div className={stylesInputs.form_group}>
<label>{__("catalog.tag")}</label>
<SVG ariaHidden svg={TagIcon} />
<input
type="text"
className={classNames(stylesTags.tag_inputs, "R2_CSS_CLASS__FORCE_NO_FOCUS_OUTLINE")}
title={__("catalog.addTags")}
// placeholder={__("catalog.addTags")}
onChange={this.handleChangeName}
value={this.state.newTagName}
/>
</div>
<button
? <form onSubmit={this.addTag} style={{minWidth: "unset"}}>
<ComboBox
label={__("catalog.tag")}
defaultItems={tagsOptions}
defaultSelectedKey={
tagsOptions.findIndex((tag) =>
tag.name?.toLowerCase() === this.state.tagName.toLowerCase())
}
selectedKey={
tagsOptions.findIndex((tag) =>
tag.name?.toLowerCase() === this.state.tagName.toLowerCase())
}
onSelectionChange={(key) => {

if (key === null) {
// nothing
} else {

const found = tagsOptions.find((tag) => tag.id === key);
if (found) {
this.setState({ tagName: found.name });
}
}
}}
svg={TagIcon}
allowsCustomValue
onInputChange={(v) => this.setState({ tagName: v })}
inputValue={this.state.tagName}
defaultInputValue={this.state.tagName}
aria-labe={__("catalog.addTags")}
>
{item => <ComboBoxItem>{item.name}</ComboBoxItem>}
</ComboBox>
<button style={{marginTop: "9px"}}
type="submit"
className={stylesButtons.button_secondary_blue}
>
Expand All @@ -81,9 +102,9 @@ export default class AddTag extends React.Component<IProps, IState> {
const { tagArray } = this.props;

const tags = Array.isArray(tagArray) ? tagArray.slice() : [];
const tagName = this.state.newTagName.trim().replace(/\s\s+/g, " ");
const tagName = this.state.tagName.trim().replace(/\s\s+/g, " ").toLowerCase();

this.setState({ newTagName: "" });
this.setState({ tagName: "" });

if (tagName) {

Expand All @@ -108,9 +129,12 @@ export default class AddTag extends React.Component<IProps, IState> {
this.props.setTags(tagsName);
}
};
}

private handleChangeName = (e: TChangeEventOnInput) => {
this.setState({ newTagName: e.target.value });
};
const mapStateToProps = (state: IRendererCommonRootState) => ({
tags: state.publication.tag,
locale: state.i18n.locale, // refresh
});

}

export default connect(mapStateToProps)(withTranslator(AddTag));
1 change: 0 additions & 1 deletion src/renderer/library/components/dialog/publicationInfos/TagManager.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,6 @@ class TagManager extends React.Component<IProps> {
<AddTag
pubId={this.props.pubId}
tagArray={this.props.tagArray}
__={__}
setTags={setTagsCb}
/>
</section>
Expand Down
30 changes: 24 additions & 6 deletions src/renderer/library/components/searchResult/AllPublicationPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2152,16 +2152,34 @@ export const TableView: React.FC<ITableCellProps_TableView & ITableCellProps_Com

<div className={stylesPublication.filter_container}>
<ComboBox
label={__("header.fitlerTagTitle")}
defaultItems={tagsOptions}
defaultSelectedKey={tagsOptions.find((tag) => tag.name?.toLowerCase().includes(selectedTag?.toLowerCase()))?.id || undefined}
onSelectionChange={(i) => {
setSelectedTag(tagsOptions.find((tag) => tag.id === i)?.name);
tableInstance.setFilter("colTags", tagsOptions.find((tag) => tag.id === i)?.name);
// console.log(tableInstance.columns.find((element) => element.Header === "Tags"))
defaultSelectedKey={
tagsOptions.findIndex((tag) =>
tag.name?.toLowerCase() === selectedTag.toLowerCase())
}
selectedKey={
tagsOptions.findIndex((tag) =>
tag.name?.toLowerCase() === selectedTag.toLowerCase())
}
onSelectionChange={(key) => {

if (key === null) {
// nothing
} else {

const found = tagsOptions.find((tag) => tag.id === key);
if (found) {
setSelectedTag(found.name);
}
tableInstance.setFilter("colTags", found?.name || undefined);
}
}}
svg={TagIcon}
allowsCustomValue
onInputChange={(v) => setSelectedTag(v)}
inputValue={selectedTag}
defaultInputValue={selectedTag}
aria-label={__("header.fitlerTagTitle")}
>
{item => <ComboBoxItem
onHoverStart={(e: HoverEvent) => {
Expand Down
1 change: 0 additions & 1 deletion src/renderer/reader/components/dialog/publicationInfos/TagManager.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,6 @@ export class TagManager extends React.Component<IProps> {
<AddTag
pubId={this.props.pubId}
tagArray={this.props.tagArray}
__={__}
setTags={setTagsCb}
/>
</section>
Expand Down

0 comments on commit e849d15

Please sign in to comment.