diff --git a/client/src/components/organisms/AssetsLatest.module.scss b/client/src/components/organisms/AssetsLatest.module.scss
index ebc5e07..153efb8 100644
--- a/client/src/components/organisms/AssetsLatest.module.scss
+++ b/client/src/components/organisms/AssetsLatest.module.scss
@@ -29,13 +29,14 @@
.title {
font-size: $font-size-h4;
- margin-top: $spacer * 3;
text-align: center;
- margin-bottom: $spacer;
color: $brand-grey-light;
+ border-bottom: 1px solid $brand-grey-lighter;
+ padding-bottom: $spacer / 4;
+ margin-top: $spacer * 3;
+ margin-bottom: $spacer / 2;
@media (min-width: $break-point--small) {
text-align: left;
- margin-bottom: $spacer / 2;
}
}
diff --git a/client/src/components/organisms/ChannelTeaser.module.scss b/client/src/components/organisms/ChannelTeaser.module.scss
index 1dcd54c..955dc5f 100644
--- a/client/src/components/organisms/ChannelTeaser.module.scss
+++ b/client/src/components/organisms/ChannelTeaser.module.scss
@@ -4,7 +4,7 @@
width: 100%;
@media (min-width: $break-point--medium) {
- padding-top: $spacer * 2;
+ padding-top: $spacer / 2;
display: flex;
}
diff --git a/client/src/components/organisms/ChannelTeaser.tsx b/client/src/components/organisms/ChannelTeaser.tsx
index 53a2619..3c87b6b 100644
--- a/client/src/components/organisms/ChannelTeaser.tsx
+++ b/client/src/components/organisms/ChannelTeaser.tsx
@@ -25,7 +25,7 @@ export default class ChannelTeaser extends Component<
// Get channel content
public channel = channels.items
- .filter(({ slug }) => slug === this.props.channel)
+ .filter(({ tag }) => tag === this.props.channel)
.map(channel => channel)[0]
public state = {
@@ -44,9 +44,7 @@ export default class ChannelTeaser extends Component<
offset: 4,
page: 1,
query: {
- // TODO: replace dummy category
- // categories: [this.channel.title],
- categories: ['Engineering'],
+ tags: [this.channel.tag],
price: [-1, 1]
},
sort: {
@@ -57,7 +55,8 @@ export default class ChannelTeaser extends Component<
try {
const search = await ocean.aquarius.queryMetadata(searchQuery)
this.setState({
- channelAssets: search.results,
+ // TODO: remove hacky way of getting the latest 2 assets
+ channelAssets: search.results.splice(2, 2, ''),
isLoadingChannel: false
})
} catch (error) {
@@ -68,13 +67,13 @@ export default class ChannelTeaser extends Component<
public render() {
const { channelAssets, isLoadingChannel } = this.state
- const { title, slug, teaser } = this.channel
+ const { title, tag, teaser } = this.channel
return (
-
+
{title}
diff --git a/client/src/components/templates/Channel.tsx b/client/src/components/templates/Channel.tsx
index 7b9d8f0..8a0eb81 100644
--- a/client/src/components/templates/Channel.tsx
+++ b/client/src/components/templates/Channel.tsx
@@ -34,7 +34,7 @@ interface ChannelState {
export default class Channel extends PureComponent {
// get content data based on received channel param
public channel = channels.items
- .filter(({ slug }) => slug === this.props.match.params.channel)
+ .filter(({ tag }) => tag === this.props.match.params.channel)
.map(channel => channel)[0]
public state = {
@@ -60,9 +60,7 @@ export default class Channel extends PureComponent {
offset,
page: currentPage,
query: {
- // TODO: replace dummy category
- // categories: [this.state.title],
- categories: ['Engineering'],
+ tags: [this.channel.tag],
price: [-1, 1]
},
sort: {
@@ -88,9 +86,7 @@ export default class Channel extends PureComponent {
// react-pagination starts counting at 0, we start at 1
let toPage = data.selected + 1
- this.props.history.push({
- search: `?page=${toPage}`
- })
+ this.props.history.push({ search: `?page=${toPage}` })
await this.setState({ currentPage: toPage, isLoading: true })
await this.getChannelAssets()
diff --git a/client/src/data/channels.json b/client/src/data/channels.json
index 500ad78..cfd5dc3 100644
--- a/client/src/data/channels.json
+++ b/client/src/data/channels.json
@@ -4,13 +4,13 @@
"items": [
{
"title": "AI For Good",
- "slug": "ai-for-good",
+ "tag": "ai-for-good",
"teaser": "AI for Good is an initiative to promote the use of artificial intelligence for good causes.",
"description": "[AI for Good](https://ai4good.org) is an initiative to promote the use of artificial intelligence for taking action on the UN SDGs such as fighting poverty, climate change, improving healthcare, etc. The AI for Good Commons channel is aimed at helping scale AI for Good by enabling open datasets to be published and shared and connecting AI problem owners with problem solvers."
},
{
"title": "Test Channel",
- "slug": "test-channel",
+ "tag": "test-channel",
"teaser": "Hello teaser.",
"description": "Hello description."
}
diff --git a/client/src/routes/Channels.tsx b/client/src/routes/Channels.tsx
index 7565d20..c42a38a 100644
--- a/client/src/routes/Channels.tsx
+++ b/client/src/routes/Channels.tsx
@@ -12,7 +12,7 @@ class Channels extends Component {
{channels.items.map(channel => (
))}
diff --git a/client/src/routes/Home.module.scss b/client/src/routes/Home.module.scss
index 6b29924..4629ce5 100644
--- a/client/src/routes/Home.module.scss
+++ b/client/src/routes/Home.module.scss
@@ -16,14 +16,15 @@
.title {
font-size: $font-size-h4;
- margin-top: $spacer * 3;
text-align: center;
- margin-bottom: $spacer;
color: $brand-grey-light;
+ border-bottom: 1px solid $brand-grey-lighter;
+ padding-bottom: $spacer / 4;
+ margin-top: $spacer * 3;
+ margin-bottom: $spacer / 2;
@media (min-width: $break-point--small) {
text-align: left;
- margin-bottom: $spacer / $line-height;
}
}
diff --git a/client/src/routes/Home.tsx b/client/src/routes/Home.tsx
index 8c957d5..b5a5946 100644
--- a/client/src/routes/Home.tsx
+++ b/client/src/routes/Home.tsx
@@ -68,6 +68,7 @@ export default class Home extends Component {
+ Featured Channel
diff --git a/library.json b/library.json
index f05484f..577346e 100644
--- a/library.json
+++ b/library.json
@@ -15,7 +15,7 @@
},
{
"name": "aquarius",
- "version": "~0.2.2"
+ "version": "~0.2.6"
},
{
"name": "squid-js",