Skip to content

Commit

Permalink
Merge branch 'develop' into footer/nav-routing
Browse files Browse the repository at this point in the history
  • Loading branch information
@NiallJoeMaher
NiallJoeMaher authored Oct 16, 2024
2 parents 9f442d2 + 4c064e9 commit a4d69c1
Show file tree
Hide file tree
Showing 18 changed files with 694 additions and 102 deletions.
63 changes: 36 additions & 27 deletions app/(app)/create/[[...paramsArr]]/_client.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,9 @@ import copy from "copy-to-clipboard";
import { PostStatus, getPostStatus, isValidScheduleTime } from "@/utils/post";
import { ImageUp, LoaderCircle } from "lucide-react";
import { uploadFile } from "@/utils/s3helpers";
import { type Session } from "next-auth";
import { getUploadUrl } from "@/app/actions/getUploadUrl";

const Create = ({ session }: { session: Session }) => {
const Create = () => {
const params = useParams();
const router = useRouter();

Expand Down Expand Up @@ -71,29 +71,40 @@ const Create = ({ session }: { session: Session }) => {
const file = e.target.files[0];
const { size, type } = file;

await getUploadUrl(
{ size, type, config: { kind: "uploads", userId: session.user?.id } },
{
onError(error) {
setUploadStatus("error");
if (error) return toast.error(error.message);
return toast.error(
"Something went wrong uploading the photo, please retry.",
);
},
async onSuccess(signedUrl) {
const { fileLocation } = await uploadFile(signedUrl, file);
if (!fileLocation) {
setUploadStatus("error");
return toast.error(
"Something went wrong uploading the photo, please retry.",
);
}
setUploadStatus("success");
setUploadUrl(fileLocation);
},
},
);
try {
const res = await getUploadUrl({
size,
type,
uploadType: "uploads",
});

const signedUrl = res?.data;

if (!signedUrl) {
setUploadStatus("error");
return toast.error(
"Something went wrong uploading the photo, please retry.",
);
}

const { fileLocation } = await uploadFile(signedUrl, file);
if (!fileLocation) {
setUploadStatus("error");
return toast.error(
"Something went wrong uploading the photo, please retry.",
);
}
setUploadStatus("success");
setUploadUrl(fileLocation);
} catch (error) {
setUploadStatus("error");
toast.error(
error instanceof Error
? error.message
: "An error occurred while uploading the image.",
);
Sentry.captureException(error);
}
}
};

Expand Down Expand Up @@ -162,8 +173,6 @@ const Create = ({ session }: { session: Session }) => {
},
);

const { mutate: getUploadUrl } = api.event.getUploadUrl.useMutation();

const PREVIEW_URL = `${process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://www.codu.co"}/draft/${postId}`;
const UPLOADED_IMAGE_URL = `![Image description](${uploadUrl})`;

Expand Down
267 changes: 267 additions & 0 deletions app/(app)/jobs/create/_client.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,267 @@
"use client";

import { Button } from "@/components/ui-components/button";
import {
Checkbox,
CheckboxField,
CheckboxGroup,
} from "@/components/ui-components/checkbox";
import { Divider } from "@/components/ui-components/divider";
import { Description, Field, Label } from "@/components/ui-components/fieldset";
import { Heading, Subheading } from "@/components/ui-components/heading";
import { Input } from "@/components/ui-components/input";
import {
Radio,
RadioField,
RadioGroup,
} from "@/components/ui-components/radio";
import { Strong, Text } from "@/components/ui-components/text";
import { Textarea } from "@/components/ui-components/textarea";
import { FEATURE_FLAGS, isFlagEnabled } from "@/utils/flags";
import Image from "next/image";
import { notFound } from "next/navigation";
import React, { useRef, useState } from "react";

