Skip to content

Commit

Permalink
collection cache / ucm update message
Browse files Browse the repository at this point in the history
  • Loading branch information
@NickJ202
NickJ202 committed Dec 18, 2024
1 parent 32cfc46 commit c503cab
Show file tree
Hide file tree
Showing 19 changed files with 443 additions and 171 deletions.
25 changes: 24 additions & 1 deletion src/api/collections.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
} from 'helpers/types';
import { sortOrderbookEntries } from 'helpers/utils';
import { store } from 'store';
import * as collectionActions from 'store/collections/actions';

export async function getCollections(creator?: string, filterUnstamped?: boolean): Promise<CollectionType[]> {
const action = creator ? 'Get-Collections-By-User' : 'Get-Collections';
Expand Down Expand Up @@ -48,9 +49,31 @@ export async function getCollections(creator?: string, filterUnstamped?: boolean
finalCollections = finalCollections.sort((a: { id: string | number }, b: { id: string | number }) => {
const countA = stampsFetch[a.id]?.total || 0;
const countB = stampsFetch[b.id]?.total || 0;
return countB - countA; // Descending order of total stamp counts
return countB - countA;
});

const key = creator ? 'creators' : filterUnstamped ? 'stamped' : 'all';
const updatedCollections = {
[key]: creator
? {
[creator]: {
collections: finalCollections,
lastUpdate: Date.now(),
},
}
: {
collections: finalCollections,
lastUpdate: Date.now(),
},
};

store.dispatch(
collectionActions.setCollections({
...(store.getState().collectionsReducer ?? {}),
...updatedCollections,
})
);

return finalCollections;
}
return null;
Expand Down
18 changes: 18 additions & 0 deletions src/app/styles.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -226,6 +226,24 @@ export const GlobalStyle = createGlobalStyle`
}
}
.update-wrapper {
width: 100%;
padding: 2.5px 40px;
display: flex;
align-items: center;
justify-content: center;
background: ${(props) => props.theme.colors.container.alt11.background};
border: 1px solid ${(props) => props.theme.colors.border.alt3};
border-radius: ${STYLING.dimensions.radius.alt1};
span {
font-size: ${(props) => props.theme.typography.size.xSmall};
font-family: ${(props) => props.theme.typography.family.alt1};
font-weight: ${(props) => props.theme.typography.weight.bold};
color: ${(props) => props.theme.colors.font.light1};
text-align: center;
}
}
.overlay {
min-height: 100vh;
height: 100%;
Expand Down
144 changes: 78 additions & 66 deletions src/components/organisms/AssetsTable/AssetsTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import { Notification } from 'components/atoms/Notification';
import { Select } from 'components/atoms/Select';
import { ASSET_SORT_OPTIONS, ASSETS, PAGINATORS, STYLING, URLS } from 'helpers/config';
import { AssetDetailType, AssetSortType, IdGroupType, NotificationType, SelectOptionType } from 'helpers/types';
import { isFirefox, sortOrders } from 'helpers/utils';
import { formatDate, isFirefox, sortOrders } from 'helpers/utils';
import * as windowUtils from 'helpers/window';
import { useAppProvider } from 'providers/AppProvider';
import { useArweaveProvider } from 'providers/ArweaveProvider';
Expand Down Expand Up @@ -405,87 +405,99 @@ export default function AssetsTable(props: IProps) {
return (
<S.Wrapper className={'fade-in'} ref={scrollRef}>
<S.Header>
<h4>{`${language.assets}${props.ids && props.ids.length ? ` (${props.ids.length})` : ''}`}</h4>
<S.HeaderActions>
<Button
type={'primary'}
label={language.activeListings}
handlePress={toggleFilterListings}
disabled={getActionDisabled()}
active={assetFilterListings}
icon={assetFilterListings ? ASSETS.close : null}
className={'filter-listings'}
/>
<S.SelectWrapper>
<Select
label={null}
activeOption={assetSortType}
setActiveOption={(option: SelectOptionType) => handleAssetSortType(option)}
options={ASSET_SORT_OPTIONS.map((option: SelectOptionType) => option)}
<S.HeaderMain>
<h4>{`${language.assets}${props.ids && props.ids.length ? ` (${props.ids.length})` : ''}`}</h4>
<S.HeaderActions>
<Button
type={'primary'}
label={language.activeListings}
handlePress={toggleFilterListings}
disabled={getActionDisabled()}
active={assetFilterListings}
icon={assetFilterListings ? ASSETS.close : null}
className={'filter-listings'}
/>
</S.SelectWrapper>
{desktop && (
<S.ViewTypeWrapper className={'border-wrapper-alt1'}>
<S.SelectWrapper>
<Select
label={null}
activeOption={assetSortType}
setActiveOption={(option: SelectOptionType) => handleAssetSortType(option)}
options={ASSET_SORT_OPTIONS.map((option: SelectOptionType) => option)}
disabled={getActionDisabled()}
/>
</S.SelectWrapper>
{desktop && (
<S.ViewTypeWrapper className={'border-wrapper-alt1'}>
<IconButton
type={'alt1'}
src={ASSETS.grid}
handlePress={() => setViewType('grid')}
disabled={viewType === 'grid'}
dimensions={{
wrapper: 32.5,
icon: 17.5,
}}
active={viewType === 'grid'}
tooltip={'Grid view'}
useBottomToolTip
className={'start-action'}
/>
<IconButton
type={'alt1'}
src={ASSETS.list}
handlePress={() => setViewType('list')}
disabled={viewType === 'list'}
dimensions={{
wrapper: 32.5,
icon: 17.5,
}}
active={viewType === 'list'}
tooltip={'List view'}
useBottomToolTip
className={'end-action'}
/>
</S.ViewTypeWrapper>
)}
<S.HeaderPaginator>
<IconButton
type={'alt1'}
src={ASSETS.grid}
handlePress={() => setViewType('grid')}
disabled={viewType === 'grid'}
src={ASSETS.arrow}
handlePress={() => handlePaginationAction('previous', true)}
disabled={!assets || !previousAction}
dimensions={{
wrapper: 32.5,
wrapper: 30,
icon: 17.5,
}}
active={viewType === 'grid'}
tooltip={'Grid view'}
tooltip={language.previous}
useBottomToolTip
className={'start-action'}
className={'table-previous'}
/>
<IconButton
type={'alt1'}
src={ASSETS.list}
handlePress={() => setViewType('list')}
disabled={viewType === 'list'}
src={ASSETS.arrow}
handlePress={() => handlePaginationAction('next', true)}
disabled={!assets || !nextAction}
dimensions={{
wrapper: 32.5,
wrapper: 30,
icon: 17.5,
}}
active={viewType === 'list'}
tooltip={'List view'}
tooltip={language.next}
useBottomToolTip
className={'end-action'}
className={'table-next'}
/>
</S.ViewTypeWrapper>
)}
<S.HeaderPaginator>
<IconButton
type={'alt1'}
src={ASSETS.arrow}
handlePress={() => handlePaginationAction('previous', true)}
disabled={!assets || !previousAction}
dimensions={{
wrapper: 30,
icon: 17.5,
}}
tooltip={language.previous}
useBottomToolTip
className={'table-previous'}
/>
<IconButton
type={'alt1'}
src={ASSETS.arrow}
handlePress={() => handlePaginationAction('next', true)}
disabled={!assets || !nextAction}
dimensions={{
wrapper: 30,
icon: 17.5,
}}
tooltip={language.next}
useBottomToolTip
className={'table-next'}
/>
</S.HeaderPaginator>
</S.HeaderActions>
</S.HeaderPaginator>
</S.HeaderActions>
</S.HeaderMain>
{(appProvider.ucm?.lastUpdate || appProvider.ucm?.updating) && (
<S.HeaderInfo>
{appProvider.ucm?.lastUpdate && (
<p>
{language.lastUCMUpdate}: <b>{formatDate(appProvider.ucm.lastUpdate, 'iso', true)}</b>
{appProvider.ucm?.updating && ` (${language.runningUpdate}...)`}
</p>
)}
</S.HeaderInfo>
)}
</S.Header>
{getData()}
<S.Footer>
Expand Down
32 changes: 31 additions & 1 deletion src/components/organisms/AssetsTable/styles.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,42 @@ export const Wrapper = styled.div`
`;

export const Header = styled.div`
margin: 0 0 20px 0;
`;

export const HeaderMain = styled.div`
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
margin: 0 0 20px 0;
h4 {
line-height: 1;
}
`;

export const HeaderInfo = styled.div`
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
margin: 7.5px 0 0 0;
p {
color: ${(props) => props.theme.colors.font.alt1};
font-size: ${(props) => props.theme.typography.size.xSmall};
font-family: ${(props) => props.theme.typography.family.primary};
font-weight: ${(props) => props.theme.typography.weight.bold};
}
b {
color: ${(props) => props.theme.colors.font.primary};
font-size: ${(props) => props.theme.typography.size.xSmall};
font-family: ${(props) => props.theme.typography.family.alt1};
font-weight: ${(props) => props.theme.typography.weight.bold};
}
`;

export const HeaderActions = styled.div`
Expand Down
2 changes: 1 addition & 1 deletion src/components/organisms/CollectionsCarousel/CollectionsCarousel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ export default function CollectionsCarousel(props: IProps) {
removeArrowOnDeviceType={['tablet', 'mobile']}
customTransition={'transform 500ms ease'}
partialVisible
autoPlay
autoPlay={!props.loading}
autoPlaySpeed={5000}
afterChange={handleAfterChange}
>
Expand Down
Loading

0 comments on commit c503cab

Please sign in to comment.