From cab78245105b913d36b319c3568f25fa5d38d367 Mon Sep 17 00:00:00 2001 From: Sean Morley Date: Fri, 12 Jul 2024 22:07:36 -0400 Subject: [PATCH 1/4] refactor: Update API endpoint for fetching visited adventures --- backend/server/adventures/views.py | 10 ++ docker-compose.yml | 8 +- frontend/src/routes/+page.svelte | 2 +- frontend/src/routes/map/+page.server.ts | 2 +- frontend/src/routes/planner/+page.server.ts | 28 ----- frontend/src/routes/planner/+page.svelte | 111 -------------------- frontend/src/routes/visited/+page.server.ts | 28 ----- frontend/src/routes/visited/+page.svelte | 96 ----------------- 8 files changed, 16 insertions(+), 269 deletions(-) delete mode 100644 frontend/src/routes/planner/+page.server.ts delete mode 100644 frontend/src/routes/planner/+page.svelte delete mode 100644 frontend/src/routes/visited/+page.server.ts delete mode 100644 frontend/src/routes/visited/+page.svelte diff --git a/backend/server/adventures/views.py b/backend/server/adventures/views.py index f7a27308..349c80ee 100644 --- a/backend/server/adventures/views.py +++ b/backend/server/adventures/views.py @@ -61,6 +61,16 @@ class AdventureViewSet(viewsets.ModelViewSet): queryset = queryset.order_by(lower_name) adventures = self.paginate_and_respond(queryset, request) return adventures + + @action(detail=False, methods=['get']) + def all(self, request): + # return error if user is not authenticated + if not request.user.is_authenticated: + return Response({"error": "User is not authenticated"}, status=400) + queryset = Adventure.objects.filter(user_id=request.user.id).exclude(type='featured') + serializer = self.get_serializer(queryset, many=True) + return Response(serializer.data) + def paginate_and_respond(self, queryset, request): paginator = self.pagination_class() diff --git a/docker-compose.yml b/docker-compose.yml index 90e3194f..7ffadebf 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -2,8 +2,8 @@ version: "3.9" services: web: - build: ./frontend/ - #image: ghcr.io/seanmorley15/adventurelog-frontend:latest + #build: ./frontend/ + image: ghcr.io/seanmorley15/adventurelog-frontend:latest environment: - PUBLIC_SERVER_URL=http://server:8000 - ORIGIN=http://localhost:8080 @@ -23,8 +23,8 @@ services: - postgres_data:/var/lib/postgresql/data/ server: - build: ./backend/ - #image: ghcr.io/seanmorley15/adventurelog-backend:latest + #build: ./backend/ + image: ghcr.io/seanmorley15/adventurelog-backend:latest environment: - PGHOST=db - PGDATABASE=database diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte index 7f28dc99..56118574 100644 --- a/frontend/src/routes/+page.svelte +++ b/frontend/src/routes/+page.svelte @@ -40,7 +40,7 @@

