Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Project details section add to mapper frontend bottom sheet #1994

Merged
merged 4 commits into from
Dec 16, 2024
+53 −5
Merged

Project details section add to mapper frontend bottom sheet #1994

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c523fc1
fix(more): if not instructions, show message
NSUWAL123 Dec 16, 2024
fbdfcab
fix(page): margin remove from h5
NSUWAL123 Dec 16, 2024
6433fee
fix(more): project information stack add
NSUWAL123 Dec 16, 2024
eae07c9
feat(project-info): project information section add
NSUWAL123 Dec 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 18 additions & 5 deletions src/mapper/src/lib/components/more/index.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,17 @@
import Editor from '$lib/components/editor/editor.svelte';
import Comment from '$lib/components/more/comment.svelte';
import Activities from '$lib/components/more/activities.svelte';
import ProjectInfo from '$lib/components/more/project-info.svelte';
import { getTaskStore } from '$store/tasks.svelte.ts';
import type { ProjectData, TaskEventType } from '$lib/types';

type stackType = '' | 'Comment' | 'Instructions' | 'Activities';
type stackType = '' | 'Comment' | 'Instructions' | 'Activities' | 'Project Information';

const stackGroup: { icon: string; title: stackType }[] = [
{
icon: 'info-circle',
title: 'Project Information',
},
{
icon: 'chat',
title: 'Comment',
Expand All @@ -24,7 +30,7 @@
type Props = {
projectData: ProjectData;
zoomToTask: (taskId: number) => void;
}
};

let { projectData, zoomToTask }: Props = $props();
const taskStore = getTaskStore();
Expand Down Expand Up @@ -88,15 +94,22 @@
<p class="text-[1.125rem] font-barlow-semibold">{activeStack}</p>
</div>
{/if}

<!-- body -->
{#if activeStack === 'Comment'}
<Comment {comments} projectId={projectData?.id} />
{/if}

{#if activeStack === 'Instructions'}
<Editor editable={false} content={projectData?.per_task_instructions} />
{#if projectData?.per_task_instructions}
<Editor editable={false} content={projectData?.per_task_instructions} />
{:else}
<div class="flex justify-center mt-10">
<p class="text-[#484848] text-base">No Instructions</p>
</div>
{/if}
{/if}
{#if activeStack === 'Activities'}
<Activities {taskEvents} zoomToTask={zoomToTask} />
<Activities {taskEvents} {zoomToTask} />
{/if}
{#if activeStack === 'Project Information'}<ProjectInfo {projectData} />{/if}
</div>
31 changes: 31 additions & 0 deletions src/mapper/src/lib/components/more/project-info.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
<script lang="ts">
type descriptionType = {
key: string;
value: string;
};

const { projectData } = $props();

const descriptionList: descriptionType[] = [
{ key: 'Project ID', value: projectData?.id },
{ key: 'Total Tasks', value: projectData?.tasks?.length },
{ key: 'Organization Name', value: projectData?.organisation_name },
];
</script>

<h5 class="text-lg text-[#333333] font-barlow-semibold mb-6 mt-3">{projectData?.name}</h5>
<div class="flex flex-col gap-3">
<h5 class="text-base text-[#D73F3F] font-barlow-semibold">Description</h5>
<p class="text-sm text-[#2B2B2B] font-barlow-regular">{projectData?.description}</p>
<div class="flex flex-col gap-2">
{#each descriptionList as description}
<div class="grid grid-cols-2">
<p class="text-sm text-[#2B2B2B] font-barlow-regular">{description.key}</p>
<p class="text-sm text-[#161616] font-barlow-semibold">
<span class="px-2">:</span>
{description?.value || '-'}
</p>
</div>
{/each}
</div>
</div>
4 changes: 4 additions & 0 deletions src/mapper/src/styles/page.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,3 +40,7 @@
p {
margin: 0px;
}

h5 {
margin: 0;
}
Loading