export default function Content() {
const flagEnabled = isFlagEnabled(FEATURE_FLAGS.JOBS);
const fileInputRef = useRef<HTMLInputElement>(null);
const [imgUrl, setImgUrl] = useState<string | null>(null);

if (!flagEnabled) {
notFound();
}

return (
<form className="mx-auto max-w-4xl p-3 pt-8 sm:px-4">
<Heading level={1}>Post a job</Heading>
<Divider className="my-10 mt-6" />
<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Company Logo</Subheading>
<Text>Square format is best</Text>
</div>
<Field>
<div className="flex items-center space-x-4">
<Image
src={imgUrl || "/images/company_placeholder.png"}
width={80}
height={80}
alt="Company Logo"
className="rounded-[10px]"
/>
<div>
<Button
color="dark/white"
className="mt-3 rounded-md"
onClick={() => {
fileInputRef.current?.click();
}}
>
Change Logo
</Button>
<Input
type="file"
id="file-input"
name="company-logo"
accept="image/png, image/gif, image/jpeg"
onChange={() => {}}
className="hidden"
ref={fileInputRef}
/>
<Text className="mt-1 text-xs text-gray-500">
JPG, GIF or PNG. 1MB max.
</Text>
</div>
</div>
</Field>
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Company Name</Subheading>
<Text>This will be shown in the format you type it</Text>
</div>
<Field>
<Input
id="company-name"
type="text"
placeholder="Pixel Pulse Studios"
autoComplete="given-company-name"
/>
</Field>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Job Title</Subheading>
<Text>The job title for the position that you are opening</Text>
</div>
<Field>
<Input
id="job-title"
type="text"
placeholder="Reality Architect"
autoComplete="given-job-title"
/>
</Field>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Job Description</Subheading>
<Text>In markdown format</Text>
</div>
<Field>
<Textarea
id="job-description"
placeholder="As a Reality Architect, you'll be at the forefront of creating immersive mixed reality experiences that blur the line between the digital and physical..."
resizable={false}
rows={3}
/>
</Field>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Locations</Subheading>
<Text>
Where is the job location? (“Dublin”, “Remote USA”, “Anywhere”).
</Text>
</div>
<Field>
<Input placeholder="Dublin (2 days in the office per week)" />
<CheckboxGroup className="mt-3">
<CheckboxField>
<Checkbox name="remote" value="is_remote" />
<Label>Work is remote</Label>
</CheckboxField>
<CheckboxField>
<Checkbox name="relocation" value="is_relocation_package" />
<Label>Relocation package given</Label>
</CheckboxField>
<CheckboxField>
<Checkbox name="visa" value="is_visa_sponsored" />
<Label>Visa sponsorship provided</Label>
</CheckboxField>
</CheckboxGroup>
</Field>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Application form URL</Subheading>
<Text>A link to your website (optional)</Text>
</div>
<Field>
<Input
id="app-url"
type="text"
autoComplete="url"
placeholder="https://example.com"
/>
</Field>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Job Type</Subheading>
<Text>Full-time, part-time or freelancer</Text>
</div>
<Field>
<RadioGroup defaultValue="full_time">
<RadioField>
<Radio value="full_time" />
<Label>Full-time (€150)</Label>
<Description>Salaried Position</Description>
</RadioField>
<RadioField>
<Radio value="part_time" />
<Label>Part-time (€100)</Label>
<Description>
Salaried position but less than 4 days per week
</Description>
</RadioField>
<RadioField>
<Radio value="freelancer" />
<Label>Freelancer (€100)</Label>
<Description>Shorter-term usually or fixed term/job</Description>
</RadioField>
<RadioField>
<Radio value="other_role_type" />
<Label>Other (€100)</Label>
<Description>
Looking for a co-founder or something else we haven’t thought of
</Description>
</RadioField>
</RadioGroup>
</Field>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<section className="grid gap-x-8 gap-y-6 sm:grid-cols-2">
<div className="space-y-1">
<Subheading level={2}>Terms & Conditions</Subheading>
<Text>Ah yes, the fine print.</Text>
</div>
<div className="space-y-2">
<Text>
By submitting this job listing, I acknowledge and agree to the
following terms:
</Text>
<Text>
<Strong>Content Restrictions:</Strong> My listing must not contain:{" "}
<br />- Adult or explicit content <br />- Fraudulent or illegitimate
work opportunities <br />- Inappropriate or offensive language
</Text>
<Text>
<Strong>Accurate Classification: </Strong>I confirm that the job
type (e.g., full-time, part-time, freelance) is correctly
categorized.
</Text>
<Text>
<Strong>Removal Policy:</Strong> I understand that my listing may be
removed without notice if it violates any of the above conditions.
</Text>
<Text>
<Strong>Refund Policy:</Strong> If my listing is removed due to a
violation within 7 days of posting, I may be eligible for a refund,
subject to review.
</Text>
<Text>
<Strong>Compliance:</Strong> I agree to comply with all applicable
laws and regulations regarding job postings and employment
practices.
</Text>
</div>
{/* Add error part after validation here */}
</section>

<Divider className="my-10" soft />

<div className="flex justify-end">
<Button className="rounded-md" color="pink">
Submit and checkout
</Button>
</div>
</form>
);
}
7 changes: 7 additions & 0 deletions app/(app)/jobs/create/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import Content from "./_client";

function page() {
return <Content />;
}

export default page;
Loading

0 comments on commit a4d69c1

Please sign in to comment.