-
diff --git a/frontend/src/routes/map/+page.server.ts b/frontend/src/routes/map/+page.server.ts index 44e935cc..24659520 100644 --- a/frontend/src/routes/map/+page.server.ts +++ b/frontend/src/routes/map/+page.server.ts @@ -8,7 +8,7 @@ export const load = (async (event) => { if (!event.locals.user) { return redirect(302, '/login'); } else { - let visitedFetch = await fetch(`${endpoint}/api/adventures/`, { + let visitedFetch = await fetch(`${endpoint}/api/adventures/all/`, { headers: { Cookie: `${event.cookies.get('auth')}` } diff --git a/frontend/src/routes/planner/+page.server.ts b/frontend/src/routes/planner/+page.server.ts deleted file mode 100644 index fcdc109e..00000000 --- a/frontend/src/routes/planner/+page.server.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { redirect } from '@sveltejs/kit'; -import type { PageServerLoad } from './$types'; -const PUBLIC_SERVER_URL = process.env['PUBLIC_SERVER_URL']; -import type { Adventure } from '$lib/types'; -const endpoint = PUBLIC_SERVER_URL || 'http://localhost:8000'; - -export const load = (async (event) => { - if (!event.locals.user) { - return redirect(302, '/login'); - } else { - let plannedFetch = await fetch(`${endpoint}/api/adventures/planned/`, { - headers: { - Cookie: `${event.cookies.get('auth')}` - } - }); - if (!plannedFetch.ok) { - console.error('Failed to fetch planned adventures'); - return redirect(302, '/login'); - } else { - let planned = (await plannedFetch.json()) as Adventure[]; - return { - props: { - planned - } - }; - } - } -}) satisfies PageServerLoad; diff --git a/frontend/src/routes/planner/+page.svelte b/frontend/src/routes/planner/+page.svelte deleted file mode 100644 index 00d216fd..00000000 --- a/frontend/src/routes/planner/+page.svelte +++ /dev/null @@ -1,111 +0,0 @@ - - -{#if isShowingCreateModal} - (isShowingCreateModal = false)} - /> -{/if} - -{#if isEditModalOpen} - (isEditModalOpen = false)} - on:saveEdit={saveEdit} - /> -{/if} - -
-
-
-
- -
- -
    -

    Create new...

    - - -
-
-
-
- -{#if adventures.length > 0} -

Planned Adventures

-{/if} - -
- {#each adventures as adventure} - - {/each} -
- -{#if adventures.length === 0} -
-
-
- Lost -
-

- No planned adventures found -

-

- There are no adventures to display. Add some using the plus button at the bottom right! -

-
-
-{/if} diff --git a/frontend/src/routes/visited/+page.server.ts b/frontend/src/routes/visited/+page.server.ts deleted file mode 100644 index 1ff64322..00000000 --- a/frontend/src/routes/visited/+page.server.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { redirect } from '@sveltejs/kit'; -import type { PageServerLoad } from './$types'; -const PUBLIC_SERVER_URL = process.env['PUBLIC_SERVER_URL']; -import type { Adventure } from '$lib/types'; -const endpoint = PUBLIC_SERVER_URL || 'http://localhost:8000'; - -export const load = (async (event) => { - if (!event.locals.user) { - return redirect(302, '/login'); - } else { - let visitedFetch = await fetch(`${endpoint}/api/adventures/visited/`, { - headers: { - Cookie: `${event.cookies.get('auth')}` - } - }); - if (!visitedFetch.ok) { - console.error('Failed to fetch visited adventures'); - return redirect(302, '/login'); - } else { - let visited = (await visitedFetch.json()) as Adventure[]; - return { - props: { - visited - } - }; - } - } -}) satisfies PageServerLoad; diff --git a/frontend/src/routes/visited/+page.svelte b/frontend/src/routes/visited/+page.svelte deleted file mode 100644 index 3a8a8dec..00000000 --- a/frontend/src/routes/visited/+page.svelte +++ /dev/null @@ -1,96 +0,0 @@ - - -{#if isShowingCreateModal} - (isShowingCreateModal = false)} - /> -{/if} - -{#if isEditModalOpen} - (isEditModalOpen = false)} - on:saveEdit={saveEdit} - /> -{/if} - -
-
-
-
- -
- -
    -

    Create new...

    - - -
-
-
-
- -{#if adventures.length > 0} -

Visited Adventures

-{:else} - -{/if} - -
- {#each adventures as adventure} - - {/each} -
From 82db6f1789d5557654aa2515c571038c1b1e0d71 Mon Sep 17 00:00:00 2001 From: Sean Morley Date: Sat, 13 Jul 2024 10:28:45 -0400 Subject: [PATCH 2/4] sorting server side --- backend/server/adventures/views.py | 40 +++++++--- frontend/src/lib/components/Avatar.svelte | 2 +- frontend/src/lib/components/Navbar.svelte | 6 -- .../src/routes/adventures/+page.server.ts | 3 +- frontend/src/routes/adventures/+page.svelte | 76 +++++++++++++------ frontend/src/routes/featured/+page.server.ts | 28 ------- frontend/src/routes/featured/+page.svelte | 23 ------ 7 files changed, 85 insertions(+), 93 deletions(-) delete mode 100644 frontend/src/routes/featured/+page.server.ts delete mode 100644 frontend/src/routes/featured/+page.svelte diff --git a/backend/server/adventures/views.py b/backend/server/adventures/views.py index 349c80ee..f04ff1cc 100644 --- a/backend/server/adventures/views.py +++ b/backend/server/adventures/views.py @@ -27,13 +27,37 @@ class AdventureViewSet(viewsets.ModelViewSet): permission_classes = [IsOwnerOrReadOnly, IsPublicReadOnly] pagination_class = StandardResultsSetPagination + def apply_sorting(self, queryset): + order_by = self.request.query_params.get('order_by', 'name') + order_direction = self.request.query_params.get('order_direction', 'asc') + + valid_order_by = ['name', 'type', 'date', 'rating'] + if order_by not in valid_order_by: + order_by = 'name' + + if order_direction not in ['asc', 'desc']: + order_direction = 'asc' + + # Apply case-insensitive sorting for the 'name' field + if order_by == 'name': + queryset = queryset.annotate(lower_name=Lower('name')) + ordering = 'lower_name' + else: + ordering = order_by + + if order_direction == 'desc': + ordering = f'-{ordering}' + + print(f"Ordering by: {ordering}") # For debugging + + return queryset.order_by(ordering) + def get_queryset(self): - lower_name = Lower('name') queryset = Adventure.objects.annotate( ).filter( Q(is_public=True) | Q(user_id=self.request.user.id) - ).order_by(lower_name) # Sort by the annotated lowercase name - return queryset + ) + return self.apply_sorting(queryset) def perform_create(self, serializer): serializer.save(user_id=self.request.user) @@ -57,20 +81,17 @@ class AdventureViewSet(viewsets.ModelViewSet): queryset |= Adventure.objects.filter( type='featured', is_public=True, trip=None) - lower_name = Lower('name') - queryset = queryset.order_by(lower_name) + queryset = self.apply_sorting(queryset) adventures = self.paginate_and_respond(queryset, request) return adventures @action(detail=False, methods=['get']) def all(self, request): - # return error if user is not authenticated if not request.user.is_authenticated: return Response({"error": "User is not authenticated"}, status=400) queryset = Adventure.objects.filter(user_id=request.user.id).exclude(type='featured') - serializer = self.get_serializer(queryset, many=True) - return Response(serializer.data) - + queryset = self.apply_sorting(queryset) + return self.paginate_and_respond(queryset, request) def paginate_and_respond(self, queryset, request): paginator = self.pagination_class() @@ -80,7 +101,6 @@ class AdventureViewSet(viewsets.ModelViewSet): return paginator.get_paginated_response(serializer.data) serializer = self.get_serializer(queryset, many=True) return Response(serializer.data) - class TripViewSet(viewsets.ModelViewSet): serializer_class = TripSerializer permission_classes = [IsOwnerOrReadOnly, IsPublicReadOnly] diff --git a/frontend/src/lib/components/Avatar.svelte b/frontend/src/lib/components/Avatar.svelte index b1d35d83..bb3833e3 100644 --- a/frontend/src/lib/components/Avatar.svelte +++ b/frontend/src/lib/components/Avatar.svelte @@ -30,7 +30,7 @@

Hi, {user.first_name} {user.last_name}

    • -
    • +
    • diff --git a/frontend/src/lib/components/Navbar.svelte b/frontend/src/lib/components/Navbar.svelte index 42e36aef..f8609ff4 100644 --- a/frontend/src/lib/components/Navbar.svelte +++ b/frontend/src/lib/components/Navbar.svelte @@ -58,9 +58,6 @@
    • -
  • - -
    • @@ -90,9 +87,6 @@ -
  • - -
    • diff --git a/frontend/src/routes/adventures/+page.server.ts b/frontend/src/routes/adventures/+page.server.ts index 0a0c0a97..46259183 100644 --- a/frontend/src/routes/adventures/+page.server.ts +++ b/frontend/src/routes/adventures/+page.server.ts @@ -493,7 +493,8 @@ export const actions: Actions = { adventures, next, previous, - count + count, + page } }; } catch (error) { diff --git a/frontend/src/routes/adventures/+page.svelte b/frontend/src/routes/adventures/+page.svelte index c54cd1ba..d46a1cd4 100644 --- a/frontend/src/routes/adventures/+page.svelte +++ b/frontend/src/routes/adventures/+page.svelte @@ -20,10 +20,13 @@ let resultsPerPage: number = 10; + let currentView: string = 'cards'; + let next: string | null = data.props.next || null; let previous: string | null = data.props.previous || null; let count = data.props.count || 0; let totalPages = Math.ceil(count / resultsPerPage); + let currentPage: number = 1; function handleChangePage() { return async ({ result }: any) => { @@ -33,6 +36,7 @@ next = result.data.body.next; previous = result.data.body.previous; count = result.data.body.count; + currentPage = result.data.body.page; totalPages = Math.ceil(count / resultsPerPage); } }; @@ -52,6 +56,7 @@ previous = result.data.previous; count = result.data.count; totalPages = Math.ceil(count / resultsPerPage); + console.log(next); } } @@ -175,31 +180,35 @@ > {sidebarOpen ? 'Close Filters' : 'Open Filters'} -
    - {#each adventures as adventure} - - {/each} -
    -
    -
    - {#if next || previous} -
    - {#each Array.from({ length: totalPages }, (_, i) => i + 1) as page} - - - - - - - {/each} -
    - {/if} + {#if currentView == 'cards'} +
    + {#each adventures as adventure} + + {/each}
    + {/if} +
    + {#if next || previous} +
    + {#each Array.from({ length: totalPages }, (_, i) => i + 1) as page} +
    + + + + {#if currentPage != page} + + {:else} + + {/if} +
    + {/each} +
    + {/if}
    @@ -261,6 +270,25 @@ on:click={() => sort({ attribute: 'name', order: 'desc' })} /> +
    +

    View

    +
    + (currentView = 'cards')} + checked + /> + (currentView = 'table')} + /> +
    diff --git a/frontend/src/routes/featured/+page.server.ts b/frontend/src/routes/featured/+page.server.ts deleted file mode 100644 index 1d3d4db0..00000000 --- a/frontend/src/routes/featured/+page.server.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { redirect } from '@sveltejs/kit'; -import type { PageServerLoad } from './$types'; -const PUBLIC_SERVER_URL = process.env['PUBLIC_SERVER_URL']; -import type { Adventure } from '$lib/types'; -const endpoint = PUBLIC_SERVER_URL || 'http://localhost:8000'; - -export const load = (async (event) => { - if (!event.locals.user) { - return redirect(302, '/login'); - } else { - let visitedFetch = await fetch(`${endpoint}/api/adventures/featured/`, { - headers: { - Cookie: `${event.cookies.get('auth')}` - } - }); - if (!visitedFetch.ok) { - console.error('Failed to fetch featured adventures'); - return redirect(302, '/login'); - } else { - let featured = (await visitedFetch.json()) as Adventure[]; - return { - props: { - featured - } - }; - } - } -}) satisfies PageServerLoad; diff --git a/frontend/src/routes/featured/+page.svelte b/frontend/src/routes/featured/+page.svelte deleted file mode 100644 index 3ee5473c..00000000 --- a/frontend/src/routes/featured/+page.svelte +++ /dev/null @@ -1,23 +0,0 @@ - - -

    Featured Adventures

    -
    - {#each adventures as adventure} - - {/each} -
    - -{#if adventures.length === 0} -
    -

    No visited adventures yet!

    -
    -{/if} From f5fc2f5addc0329a88dc05615137bd0cf7e44dbb Mon Sep 17 00:00:00 2001 From: Sean Morley Date: Sat, 13 Jul 2024 10:42:42 -0400 Subject: [PATCH 3/4] client sorting --- .../src/routes/adventures/+page.server.ts | 7 +++- frontend/src/routes/adventures/+page.svelte | 38 +++++++++++++++---- 2 files changed, 36 insertions(+), 9 deletions(-) diff --git a/frontend/src/routes/adventures/+page.server.ts b/frontend/src/routes/adventures/+page.server.ts index 46259183..6bc12a7e 100644 --- a/frontend/src/routes/adventures/+page.server.ts +++ b/frontend/src/routes/adventures/+page.server.ts @@ -363,6 +363,11 @@ export const actions: Actions = { const planned = formData.get('planned'); const featured = formData.get('featured'); + const order_direction = formData.get('order_direction') as string; + const order_by = formData.get('order_by') as string; + + console.log(order_direction, order_by); + let adventures: Adventure[] = []; if (!event.locals.user) { @@ -399,7 +404,7 @@ export const actions: Actions = { console.log(filterString); let visitedFetch = await fetch( - `${serverEndpoint}/api/adventures/filtered?types=${filterString}`, + `${serverEndpoint}/api/adventures/filtered?types=${filterString}&order_by=${order_by}&order_direction=${order_direction}`, { headers: { Cookie: `${event.cookies.get('auth')}` diff --git a/frontend/src/routes/adventures/+page.svelte b/frontend/src/routes/adventures/+page.svelte index d46a1cd4..ab4a6381 100644 --- a/frontend/src/routes/adventures/+page.svelte +++ b/frontend/src/routes/adventures/+page.svelte @@ -252,22 +252,44 @@

    Sort

    - +

    Order Direction

    + sort({ attribute: 'name', order: 'asc' })} + value="asc" /> - + +
    +

    Order By

    + + + + + + sort({ attribute: 'name', order: 'desc' })} />
    From 586ea89785056f6cad2aa3f58d9ac00b73212e02 Mon Sep 17 00:00:00 2001 From: Sean Morley Date: Sat, 13 Jul 2024 10:48:51 -0400 Subject: [PATCH 4/4] client sorting --- backend/server/adventures/views.py | 4 ++-- frontend/src/routes/adventures/+page.svelte | 10 +++++----- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/backend/server/adventures/views.py b/backend/server/adventures/views.py index f04ff1cc..496ded22 100644 --- a/backend/server/adventures/views.py +++ b/backend/server/adventures/views.py @@ -90,8 +90,8 @@ class AdventureViewSet(viewsets.ModelViewSet): if not request.user.is_authenticated: return Response({"error": "User is not authenticated"}, status=400) queryset = Adventure.objects.filter(user_id=request.user.id).exclude(type='featured') - queryset = self.apply_sorting(queryset) - return self.paginate_and_respond(queryset, request) + serializer = self.get_serializer(queryset, many=True) + return Response(serializer.data) def paginate_and_respond(self, queryset, request): paginator = self.pagination_class() diff --git a/frontend/src/routes/adventures/+page.svelte b/frontend/src/routes/adventures/+page.svelte index ab4a6381..c9a83cd1 100644 --- a/frontend/src/routes/adventures/+page.svelte +++ b/frontend/src/routes/adventures/+page.svelte @@ -56,6 +56,7 @@ previous = result.data.previous; count = result.data.count; totalPages = Math.ceil(count / resultsPerPage); + currentPage = 1; console.log(next); } @@ -248,11 +249,9 @@ class="checkbox checkbox-primary" /> - - -
    +

    Sort

    -

    Order Direction

    +

    Order Direction


    -

    Order By

    +

    Order By

    +

    View