Misc fixes

This commit is contained in:
Tanner Collin 2022-05-07 06:28:33 +00:00
parent 9f91cca187
commit 497883fcce
5 changed files with 89 additions and 69 deletions

View File

@ -6,7 +6,6 @@ import moment from 'moment-timezone';
import { apiUrl, isAdmin, isInstructor, getInstructor, BasicTable, requester, useIsMobile } from './utils.js';
import { NotFound, PleaseLogin } from './Misc.js';
import { InstructorClassDetail, InstructorClassAttendance } from './InstructorClasses.js';
import { courseCache } from './Courses.js';
import { PayPalPayNow } from './PayPal.js';
import { tags } from './Courses.js';
@ -131,7 +130,7 @@ function NewClassTableCourse(props) {
<div className='byline'>
<div className='tags'>
{!!course.tags && course.tags.split(',').map(name =>
<Label color={tags[name]} tag size='small'>
<Label key={name} color={tags[name]} tag size='small'>
{name}
</Label>
)}
@ -230,11 +229,25 @@ function NewClassTable(props) {
<>
<div className='newclasstable'>
{sortedClasses.map(x =>
<NewClassTableCourse course={x.course} classes={x.classes} token={token} user={user} refreshUser={refreshUser} />
<NewClassTableCourse
key={x.course.id}
course={x.course}
classes={x.classes}
token={token}
user={user}
refreshUser={refreshUser}
/>
)}
{courses.filter(x => !seenCourseIds.includes(x.id)).map(x =>
<NewClassTableCourse course={x} classes={false} token={token} user={user} refreshUser={refreshUser} />
<NewClassTableCourse
key={x.id}
course={x}
classes={false}
token={token}
user={user}
refreshUser={refreshUser}
/>
)}
</div>
</>
@ -284,7 +297,7 @@ export function ClassFeed(props) {
export function Classes(props) {
const [classes, setClasses] = useState(classesCache);
const [courses, setCourses] = useState(courseCache);
const [courses, setCourses] = useState(false);
const [sortByCourse, setSortByCourse] = useState(sortCache);
const [tagFilter, setTagFilter] = useState(tagFilterCache);
const { token, user, refreshUser } = props;
@ -293,7 +306,6 @@ export function Classes(props) {
requester('/courses/', 'GET', token)
.then(res => {
setCourses(res.results);
courseCache = res.results;
})
.catch(err => {
console.log(err);
@ -351,45 +363,45 @@ export function Classes(props) {
</Button>
</p>
<p>
Filter by tag:
<div className='coursetags'>
<p>Filter by tag:</p>
<div className='coursetags'>
<div
className='labelbox'
style={{borderColor: tagFilter === false ? 'black' : 'transparent'}}
>
<Label
onClick={() => {
setTagFilter(false);
tagFilterCache = false;
}}
as='a'
tag
>
No Filter
</Label>
</div>
{Object.entries(tags).map(([name, color]) =>
<div
key={name}
className='labelbox'
style={{borderColor: tagFilter === false ? 'black' : 'transparent'}}
style={{borderColor: tagFilter === name ? 'black' : 'transparent'}}
>
<Label
onClick={() => {
setTagFilter(false);
tagFilterCache = false;
setTagFilter(name);
tagFilterCache = name;
}}
as='a'
color={color}
tag
>
No Filter
{name}
</Label>
</div>
{Object.entries(tags).map(([name, color]) =>
<div
className='labelbox'
style={{borderColor: tagFilter === name ? 'black' : 'transparent'}}
>
<Label
onClick={() => {
setTagFilter(name);
tagFilterCache = name;
}}
as='a'
color={color}
tag
>
{name}
</Label>
</div>
)}
</div>
</p>
)}
</div>
{classes.length && courses.length ?
sortByCourse ?

View File

@ -24,7 +24,7 @@ export const tags = {
Misc: 'grey',
};
export let courseCache = false;
let courseCache = false;
let tagFilterCache = false;
export function Courses(props) {
@ -53,45 +53,45 @@ export function Courses(props) {
<InstructorCourseList courses={courses} setCourses={setCourses} {...props} />
</Segment>}
<p>
Filter by tag:
<div className='coursetags'>
<p>Filter by tag:</p>
<div className='coursetags'>
<div
className='labelbox'
style={{borderColor: tagFilter === false ? 'black' : 'transparent'}}
>
<Label
onClick={() => {
setTagFilter(false);
tagFilterCache = false;
}}
as='a'
tag
>
No Filter
</Label>
</div>
{Object.entries(tags).map(([name, color]) =>
<div
key={name}
className='labelbox'
style={{borderColor: tagFilter === false ? 'black' : 'transparent'}}
style={{borderColor: tagFilter === name ? 'black' : 'transparent'}}
>
<Label
onClick={() => {
setTagFilter(false);
tagFilterCache = false;
setTagFilter(name);
tagFilterCache = name;
}}
as='a'
color={color}
tag
>
No Filter
{name}
</Label>
</div>
{Object.entries(tags).map(([name, color]) =>
<div
className='labelbox'
style={{borderColor: tagFilter === name ? 'black' : 'transparent'}}
>
<Label
onClick={() => {
setTagFilter(name);
tagFilterCache = name;
}}
as='a'
color={color}
tag
>
{name}
</Label>
</div>
)}
</div>
</p>
)}
</div>
{courses ?
<Table basic='very'>
@ -117,7 +117,7 @@ export function Courses(props) {
</Table.Cell>
<Table.Cell>
{!!x.tags && x.tags.split(',').map(name =>
<Label color={tags[name]} tag>
<Label key={name} color={tags[name]} tag>
{name}
</Label>
)}

View File

@ -108,7 +108,11 @@ function MemberInfo(props) {
:
<Table.Row><Table.Cell>None, please sign up for an <Link to={'/courses/249/'}>Orientation</Link></Table.Cell></Table.Row>
}
{user.training.length > 3 && <Link to='/training'>[more]</Link>}
{user.training.length > 3 &&
<Table.Row><Table.Cell>
<Link to='/training'>[more]</Link>
</Table.Cell></Table.Row>
}
</Table.Body>
</BasicTable>
@ -128,7 +132,11 @@ function MemberInfo(props) {
:
<Table.Row><Table.Cell>None</Table.Cell></Table.Row>
}
{user.transactions.length > 3 && <Link to='/transactions'>[more]</Link>}
{user.transactions.length > 3 &&
<Table.Row><Table.Cell>
<Link to='/transactions'>[more]</Link>
</Table.Cell></Table.Row>
}
</Table.Body>
</BasicTable>

View File

@ -194,10 +194,10 @@ export function Members(props) {
<p>
Sort by{' '}
{Object.entries(memberSorts).map((x, i) =>
<>
<React.Fragment key={x[0]}>
<a href='javascript:void(0)' onClick={() => doSort(x[0])}>{x[1]}</a>
{i < Object.keys(memberSorts).length - 1 && ', '}
</>
</React.Fragment>
)}.
</p>

View File

@ -130,7 +130,7 @@ body {
}
.coursetags .ui.tag.label {
margin-top: 1rem;
margin-bottom: 1rem;
}
.newclasstable {