diff --git a/webapp/.env.template b/webapp/.env.template
index 7373255a9..0a4c3405f 100644
--- a/webapp/.env.template
+++ b/webapp/.env.template
@@ -4,3 +4,4 @@ PUBLIC_REGISTRATION=false
INVITE_REGISTRATION=true
WEBSOCKETS_URI=ws://localhost:3000/api/graphql
GRAPHQL_URI=http://localhost:4000/
+CATEGORIES_ACTIVE=false
\ No newline at end of file
diff --git a/webapp/components/ContributionForm/ContributionForm.vue b/webapp/components/ContributionForm/ContributionForm.vue
index a06679149..e25dd6b0f 100644
--- a/webapp/components/ContributionForm/ContributionForm.vue
+++ b/webapp/components/ContributionForm/ContributionForm.vue
@@ -51,6 +51,19 @@
{{ contentLength }}
+
+
+ {{ formData.categoryIds.length }} / 3
+
+
{{ $t('actions.cancel') }}
@@ -69,6 +82,7 @@ import gql from 'graphql-tag'
import { mapGetters } from 'vuex'
import HcEditor from '~/components/Editor/Editor'
import PostMutations from '~/graphql/PostMutations.js'
+import CategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect'
import ImageUploader from '~/components/ImageUploader/ImageUploader'
import links from '~/constants/links.js'
import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
@@ -78,6 +92,7 @@ export default {
HcEditor,
ImageUploader,
PageParamsLink,
+ CategoriesSelect,
},
props: {
contribution: {
@@ -86,7 +101,7 @@ export default {
},
},
data() {
- const { title, content, image } = this.contribution
+ const { title, content, image, categories } = this.contribution
const {
sensitive: imageBlurred = false,
aspectRatio: imageAspectRatio = null,
@@ -94,6 +109,7 @@ export default {
} = image || {}
return {
+ categoriesActive: this.$env.CATEGORIES_ACTIVE,
links,
formData: {
title: title || '',
@@ -102,11 +118,22 @@ export default {
imageAspectRatio,
imageType,
imageBlurred,
+ categoryIds: categories ? categories.map((category) => category.id) : [],
},
formSchema: {
title: { required: true, min: 3, max: 100 },
content: { required: true },
imageBlurred: { required: false },
+ categoryIds: {
+ type: 'array',
+ required: true,
+ validator: (_, value = []) => {
+ if (value.length === 0 || value.length > 3) {
+ return [new Error(this.$t('common.validations.categories'))]
+ }
+ return []
+ },
+ },
},
loading: false,
users: [],
@@ -125,7 +152,7 @@ export default {
methods: {
submit() {
let image = null
- const { title, content } = this.formData
+ const { title, content, categoryIds } = this.formData
if (this.formData.image) {
image = {
sensitive: this.formData.imageBlurred,
@@ -143,6 +170,7 @@ export default {
variables: {
title,
content,
+ categoryIds,
id: this.contribution.id || null,
image,
},
diff --git a/webapp/config/index.js b/webapp/config/index.js
index 00df85bac..db030e929 100644
--- a/webapp/config/index.js
+++ b/webapp/config/index.js
@@ -33,6 +33,7 @@ const options = {
// Cookies
COOKIE_EXPIRE_TIME: process.env.COOKIE_EXPIRE_TIME || 730, // Two years by default
COOKIE_HTTPS_ONLY: process.env.COOKIE_HTTPS_ONLY || process.env.NODE_ENV === 'production', // ensure true in production if not set explicitly
+ CATEGORIES_ACTIVE: process.env.CATEGORIES_ACTIVE === 'true' || false,
}
const CONFIG = {