ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Add new activity page

This commit is contained in:
Ramon Wenger 2024-02-26 10:44:18 +01:00
parent 9071b35090
commit c7c406f0ba
8 changed files with 164 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
client/src/__generated__/gql.ts generated
View File

@ -36,6 +36,7 @@ const documents = {
"\n fragment ContentBlockHighlightsWithIdOnlyFragment on ContentBlockNode {\n highlights {\n id\n }\n }\n ": types.ContentBlockHighlightsWithIdOnlyFragmentFragmentDoc,
"\n mutation UpdateInstrumentBookmark($input: UpdateInstrumentBookmarkInput!) {\n updateInstrumentBookmark(input: $input) {\n success\n }\n }\n ": types.UpdateInstrumentBookmarkDocument,
"\n mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n updateContentBookmark(input: $input) {\n success\n }\n }\n ": types.UpdateContentBookmarkDocument,
"\n query MyActivitiesQuery {\n myActivities {\n topics {\n id\n title\n modules {\n id\n slug\n title\n allHighlights {\n ...HighlightParts\n }\n }\n }\n }\n }\n ": types.MyActivitiesQueryDocument,
"\n query ChapterQuery($id: ID!) {\n chapter(id: $id) {\n path\n }\n }\n ": types.ChapterQueryDocument,
"\n query ContentBlockQuery($id: ID!) {\n contentBlock(id: $id) {\n path\n }\n }\n ": types.ContentBlockQueryDocument,
"\n fragment InstrumentParts on InstrumentNode {\n id\n title\n intro\n slug\n language\n bookmarks {\n uuid\n note {\n id\n text\n }\n }\n type {\n id\n name\n category {\n id\n name\n foreground\n background\n }\n type\n }\n contents\n highlights {\n ...HighlightParts\n }\n }\n": types.InstrumentPartsFragmentDoc,
@ -152,6 +153,10 @@ export function graphql(source: "\n mutation UpdateInstrumentBookmark($in
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n updateContentBookmark(input: $input) {\n success\n }\n }\n "): (typeof documents)["\n mutation UpdateContentBookmark($input: UpdateContentBookmarkInput!) {\n updateContentBookmark(input: $input) {\n success\n }\n }\n "];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n query MyActivitiesQuery {\n myActivities {\n topics {\n id\n title\n modules {\n id\n slug\n title\n allHighlights {\n ...HighlightParts\n }\n }\n }\n }\n }\n "): (typeof documents)["\n query MyActivitiesQuery {\n myActivities {\n topics {\n id\n title\n modules {\n id\n slug\n title\n allHighlights {\n ...HighlightParts\n }\n }\n }\n }\n }\n "];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/

35
client/src/__generated__/graphql.ts generated
View File

