Skip to content

Commit 9dfa0b6

Browse files
authored
Merge pull request #1114 from isaacphysics/improvement/cslgi-cleanup-my-progress
Improve CSLGIs in My Progress
2 parents 1cbf71b + 5163c63 commit 9dfa0b6

File tree

6 files changed

+49
-25
lines changed

6 files changed

+49
-25
lines changed

src/app/components/elements/GameboardBuilderRow.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -111,12 +111,12 @@ const GameboardBuilderRow = (
111111
<Spacer />
112112
{isPhy && <div className="d-flex flex-column justify-self-end">
113113
{question.supersededBy && <a
114-
className="superseded-tag ms-1 ms-sm-3 my-1 align-self-end"
114+
className="superseded-tag mx-1 ms-sm-3 my-1 align-self-end"
115115
href={`/questions/${question.supersededBy}`}
116116
onClick={(e) => e.stopPropagation()}
117117
>SUPERSEDED</a>}
118118
{question.tags?.includes("nofilter") && <span
119-
className="superseded-tag ms-1 ms-sm-3 my-1 align-self-end"
119+
className="superseded-tag mx-1 ms-sm-3 my-1 align-self-end"
120120
>NO-FILTER</span>}
121121
</div>}
122122
</div>

src/app/components/elements/list-groups/ContentSummaryListGroupItem.tsx

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -32,12 +32,18 @@ import classNames from "classnames";
3232
import {ListGroup, ListGroupItem, UncontrolledTooltip} from "reactstrap";
3333
import { CSSModule } from "reactstrap/types/lib/utils";
3434

35-
export const ContentSummaryListGroupItem = ({item, search, displayTopicTitle, noCaret, hideContentType, ignoreIntendedAudience}: {
35+
export enum ContentTypeVisibility {
36+
SHOWN, // default if not specified
37+
ICON_ONLY,
38+
FULLY_HIDDEN
39+
}
40+
41+
export const ContentSummaryListGroupItem = ({item, search, showBreadcrumb, noCaret, contentTypeVisibility, ignoreIntendedAudience}: {
3642
item: ShortcutResponse;
3743
search?: string;
38-
displayTopicTitle?: boolean;
44+
showBreadcrumb?: boolean;
3945
noCaret?: boolean;
40-
hideContentType?: boolean;
46+
contentTypeVisibility?: ContentTypeVisibility;
4147
ignoreIntendedAudience?: boolean;
4248
}) => {
4349
const componentId = useRef(uuid_v4().slice(0, 4)).current;
@@ -145,18 +151,18 @@ export const ContentSummaryListGroupItem = ({item, search, displayTopicTitle, no
145151

146152
return <ListGroupItem className={classNames(itemClasses, {"p-3 d-md-flex flex-column justify-content-center content-summary-item": isPhy})} key={linkDestination}>
147153
<Link className={classNames({"position-relative justify-content-center": isAda})} to={{pathname: linkDestination, search: search, hash: hash}}>
148-
<span className={classNames({"content-summary-link-title align-self-center": isPhy, "question-progress-icon": isAda})}>
154+
{contentTypeVisibility !== ContentTypeVisibility.FULLY_HIDDEN && <span className={classNames({"content-summary-link-title align-self-center": isPhy, "question-progress-icon": isAda})}>
149155
{siteSpecific(
150156
icon,
151157
<div className={"inner-progress-icon"}>
152158
{icon}
153-
{!hideContentType && <>
159+
{contentTypeVisibility !== ContentTypeVisibility.ICON_ONLY && <>
154160
<br/>
155161
<span className={"icon-title"}>{typeLabel}</span>
156162
</>}
157163
</div>
158164
)}
159-
</span>
165+
</span>}
160166
<div className={classNames("flex-fill", {"py-3 pe-3 align-content-center": isAda, "d-flex": isAda && !stack, "d-md-flex": isPhy})}>
161167
<div className={"align-self-center " + titleClasses}>
162168
<div className="d-flex">
@@ -167,12 +173,12 @@ export const ContentSummaryListGroupItem = ({item, search, displayTopicTitle, no
167173
({typeLabel})
168174
</span>}
169175
{isPhy && item.supersededBy && isTeacherOrAbove(user) ? <a
170-
className="superseded-tag ms-1 ms-sm-3"
176+
className="superseded-tag mx-1 ms-sm-3"
171177
href={`/questions/${item.supersededBy}`}
172178
onClick={(e) => e.stopPropagation()}
173179
>SUPERSEDED</a> : null}
174180
{isPhy && item.tags && item.tags.includes("nofilter") && isStaff(user) ? <span
175-
className="superseded-tag ms-1 ms-sm-3"
181+
className="superseded-tag mx-1 ms-sm-3"
176182
>NO-FILTER</span> : null}
177183
</div>
178184
{(isPhy && item.summary) && <div className="small text-muted d-none d-sm-block">
@@ -181,7 +187,7 @@ export const ContentSummaryListGroupItem = ({item, search, displayTopicTitle, no
181187
{(!item.summary || deviceSize === "xs") && item.subtitle && <div className="small text-muted d-block">
182188
{item.subtitle}
183189
</div>}
184-
{displayTopicTitle && hierarchyTags && <div className={"hierarchy-tags d-none d-md-block"}>
190+
{showBreadcrumb && hierarchyTags && <div className={"hierarchy-tags d-none d-md-block"}>
185191
{hierarchyTags.map(tag => (<span className="hierarchy-tag" key={tag.id}>{tag.title}</span>))}
186192
</div>}
187193
</div>
@@ -199,12 +205,12 @@ export const ContentSummaryListGroupItem = ({item, search, displayTopicTitle, no
199205
</ListGroupItem>;
200206
};
201207

202-
export const LinkToContentSummaryList = ({items, search, displayTopicTitle, noCaret, hideContentType, ignoreIntendedAudience, ...rest}: {
208+
export const LinkToContentSummaryList = ({items, search, showBreadcrumb, noCaret, contentTypeVisibility, ignoreIntendedAudience, ...rest}: {
203209
items: ContentSummaryDTO[];
204210
search?: string;
205-
displayTopicTitle?: boolean;
211+
showBreadcrumb?: boolean;
206212
noCaret?: boolean;
207-
hideContentType?: boolean;
213+
contentTypeVisibility?: ContentTypeVisibility;
208214
ignoreIntendedAudience?: boolean;
209215
tag?: React.ElementType;
210216
flush?: boolean;
@@ -214,8 +220,8 @@ export const LinkToContentSummaryList = ({items, search, displayTopicTitle, noCa
214220
return <ListGroup {...rest} className={"link-list list-group-links mb-3" + rest.className}>
215221
{items.map(item => <ContentSummaryListGroupItem
216222
item={item} search={search} noCaret={noCaret}
217-
key={item.type + "/" + item.id} displayTopicTitle={displayTopicTitle}
218-
hideContentType={hideContentType} ignoreIntendedAudience={ignoreIntendedAudience}
223+
key={item.type + "/" + item.id} showBreadcrumb={showBreadcrumb}
224+
contentTypeVisibility={contentTypeVisibility} ignoreIntendedAudience={ignoreIntendedAudience}
219225
/>)}
220226
</ListGroup>;
221227
};

src/app/components/pages/Concepts.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import * as RS from "reactstrap";
55
import {Col, Container, Form, Input, Label, Row} from "reactstrap";
66
import queryString from "query-string";
77
import {ShowLoading} from "../handlers/ShowLoading";
8-
import {LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
8+
import {ContentTypeVisibility, LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
99
import {matchesAllWordsInAnyOrder, pushConceptsToHistory, searchResultIsPublic, shortcuts, TAG_ID} from "../../services";
1010
import {TitleAndBreadcrumb} from "../elements/TitleAndBreadcrumb";
1111
import {ShortcutResponse} from "../../../IsaacAppTypes";
@@ -129,7 +129,10 @@ export const Concepts = withRouter((props: RouteComponentProps) => {
129129
<RS.CardBody>
130130
<ShowLoading until={shortcutAndFilteredSearchResults}>
131131
{shortcutAndFilteredSearchResults ?
132-
<LinkToContentSummaryList items={shortcutAndFilteredSearchResults} displayTopicTitle={false}/>
132+
<LinkToContentSummaryList
133+
items={shortcutAndFilteredSearchResults} showBreadcrumb={false}
134+
contentTypeVisibility={ContentTypeVisibility.ICON_ONLY}
135+
/>
133136
: <em>No results found</em>}
134137
</ShowLoading>
135138
</RS.CardBody>

src/app/components/pages/MyProgress.tsx

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ import {Tabs} from "../elements/Tabs";
2727
import {FlushableRef, QuestionProgressCharts} from "../elements/views/QuestionProgressCharts";
2828
import {ActivityGraph} from "../elements/views/ActivityGraph";
2929
import {ProgressBar} from "../elements/views/ProgressBar";
30-
import {LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
30+
import {ContentTypeVisibility, LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
3131

3232
const siteSpecificStats = siteSpecific(
3333
// Physics
@@ -201,11 +201,19 @@ const MyProgress = withRouter((props: MyProgressProps) => {
201201
<Row id="progress-questions">
202202
{progress?.mostRecentQuestions && progress?.mostRecentQuestions.length > 0 && <Col md={12} lg={6} className="mt-4">
203203
<h4>Most recently answered questions</h4>
204-
<LinkToContentSummaryList items={progress.mostRecentQuestions}/>
204+
<LinkToContentSummaryList
205+
items={progress.mostRecentQuestions}
206+
contentTypeVisibility={ContentTypeVisibility.FULLY_HIDDEN}
207+
ignoreIntendedAudience
208+
/>
205209
</Col>}
206210
{progress?.oldestIncompleteQuestions && progress?.oldestIncompleteQuestions.length > 0 && <Col md={12} lg={6} className="mt-4">
207211
<h4>Oldest unsolved questions</h4>
208-
<LinkToContentSummaryList items={progress.oldestIncompleteQuestions}/>
212+
<LinkToContentSummaryList
213+
items={progress.oldestIncompleteQuestions}
214+
contentTypeVisibility={ContentTypeVisibility.FULLY_HIDDEN}
215+
ignoreIntendedAudience
216+
/>
209217
</Col>}
210218
</Row>
211219
</div>,

src/app/components/pages/QuestionFinder.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ import {
2626
import {ContentSummaryDTO, Difficulty, ExamBoard} from "../../../IsaacApiTypes";
2727
import {IsaacSpinner} from "../handlers/IsaacSpinner";
2828
import {RouteComponentProps, useHistory, withRouter} from "react-router";
29-
import {LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
29+
import {ContentTypeVisibility, LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
3030
import {ShowLoading} from "../handlers/ShowLoading";
3131
import {TitleAndBreadcrumb} from "../elements/TitleAndBreadcrumb";
3232
import {MetaDescription} from "../elements/MetaDescription";
@@ -441,7 +441,11 @@ export const QuestionFinder = withRouter(({location}: RouteComponentProps) => {
441441
<CardBody className={classNames({"border-0": isPhy, "p-0": displayQuestions?.length, "m-0": isAda && displayQuestions?.length})}>
442442
<ShowLoading until={displayQuestions} placeholder={loadingPlaceholder}>
443443
{displayQuestions?.length
444-
? <LinkToContentSummaryList items={displayQuestions} noCaret hideContentType ignoreIntendedAudience className="m-0" />
444+
? <LinkToContentSummaryList
445+
items={displayQuestions} className="m-0"
446+
contentTypeVisibility={ContentTypeVisibility.ICON_ONLY}
447+
ignoreIntendedAudience noCaret
448+
/>
445449
: noResultsMessage }
446450
</ShowLoading>
447451
</CardBody>

src/app/components/pages/Search.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
Row
1414
} from "reactstrap";
1515
import {ShowLoading} from "../handlers/ShowLoading";
16-
import {LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
16+
import {ContentTypeVisibility, LinkToContentSummaryList} from "../elements/list-groups/ContentSummaryListGroupItem";
1717
import {
1818
DOCUMENT_TYPE,
1919
documentDescription,
@@ -164,7 +164,10 @@ export const Search = withRouter((props: RouteComponentProps) => {
164164
{urlQuery != "" && <CardBody className={classNames({"p-0 m-0": isAda && gotResults})}>
165165
<ShowLoading until={shortcutAndFilteredSearchResults}>
166166
{gotResults ?
167-
<LinkToContentSummaryList items={shortcutAndFilteredSearchResults} displayTopicTitle={true}/>
167+
<LinkToContentSummaryList
168+
items={shortcutAndFilteredSearchResults} showBreadcrumb={true}
169+
contentTypeVisibility={ContentTypeVisibility.SHOWN}
170+
/>
168171
: <em>No results found</em>}
169172
</ShowLoading>
170173
</CardBody>}

0 commit comments

Comments
 (0)