Skip to content

Commit

Permalink
Merge pull request #90 from s1lvax/feature/discord-call-to-action
Browse files Browse the repository at this point in the history
Improvements to Index
  • Loading branch information
s1lvax authored Oct 24, 2024
2 parents 9809e64 + ab5a805 commit b745782
Show file tree
Hide file tree
Showing 7 changed files with 154 additions and 10 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ Route is a platform that allows users to easily share their favourite links, tec

![Route Logo](https://i.imgur.com/KtVWxtM.png)

[![Chat](https://img.shields.io/discord/1003691521280856084?label=chat&logo=discord&color=7289da)](https://discord.gg/m69DSNbu)
[![Chat](https://img.shields.io/discord/1003691521280856084?label=chat&logo=discord&color=7289da)](https://discord.gg/9XuRcaZR)

## 🎮 Features

Expand Down
34 changes: 34 additions & 0 deletions src/lib/components/Index/CTA.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,44 @@
<Button href="/profile" class="flex items-center space-x-2"
><UserPen /> <span>My Profile</span></Button
>
<Button
href="https://discord.gg/9XuRcaZR"
target="_blank"
class="flex items-center space-x-2"
variant="secondary"
><svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="currentColor"
class="icon icon-tabler icons-tabler-filled icon-tabler-brand-discord"
><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path
d="M14.983 3l.123 .006c2.014 .214 3.527 .672 4.966 1.673a1 1 0 0 1 .371 .488c1.876 5.315 2.373 9.987 1.451 12.28c-1.003 2.005 -2.606 3.553 -4.394 3.553c-.732 0 -1.693 -.968 -2.328 -2.045a21.512 21.512 0 0 0 2.103 -.493a1 1 0 1 0 -.55 -1.924c-3.32 .95 -6.13 .95 -9.45 0a1 1 0 0 0 -.55 1.924c.717 .204 1.416 .37 2.103 .494c-.635 1.075 -1.596 2.044 -2.328 2.044c-1.788 0 -3.391 -1.548 -4.428 -3.629c-.888 -2.217 -.39 -6.89 1.485 -12.204a1 1 0 0 1 .371 -.488c1.439 -1.001 2.952 -1.459 4.966 -1.673a1 1 0 0 1 .935 .435l.063 .107l.651 1.285l.137 -.016a12.97 12.97 0 0 1 2.643 0l.134 .016l.65 -1.284a1 1 0 0 1 .754 -.54l.122 -.009zm-5.983 7a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15zm6 0a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15z"
/></svg
> <span>Join the Community</span></Button
>
{:else}
<Button on:click={() => signIn('github')} class="flex items-center space-x-2"
><Github /> <span>Sign in with Github</span></Button
>
<Button
href="https://discord.gg/9XuRcaZR"
target="_blank"
class="flex items-center space-x-2"
variant="secondary"
><svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="currentColor"
class="icon icon-tabler icons-tabler-filled icon-tabler-brand-discord"
><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path
d="M14.983 3l.123 .006c2.014 .214 3.527 .672 4.966 1.673a1 1 0 0 1 .371 .488c1.876 5.315 2.373 9.987 1.451 12.28c-1.003 2.005 -2.606 3.553 -4.394 3.553c-.732 0 -1.693 -.968 -2.328 -2.045a21.512 21.512 0 0 0 2.103 -.493a1 1 0 1 0 -.55 -1.924c-3.32 .95 -6.13 .95 -9.45 0a1 1 0 0 0 -.55 1.924c.717 .204 1.416 .37 2.103 .494c-.635 1.075 -1.596 2.044 -2.328 2.044c-1.788 0 -3.391 -1.548 -4.428 -3.629c-.888 -2.217 -.39 -6.89 1.485 -12.204a1 1 0 0 1 .371 -.488c1.439 -1.001 2.952 -1.459 4.966 -1.673a1 1 0 0 1 .935 .435l.063 .107l.651 1.285l.137 -.016a12.97 12.97 0 0 1 2.643 0l.134 .016l.65 -1.284a1 1 0 0 1 .754 -.54l.122 -.009zm-5.983 7a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15zm6 0a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15z"
/></svg
> <span>Join the Community</span></Button
>
{/if}
</div>
</div>
Expand Down
37 changes: 33 additions & 4 deletions src/lib/components/Index/Hero.svelte
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<script lang="ts">
import { Button } from '$lib/components/ui/button';
import { Loader2, UserPen, Github, LogOut } from 'lucide-svelte';
import { signIn, signOut } from '@auth/sveltekit/client';
import { signIn } from '@auth/sveltekit/client';
import { page } from '$app/stores';
import { onMount } from 'svelte';
import { getReleaseVersion } from '$lib/utils/getReleaseVersion';
Expand Down Expand Up @@ -63,14 +63,43 @@
><UserPen /> <span>My Profile</span></Button
>
<Button
on:click={() => signOut()}
variant="destructive"
class="flex items-center space-x-2"><LogOut /> <span>Logout</span></Button
href="https://discord.gg/9XuRcaZR"
target="_blank"
class="flex items-center space-x-2"
variant="secondary"
><svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="currentColor"
class="icon icon-tabler icons-tabler-filled icon-tabler-brand-discord"
><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path
d="M14.983 3l.123 .006c2.014 .214 3.527 .672 4.966 1.673a1 1 0 0 1 .371 .488c1.876 5.315 2.373 9.987 1.451 12.28c-1.003 2.005 -2.606 3.553 -4.394 3.553c-.732 0 -1.693 -.968 -2.328 -2.045a21.512 21.512 0 0 0 2.103 -.493a1 1 0 1 0 -.55 -1.924c-3.32 .95 -6.13 .95 -9.45 0a1 1 0 0 0 -.55 1.924c.717 .204 1.416 .37 2.103 .494c-.635 1.075 -1.596 2.044 -2.328 2.044c-1.788 0 -3.391 -1.548 -4.428 -3.629c-.888 -2.217 -.39 -6.89 1.485 -12.204a1 1 0 0 1 .371 -.488c1.439 -1.001 2.952 -1.459 4.966 -1.673a1 1 0 0 1 .935 .435l.063 .107l.651 1.285l.137 -.016a12.97 12.97 0 0 1 2.643 0l.134 .016l.65 -1.284a1 1 0 0 1 .754 -.54l.122 -.009zm-5.983 7a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15zm6 0a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15z"
/></svg
> <span>Join the Community</span></Button
>
{:else}
<Button on:click={() => signIn('github')} class="flex items-center space-x-2"
><Github /> <span>Sign in with Github</span></Button
>
<Button
href="https://discord.gg/9XuRcaZR"
target="_blank"
class="flex items-center space-x-2"
variant="secondary"
><svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="currentColor"
class="icon icon-tabler icons-tabler-filled icon-tabler-brand-discord"
><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path
d="M14.983 3l.123 .006c2.014 .214 3.527 .672 4.966 1.673a1 1 0 0 1 .371 .488c1.876 5.315 2.373 9.987 1.451 12.28c-1.003 2.005 -2.606 3.553 -4.394 3.553c-.732 0 -1.693 -.968 -2.328 -2.045a21.512 21.512 0 0 0 2.103 -.493a1 1 0 1 0 -.55 -1.924c-3.32 .95 -6.13 .95 -9.45 0a1 1 0 0 0 -.55 1.924c.717 .204 1.416 .37 2.103 .494c-.635 1.075 -1.596 2.044 -2.328 2.044c-1.788 0 -3.391 -1.548 -4.428 -3.629c-.888 -2.217 -.39 -6.89 1.485 -12.204a1 1 0 0 1 .371 -.488c1.439 -1.001 2.952 -1.459 4.966 -1.673a1 1 0 0 1 .935 .435l.063 .107l.651 1.285l.137 -.016a12.97 12.97 0 0 1 2.643 0l.134 .016l.65 -1.284a1 1 0 0 1 .754 -.54l.122 -.009zm-5.983 7a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15zm6 0a2 2 0 0 0 -1.977 1.697l-.018 .154l-.005 .149l.005 .15a2 2 0 1 0 1.995 -2.15z"
/></svg
> <span>Join the Community</span></Button
>
{/if}
</div>
</div>
Expand Down
45 changes: 45 additions & 0 deletions src/lib/components/Index/OurUsers.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<script lang="ts">
import { formatDate } from '$lib/utils/formatDate';
import type { User } from '@prisma/client';
export let users: User[] = [];
</script>

<div class="mt-12 py-32 sm:py-24">
<div class="mx-auto grid max-w-7xl gap-20 px-6 lg:px-8 xl:grid-cols-3">
<div class="max-w-xl">
<div class="flex flex-col space-y-4">
<h2 class="text-pretty text-3xl font-semibold tracking-tight sm:text-4xl">
Meet some of our Users
</h2>
</div>
<p class="mt-6 text-lg leading-8 text-muted-foreground">
Explore the profile of some of our users
</p>
</div>
<ul role="list" class="grid gap-x-8 gap-y-12 sm:grid-cols-2 sm:gap-y-16 xl:col-span-2">
{#each users as user}
<a href="/{user.githubUsername}">
<li>
<div
class="flex items-center gap-x-6 transition-transform duration-300 ease-in-out hover:scale-105"
>
<img
class="h-16 w-16 rounded-full"
src="https://github.com/{user.githubUsername}.png"
alt="{user.githubUsername}'s avatar"
/>
<div>
<h3 class="text-base font-semibold leading-7 tracking-tight">
{user.githubUsername}
</h3>
<p class="text-sm font-semibold leading-6 text-muted-foreground">
Joined on the {formatDate(user.createdAt)}
</p>
</div>
</div>
</li>
</a>
{/each}
</ul>
</div>
</div>
11 changes: 7 additions & 4 deletions src/lib/utils/formatDate.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
export const formatDate = (dateInput: Date | string): string => {
// If input is a string, convert it to a Date object
const date = typeof dateInput === 'string' ? new Date(dateInput) : dateInput;

// Ensure the input is a valid date
// ensure the input is a valid date
if (isNaN(date.getTime())) {
throw new Error('Invalid date');
}

// Return formatted date and time
return date.toLocaleString();
// get data
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are 0-based, so add 1
const day = String(date.getDate()).padStart(2, '0');

return `${year}.${month}.${day}`;
};
28 changes: 28 additions & 0 deletions src/routes/+page.server.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import { prisma } from '$lib/server/prisma';
import type { PageServerLoad } from './$types';

export const load: PageServerLoad = async () => {
// Fetch 6 random users
const users = await prisma.user.findMany({
take: 6,
orderBy: {
id: 'asc'
},
where: {
id: {
in: (
await prisma.user.findMany({
select: { id: true },
orderBy: {
id: 'asc'
}
})
).map((user) => user.id)
}
}
});

return {
users
};
};
7 changes: 6 additions & 1 deletion src/routes/+page.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,18 @@
import Hero from '$lib/components/Index/Hero.svelte';
import Navbar from '$lib/components/Shared/Navbar.svelte';
import Cta from '$lib/components/Index/CTA.svelte';
import OurUsers from '$lib/components/Index/OurUsers.svelte';
import type { PageData } from './$types';
export let data: PageData;
</script>

<div class="flex flex-col">
<Navbar />
<Hero />
<Features />
<Contributors />
<OurUsers users={data.users} />
<Cta />
<Contributors />
<Footer />
</div>

0 comments on commit b745782

Please sign in to comment.