@ -41,6 +41,11 @@ export type Scalars = {
UUID: { input: any; output: any; }
};
export type ActivityNode = {
__typename?: 'ActivityNode';
topics?: Maybe<Array<Maybe<TopicNode>>>;
};
export type AddCommentInput = {
clientMutationId?: InputMaybe<Scalars['String']['input']>;
comment: Scalars['String']['input'];
@ -964,6 +969,7 @@ export type ModuleLevelNodeModuleSetArgs = {
export type ModuleNode = ModuleInterface & {
__typename?: 'ModuleNode';
allHighlights?: Maybe<Array<Maybe<HighlightNode>>>;
assignments?: Maybe<Array<Maybe<AssignmentNode>>>;
bookmark?: Maybe<ModuleBookmarkNode>;
category?: Maybe<ModuleCategoryNode>;
@ -1693,6 +1699,7 @@ export type Query = {
moduleLevels?: Maybe<Array<Maybe<ModuleLevelNode>>>;
moduleRoom?: Maybe<RoomNode>;
modules?: Maybe<ModuleConnection>;
myActivities?: Maybe<ActivityNode>;
myActivity?: Maybe<ModuleNodeConnection>;
myInstrumentActivity?: Maybe<InstrumentNodeConnection>;
newsTeasers?: Maybe<Array<Maybe<NewsTeaserNode>>>;
@ -1705,6 +1712,7 @@ export type Query = {
roomEntry?: Maybe<RoomEntryNode>;
rooms?: Maybe<Array<Maybe<RoomNode>>>;
snapshot?: Maybe<SnapshotNode>;
something: Scalars['String']['output'];
studentSubmission?: Maybe<StudentSubmissionNode>;
survey?: Maybe<SurveyNode>;
surveys?: Maybe<SurveyNodeConnection>;
@ -2255,10 +2263,11 @@ export type TopicEdge = {
export type TopicNode = Node & {
__typename?: 'TopicNode';
description: Scalars['String']['output'];
highlights?: Maybe<Array<Maybe<HighlightNode>>>;
/** The ID of the object */
id: Scalars['ID']['output'];
instructions?: Maybe<Scalars['String']['output']>;
modules?: Maybe<ModuleNodeConnection>;
modules?: Maybe<Array<Maybe<ModuleNode>>>;
/** Order of the topic */
order: Scalars['Int']['output'];
pk?: Maybe<Scalars['Int']['output']>;
@ -2270,21 +2279,6 @@ export type TopicNode = Node & {
vimeoId?: Maybe<Scalars['String']['output']>;
};
export type TopicNodeModulesArgs = {
after?: InputMaybe<Scalars['String']['input']>;
before?: InputMaybe<Scalars['String']['input']>;
first?: InputMaybe<Scalars['Int']['input']>;
last?: InputMaybe<Scalars['Int']['input']>;
offset?: InputMaybe<Scalars['Int']['input']>;
slug?: InputMaybe<Scalars['String']['input']>;
slug_Icontains?: InputMaybe<Scalars['String']['input']>;
slug_In?: InputMaybe<Array<InputMaybe<Scalars['String']['input']>>>;
title?: InputMaybe<Scalars['String']['input']>;
title_Icontains?: InputMaybe<Scalars['String']['input']>;
title_In?: InputMaybe<Array<InputMaybe<Scalars['String']['input']>>>;
};
export type TopicOr404Node = NotFound | TopicNode;
export type UpdateAnswerArgument = {
@ -2821,6 +2815,14 @@ export type UpdateContentBookmarkMutationVariables = Exact<{
export type UpdateContentBookmarkMutation = { __typename?: 'Mutation', updateContentBookmark?: { __typename?: 'UpdateContentBookmarkPayload', success?: boolean | null } | null };
export type MyActivitiesQueryQueryVariables = Exact<{ [key: string]: never; }>;
export type MyActivitiesQueryQuery = { __typename?: 'Query', myActivities?: { __typename?: 'ActivityNode', topics?: Array<{ __typename?: 'TopicNode', id: string, title: string, modules?: Array<{ __typename?: 'ModuleNode', id: string, slug: string, title: string, allHighlights?: Array<(
{ __typename?: 'HighlightNode' }
& { ' $fragmentRefs'?: { 'HighlightPartsFragment': HighlightPartsFragment } }
) | null> | null } | null> | null } | null> | null } | null };
export type ChapterQueryQueryVariables = Exact<{
id: Scalars['ID']['input'];
}>;
@ -2902,6 +2904,7 @@ export const AddHighlightDocument = {"kind":"Document","definitions":[{"kind":"O
export const AddContentHighlightDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"AddContentHighlight"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"AddContentHighlightInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"addContentHighlight"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"__typename"}},{"kind":"Field","name":{"kind":"Name","value":"highlight"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"HighlightParts"}}]}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"HighlightParts"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"HighlightNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"contentIndex"}},{"kind":"Field","name":{"kind":"Name","value":"paragraphIndex"}},{"kind":"Field","name":{"kind":"Name","value":"selectionLength"}},{"kind":"Field","name":{"kind":"Name","value":"contentUuid"}},{"kind":"Field","name":{"kind":"Name","value":"startPosition"}},{"kind":"Field","name":{"kind":"Name","value":"color"}},{"kind":"Field","name":{"kind":"Name","value":"note"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"text"}}]}},{"kind":"Field","name":{"kind":"Name","value":"text"}},{"kind":"Field","name":{"kind":"Name","value":"page"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"__typename"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ContentBlockNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"InstrumentNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ModuleNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ChapterNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}}]}}]}}]} as unknown as DocumentNode<AddContentHighlightMutation, AddContentHighlightMutationVariables>;
export const UpdateInstrumentBookmarkDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"UpdateInstrumentBookmark"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"UpdateInstrumentBookmarkInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"updateInstrumentBookmark"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"success"}}]}}]}}]} as unknown as DocumentNode<UpdateInstrumentBookmarkMutation, UpdateInstrumentBookmarkMutationVariables>;
export const UpdateContentBookmarkDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"UpdateContentBookmark"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"UpdateContentBookmarkInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"updateContentBookmark"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"success"}}]}}]}}]} as unknown as DocumentNode<UpdateContentBookmarkMutation, UpdateContentBookmarkMutationVariables>;
export const MyActivitiesQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"MyActivitiesQuery"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"myActivities"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"topics"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"modules"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"allHighlights"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"HighlightParts"}}]}}]}}]}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"HighlightParts"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"HighlightNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"contentIndex"}},{"kind":"Field","name":{"kind":"Name","value":"paragraphIndex"}},{"kind":"Field","name":{"kind":"Name","value":"selectionLength"}},{"kind":"Field","name":{"kind":"Name","value":"contentUuid"}},{"kind":"Field","name":{"kind":"Name","value":"startPosition"}},{"kind":"Field","name":{"kind":"Name","value":"color"}},{"kind":"Field","name":{"kind":"Name","value":"note"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"text"}}]}},{"kind":"Field","name":{"kind":"Name","value":"text"}},{"kind":"Field","name":{"kind":"Name","value":"page"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"__typename"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ContentBlockNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"InstrumentNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ModuleNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ChapterNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}}]}}]}}]} as unknown as DocumentNode<MyActivitiesQueryQuery, MyActivitiesQueryQueryVariables>;
export const ChapterQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ChapterQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"id"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ID"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"chapter"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"id"},"value":{"kind":"Variable","name":{"kind":"Name","value":"id"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"path"}}]}}]}}]} as unknown as DocumentNode<ChapterQueryQuery, ChapterQueryQueryVariables>;
export const ContentBlockQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ContentBlockQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"id"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ID"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"contentBlock"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"id"},"value":{"kind":"Variable","name":{"kind":"Name","value":"id"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"path"}}]}}]}}]} as unknown as DocumentNode<ContentBlockQueryQuery, ContentBlockQueryQueryVariables>;
export const InstrumentQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"InstrumentQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"slug"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"instrument"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"slug"},"value":{"kind":"Variable","name":{"kind":"Name","value":"slug"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"InstrumentParts"}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"HighlightParts"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"HighlightNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"contentIndex"}},{"kind":"Field","name":{"kind":"Name","value":"paragraphIndex"}},{"kind":"Field","name":{"kind":"Name","value":"selectionLength"}},{"kind":"Field","name":{"kind":"Name","value":"contentUuid"}},{"kind":"Field","name":{"kind":"Name","value":"startPosition"}},{"kind":"Field","name":{"kind":"Name","value":"color"}},{"kind":"Field","name":{"kind":"Name","value":"note"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"text"}}]}},{"kind":"Field","name":{"kind":"Name","value":"text"}},{"kind":"Field","name":{"kind":"Name","value":"page"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"__typename"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ContentBlockNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"InstrumentNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ModuleNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ChapterNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"InstrumentParts"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"InstrumentNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"intro"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"language"}},{"kind":"Field","name":{"kind":"Name","value":"bookmarks"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"uuid"}},{"kind":"Field","name":{"kind":"Name","value":"note"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"text"}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"type"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"category"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"foreground"}},{"kind":"Field","name":{"kind":"Name","value":"background"}}]}},{"kind":"Field","name":{"kind":"Name","value":"type"}}]}},{"kind":"Field","name":{"kind":"Name","value":"contents"}},{"kind":"Field","name":{"kind":"Name","value":"highlights"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"HighlightParts"}}]}}]}}]} as unknown as DocumentNode<InstrumentQueryQuery, InstrumentQueryQueryVariables>;

