Merge pull request 'Fixed article entity bug' (#144) from fix/resolve-merge-issues into develop

Reviewed-on: http://85.143.176.51:3000/free-land/front-end/pulls/144
This commit is contained in:
Daniel Weissmall 2022-10-12 16:52:58 +00:00
commit c99e9217f1
14 changed files with 91 additions and 95 deletions

View File

@ -17,7 +17,7 @@ async function getArticle(id: string): Promise<Article> {
const dto = response.data; const dto = response.data;
return create({ return create({
id: dto.id, id: dto.id,
topic: dto.topic, topic: [dto.topic],
title: dto.title, title: dto.title,
authors: dto.authors, authors: dto.authors,
tags: dto.tags, tags: dto.tags,

View File

@ -1,5 +1,4 @@
import { AnyAction } from "@reduxjs/toolkit"; import { AnyAction } from "@reduxjs/toolkit";
import { Article } from "article/domain/articleEntity";
import type { ArticleStore } from "../domain/articleStore"; import type { ArticleStore } from "../domain/articleStore";
import * as actionTypes from "./articleActionTypes"; import * as actionTypes from "./articleActionTypes";

View File

@ -1,10 +0,0 @@
export interface Article {
id?: string;
title?: string;
authors?: string[];
topic?: string[];
summary?: string;
tags?: string[];
content?: string;
publisher?: string;
}

View File

@ -1,9 +1,9 @@
export interface Article { export interface Article {
id: string; id: string;
topic: string;
title: string; title: string;
authors: string[];
tags: string[];
summary: string;
content: string; content: string;
topic?: string[];
authors?: string[];
tags?: string[];
summary?: string;
} }

View File

@ -1,5 +1,4 @@
import type { Article } from "./articleEntity"; import { Article } from './articleEntity';
interface ArticleStore { interface ArticleStore {
// State // State
article: Article | undefined; article: Article | undefined;

View File

@ -1,6 +1,6 @@
export interface CreateArticleParams { export interface CreateArticleParams {
id: string; id: string;
topic: string; topic: string[];
title: string; title: string;
authors: string[]; authors: string[];
tags: string[]; tags: string[];

View File

@ -11,44 +11,14 @@ import {
SVGFolder, SVGFolder,
} from "components/icons"; } from "components/icons";
import classNames from "classnames"; import classNames from "classnames";
import { Transition } from "@headlessui/react";
import { useArticleViewModel } from "article/controller/articleViewModel"; const interactionButtonsStore = [
import { useArticleStore } from "article/data/articleStoreImplementation";
import { useParams } from "react-router";
import Link from "components/typography/Link";
import { getArticle } from "article/data/articleAPIService";
type ArticleButtonProps = {
children?: React.ReactNode;
className?: string;
emphasis?: "high" | "low";
} & Omit<React.ComponentPropsWithoutRef<"button">, "">;
export function ArticleInteractionButtons({
children,
className,
emphasis, //to change displaying of component
...props
}: ArticleButtonProps) {
const abstractButton = (
<Button emphasis="medium" className="text-sm leading-4 items-center px-3">
<Button.Icon>
<SVGArrowDown className="w-4 fill-blue-700 stroke-blue-700" />
</Button.Icon>
<Typography fontWeightVariant="bold" className="pr-2">
Abstract
</Typography>
</Button>
);
const { id } = useParams();
const newId = `${id}`;
const interactionButtonsStore = [
{ {
icon: <SVGFiletext />, icon: <SVGFiletext />,
title: "Read file", title: "Read file",
buttonEmphasis: "high", buttonEmphasis: "high",
iconClassName: "h-6 fill-white stroke-white", iconClassName: "h-6 fill-white stroke-white",
dist: `${newId}/anarticlebody`,
}, },
{ {
icon: <SVGDownload />, icon: <SVGDownload />,
@ -68,28 +38,50 @@ export function ArticleInteractionButtons({
buttonEmphasis: "low", buttonEmphasis: "low",
iconClassName: "w-6 fill-gray-900 stroke-gray-900", iconClassName: "w-6 fill-gray-900 stroke-gray-900",
}, },
]; ];
//
type ArticleButtonProps = {
isAbstractOpen?: boolean;
openAbstract?: () => void;
children?: React.ReactNode;
className?: string;
emphasis?: "high" | "low";
} & Omit<React.ComponentPropsWithoutRef<"button">, "">;
export function ArticleInteractionButtons({
isAbstractOpen = false,
children,
openAbstract = () => { },
className,
emphasis = "high", //to change displaying of component
...props
}: ArticleButtonProps) {
const abstractButton = (
<Button
emphasis="medium"
className="text-sm leading-4 items-center px-3 mr-2 focus:outline-none active:outline-none"
onClick={openAbstract}
>
<Typography fontWeightVariant="bold" className="pr-2">
Abstract
</Typography>
<Button.Icon>
{!isAbstractOpen ? <SVGArrowDown className="w-4 fill-blue-700 stroke-blue-700" /> : <SVGArrowUp className="w-4 fill-blue-700 stroke-blue-700" />}
</Button.Icon>
</Button>
);
const fileInteractionButtons = interactionButtonsStore.map((button) => { const fileInteractionButtons = interactionButtonsStore.map((button) => {
return ( return (
<Link
onClick={
button.title == "Read file" ? () => getArticle(newId) : () => { }
}
to={button.dist}
>
<Button <Button
emphasis={button.buttonEmphasis === "high" ? "high" : "low"} emphasis={button.buttonEmphasis === "high" ? "high" : "low"}
className="h-max px-2 mr-2" className="h-max px-2 mr-2"
> >
<Button.Icon> <Button.Icon>
{React.cloneElement(button.icon, { {React.cloneElement(button.icon, { className: button.iconClassName })}
className: button.iconClassName,
})}
</Button.Icon> </Button.Icon>
{emphasis === "high" ? <Typography>{button.title}</Typography> : null} {emphasis === "high" ? <Typography>{button.title}</Typography> : null}
</Button> </Button>
</Link>
); );
}); });

View File

@ -1,6 +1,6 @@
import { useState } from "react"; import { useState } from "react";
import { Article } from "components/Article/Article"; import { Article } from "components/Article/Article";
import { Article as ArticleTypes } from "article/domain/ArticleEntity"; import { Article as ArticleTypes } from "article/domain/articleEntity";
import classNames from "classnames"; import classNames from "classnames";
import { debounce } from "lodash"; import { debounce } from "lodash";
import { useSearchStoreImplementation } from "searchResults/data/searchStoreImplementation"; import { useSearchStoreImplementation } from "searchResults/data/searchStoreImplementation";

View File

@ -38,7 +38,7 @@ export const SearchResultSection = () => {
</Typography> </Typography>
</div> </div>
<hr className="w-full border-gray-100" /> <hr className="w-full border-gray-100" />
<div className="divide divide-y divide-gray-100">{ getResults()}</div> <div className="divide divide-y divide-gray-100">{getResults()}</div>
</div> </div>
); );
}; };

View File

@ -1,7 +1,7 @@
import React from "react"; import React from "react";
import Container from "components/Container"; import Container from "components/Container";
import { Button } from "components/Button/Button"; import { Button } from "components/Button/Button";
import Link from "components/Link"; import Link from "components/typography/Link";
const NotFound = () => { const NotFound = () => {
return ( return (
@ -24,7 +24,7 @@ const NotFound = () => {
bar bar
</h4> </h4>
<Button className="my-4"> <Button className="my-4">
<Link href="/">Go to home</Link> <Link to="/">Go to home</Link>
</Button> </Button>
</Container> </Container>
); );

View File

@ -1,16 +1,18 @@
import { Article } from "article/domain/articleEntity";
export type SearchResultsDTO = { export type SearchResultsDTO = {
data: ArticleDTO[]; data: ArticleDTO[];
meta: SearchResultsMeta; meta: SearchResultsMeta;
}; };
export type ArticleDTO = { export type ArticleDTO = {
id?: string; id: string;
title?: string; title: string;
authors?: string[]; authors: string[];
topic?: string[]; topic: string[];
summary?: string; summary: string;
tags?: string[]; tags: string[];
content?: string; content: string;
}; };
export type SearchResultsMeta = { export type SearchResultsMeta = {

View File

@ -10,11 +10,23 @@ const searchEndpoint = "/papers/search";
async function search(request: string): Promise<SearchResults> { async function search(request: string): Promise<SearchResults> {
try { try {
const response = await integratorApiClient.get<SearchResultsDTO>( const response = await integratorApiClient.get<SearchResultsDTO>(
searchEndpoint + `?query=` + request + `&limit=10&offset=0` // searchEndpoint + `?query=` + request + `&limit=10&offset=0`
// "https://run.mocky.io/v3/ea705665-2479-4039-8b81-412e011fc145" "https://run.mocky.io/v3/ea705665-2479-4039-8b81-412e011fc145"
); );
const dto = response.data; const dto = response.data;
return create({ data: dto.data, meta: dto.meta }); return create({
data: dto.data.map((e) => {
return {
authors: e.authors,
content: e.content,
id: e.id,
summary: e.summary,
tags: e.tags,
title: e.title,
topic: e.topic,
}
}), meta: dto.meta
});
} catch (reason) { } catch (reason) {
if (axios.isAxiosError(reason)) { if (axios.isAxiosError(reason)) {
throw Failure.fromReason(reason, "failures.services.load"); throw Failure.fromReason(reason, "failures.services.load");

View File

@ -1,8 +1,8 @@
import { Article } from "article/domain/ArticleEntity"; import { Article } from "article/domain/articleEntity";
export interface SearchResults { export interface SearchResults {
data: Article[]; data: Article[];
meta:SearchResultsMeta ; meta: SearchResultsMeta;
} }
export interface SearchResultsMeta { export interface SearchResultsMeta {

View File

@ -1,10 +1,12 @@
import { configureStore } from "@reduxjs/toolkit"; import { configureStore } from "@reduxjs/toolkit";
import { articleReducer } from "article/data/articleReducer";
import thunk from "redux-thunk"; import thunk from "redux-thunk";
import { searchResultReducer } from "searchResults/data/searchReducer"; import { searchResultReducer } from "searchResults/data/searchReducer";
const store = configureStore({ const store = configureStore({
reducer: { reducer: {
searchResults: searchResultReducer, searchResults: searchResultReducer,
article: articleReducer,
}, },
middleware: [thunk], middleware: [thunk],
}); });