23
client/src/components/content-blocks/ContentComponent.vue
View File

@ -234,29 +234,6 @@ onMounted(() => {
});
</script>
<style lang="postcss">
.highlight {
background-color: Highlight;
color: HighlightText;
cursor: pointer;
&--alpha {
background-color: var(--mark-alpha);
color: var(--color-charcoal-dark);
}
&--beta {
background-color: var(--mark-beta);
color: var(--color-charcoal-dark);
}
&--gamma {
background-color: var(--mark-gamma);
color: var(--color-charcoal-dark);
}
}
</style>
<style lang="postcss" scoped>
.content-component {
position: relative;

7
client/src/components/profile/ActivityFilter.vue
View File

@ -3,6 +3,7 @@
<a
:class="{ 'activity-filter__link--active': filter === entry.tag }"
class="activity-filter__link"
data-cy="activity-tab"
v-for="(entry, i) in filters"
:key="i"
@click="$emit('change-filter', entry.tag)"
@ -18,11 +19,11 @@ export default {
data() {
return {
filters: [
{ tag: '', label: 'Alle' },
// { tag: '', label: 'Alle' },
{ tag: 'highlights', label: 'Markierungen' },
{ tag: 'bookmarks', label: 'Lesezeichen' },
{ tag: 'assignments', label: 'Ergebnisse' },
{ tag: 'surveys', label: 'Übungen' },
{ tag: 'bookmarks', label: 'Lesezeichen' },
{ tag: 'notes', label: 'Notizen' },
],
};
},

169
client/src/pages/activity.vue
View File

@ -1,78 +1,119 @@
<template>
<div class="activity">
<h1 class="activity__header">Meine Aktivitäten</h1>
<activity-filter
:filter="filter"
@change-filter="filter = $event"
/>
<loading-message v-if="loading">Aktivitäten werden geladen</loading-message>
<div class="modules">
<module-activity
:filter="filter"
:module="module"
class="activity"
v-for="(module, id) in modules"
:key="id"
/>
<h1 class="activity__heading">Meine Aktivitäten</h1>
<div class="activity__categories">
<a
class="activity__category default-link"
data-cy="activity-category"
:class="{ 'activity__category--active': selectedCategory === HIGHLIGHTS }"
@click="selectedCategory = HIGHLIGHTS"
>Markierungen</a
>
<a
class="activity__category default-link"
data-cy="activity-category"
:class="{ 'activity__category--active': selectedCategory === BOOKMARKS }"
@click="selectedCategory = BOOKMARKS"
>Lesezeichen</a
>
<a
class="activity__category default-link"
data-cy="activity-category"
:class="{ 'activity__category--active': selectedCategory === ASSIGNMENTS }"
@click="selectedCategory = ASSIGNMENTS"
>Ergebnisse</a
>
<a
class="activity__category default-link"
data-cy="activity-category"
:class="{ 'activity__category--active': selectedCategory === SURVEYS }"
@click="selectedCategory = SURVEYS"
>Übungen</a
>
</div>
<div class="activity__activities">
<h2>Activities go here</h2>
<div v-if="selectedCategory === HIGHLIGHTS">
<h3>HIGHLIGHTS</h3>
<div v-for="topic in myActivities.topics">
<h4>{{ topic.title }}</h4>
<div v-for="module in topic.modules">
<div v-for="highlight in module.allHighlights">
<mark
class="highlight"
:class="[`highlight--${highlight.color}`]"
>{{ highlight.text }}</mark
>
</div>
</div>
</div>
</div>
<h3 v-if="selectedCategory === BOOKMARKS">BOOKMARKS</h3>
<h3 v-if="selectedCategory === ASSIGNMENTS">ASSIGNMENTS</h3>
<h3 v-if="selectedCategory === SURVEYS">SURVEYS</h3>
</div>
<instrument-activity
:filter="filter"
:instrument="instrument"
v-for="(instrument, id) in instruments"
:key="id"
/>
</div>
</template>
<script>
import ModuleActivity from '@/components/profile/ModuleActivity.vue';
import InstrumentActivity from '@/components/profile/InstrumentActivity.vue';
import ActivityFilter from '@/components/profile/ActivityFilter.vue';
import MY_ACTIVITY_QUERY from '@/graphql/gql/queries/myActivity.gql';
import LoadingMessage from '@/components/ui/loadingMessage.vue';
<script setup lang="ts">
import { graphql } from '@/__generated__';
import { useQuery } from '@vue/apollo-composable';
import { ref, computed } from 'vue';
export default {
components: {
LoadingMessage,
ModuleActivity,
InstrumentActivity,
ActivityFilter,
},
const HIGHLIGHTS = 'highlights';
const BOOKMARKS = 'bookmarks';
const ASSIGNMENTS = 'assignments';
const SURVEYS = 'surveys';
apollo: {
modules: {
query: MY_ACTIVITY_QUERY,
update(data) {
this.loading = false;
return this.$getRidOfEdges(data).myActivity;
},
pollInterval: 15000,
},
instruments: {
query: MY_ACTIVITY_QUERY,
update(data) {
this.loading = false;
return this.$getRidOfEdges(data).myInstrumentActivity;
},
pollInterval: 15000,
},
},
const selectedCategory = ref(HIGHLIGHTS);
data() {
return {
modules: [],
instruments: [],
filter: '',
loading: true,
};
},
};
const { result } = useQuery(
graphql(`
query MyActivitiesQuery {
myActivities {
topics {
id
title
modules {
id
slug
title
allHighlights {
...HighlightParts
}
}
}
}
}
`)
);
console.log(result);
//
//
// const myActivities = computed(() => result.value || { topics: [] });
const myActivities = computed(() => result.value?.myActivities || { topics: [] });
</script>
<style scoped lang="scss">
@import '@/styles/_variables.scss';
<style lang="postcss">
.activity {
&__heading {
margin-bottom: var(--section-spacing);
}
.module-activity {
margin-bottom: $large-spacing;
&__categories {
display: flex;
flex-direction: row;
border-bottom: 1px solid var(--color-silver);
padding-bottom: var(--medium-spacing);
}
&__category {
color: inherit;
flex-grow: 1;
&--active {
color: var(--color-brand);
}
}
}
</style>

21
client/src/styles/css/components.css
View File

@ -24,3 +24,24 @@
resize: none;
outline: 0;
}
.highlight {
background-color: Highlight;
color: HighlightText;
cursor: pointer;
&--alpha {
background-color: var(--mark-alpha);
color: var(--color-charcoal-dark);
}
&--beta {
background-color: var(--mark-beta);
color: var(--color-charcoal-dark);
}
&--gamma {
background-color: var(--mark-gamma);
color: var(--color-charcoal-dark);
}
}

8
client/src/styles/css/typography.css
View File

@ -51,3 +51,11 @@
.text-link {
text-decoration: underline;
}
.default-link {
font-size: var(--slightly-small-font-size);
font-family: var(--sans-serif-font-family);
font-weight: var(--regular-font-weight);
cursor: pointer;
color: var(--color-brand);
}

2
client/src/styles/css/variables.css
View File

@ -16,6 +16,8 @@
--color-silver-dark: #aaaaaa;
--color-charcoal-dark: #333333;
--color-brand: #17a887;
--sans-serif-font-family: 'Montserrat', Arial, sans-serif;
--serif-font-family: 'ff-meta-serif-web-pro', serif;