Skip to content

Commit

Permalink
feat: upgrade qwik versions (#883)
Browse files Browse the repository at this point in the history 
* fix: qwik

* fix: frontend build errors
  • Loading branch information
@origranot
origranot authored Nov 2, 2024
1 parent 4fccacf commit 18066aa
Show file tree
Hide file tree
Showing 6 changed files with 1,310 additions and 1,037 deletions.
2 changes: 1 addition & 1 deletion apps/backend/src/core/users/dto/update.dto.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { IsBase64, IsOptional, IsString, MaxLength, MinLength } from 'class-validator';
import { IsOptional, IsString, MaxLength, MinLength } from 'class-validator';

export class UpdateDto {
@IsOptional()
Expand Down
132 changes: 66 additions & 66 deletions apps/frontend/src/components/dashboard/links/link-modal/link-modal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,69 +29,6 @@ interface CreateLinkInput {
utm_content?: string;
}

const CreateLinkInputSchema = z
.object({
url: z
.string({
required_error: "The url field can't be empty.",
})
.min(1, {
message: "The url field can't be empty.",
})
.regex(/^(?:https?:\/\/)?(?:[\w-]+\.)+[a-z]{2,}(?::\d{1,5})?(?:\/\S*)?$/, {
message: "The url you've entered is not valid",
}),
key: z
.string()
.max(20, { message: 'The short link cannot exceed 20 characters.' })
.regex(/^[a-zA-Z0-9-]*$/, {
message: 'The short link can only contain letters, numbers, and dashes.',
})
.optional()
.refine(
(val) => {
if (!val?.length) {
return true;
}
if (val?.length && val?.length < 4) {
return false;
}

return true;
},
{
message: 'The short link must be at least 4 characters long.',
}
),
expirationTime: z.string().optional(),
expirationTimeToggle: z.string().optional(),
passwordProtection: z
.string()
.min(6, {
message: 'Password must be at least 6 characters long.',
})
.max(25, {
message: 'Password must be at most 25 characters long.',
})
.optional(),
passwordProtectionToggle: z.string().optional(),
utmBuilderToggle: z.string().optional(),
utm_ref: z.string().max(100, { message: 'Referral (ref) must be at most 100 characters long' }).optional(),
utm_source: z.string().max(100, { message: 'UTM Source must be at most 100 characters long' }).optional(),
utm_medium: z.string().max(100, { message: 'UTM Medium must be at most 100 characters long' }).optional(),
utm_campaign: z.string().max(100, { message: 'UTM Campaign must be at most 100 characters long' }).optional(),
utm_term: z.string().max(100, { message: 'UTM Term must be at most 100 characters long' }).optional(),
utm_content: z.string().max(100, { message: 'UTM Content must be at most 100 characters long' }).optional(),
})
.refine((data) => !(data.expirationTimeToggle && !data.expirationTime), {
message: 'Please select a date for your link to expire.',
path: ['expirationTime'],
})
.refine((data) => !(data.passwordProtectionToggle && !data.passwordProtection), {
message: 'Please enter a password for your link.',
path: ['passwordProtection'],
});

type FieldErrors = Partial<Record<keyof CreateLinkInput, string[]>>;

const useCreateLink = globalAction$(
Expand Down Expand Up @@ -164,7 +101,70 @@ const useCreateLink = globalAction$(
key: data.key,
};
},
zod$(CreateLinkInputSchema)
zod$((z) =>
z
.object({
url: z
.string({
required_error: "The url field can't be empty.",
})
.min(1, {
message: "The url field can't be empty.",
})
.regex(/^(?:https?:\/\/)?(?:[\w-]+\.)+[a-z]{2,}(?::\d{1,5})?(?:\/\S*)?$/, {
message: "The url you've entered is not valid",
}),
key: z
.string()
.max(20, { message: 'The short link cannot exceed 20 characters.' })
.regex(/^[a-zA-Z0-9-]*$/, {
message: 'The short link can only contain letters, numbers, and dashes.',
})
.optional()
.refine(
(val) => {
if (!val?.length) {
return true;
}
if (val?.length && val?.length < 4) {
return false;
}

return true;
},
{
message: 'The short link must be at least 4 characters long.',
}
),
expirationTime: z.string().optional(),
expirationTimeToggle: z.string().optional(),
passwordProtection: z
.string()
.min(6, {
message: 'Password must be at least 6 characters long.',
})
.max(25, {
message: 'Password must be at most 25 characters long.',
})
.optional(),
passwordProtectionToggle: z.string().optional(),
utmBuilderToggle: z.string().optional(),
utm_ref: z.string().max(100, { message: 'Referral (ref) must be at most 100 characters long' }).optional(),
utm_source: z.string().max(100, { message: 'UTM Source must be at most 100 characters long' }).optional(),
utm_medium: z.string().max(100, { message: 'UTM Medium must be at most 100 characters long' }).optional(),
utm_campaign: z.string().max(100, { message: 'UTM Campaign must be at most 100 characters long' }).optional(),
utm_term: z.string().max(100, { message: 'UTM Term must be at most 100 characters long' }).optional(),
utm_content: z.string().max(100, { message: 'UTM Content must be at most 100 characters long' }).optional(),
})
.refine((data) => !(data.expirationTimeToggle && !data.expirationTime), {
message: 'Please select a date for your link to expire.',
path: ['expirationTime'],
})
.refine((data) => !(data.passwordProtectionToggle && !data.passwordProtection), {
message: 'Please enter a password for your link.',
path: ['passwordProtection'],
})
)
);

export interface LinkModalProps {
Expand Down Expand Up @@ -271,7 +271,7 @@ export const LinkModal = component$(({ onSubmitHandler }: LinkModalProps) => {
id={LINK_MODAL_ID}
class="modal fixed inset-0 z-40 m-auto max-h-fit w-full border border-gray-400 dark:border-gray-700 bg-white dark:bg-dark-modal p-0 shadow-xl sm:rounded-2xl max-w-screen-lg block h-auto"
>
<div class="grid grid-cols-1 md:grid-cols-2 max-h-[95vh] divide-x divide-gray-100 dark:divide-gray-700 overflow-auto md:overflow-hidden">
<div class="grid grid-cols-1 md:grid-cols-2 max-h-[95vh] divide-x divide-gray-100 dark:divide-gray-700 overflow-auto md:overflow-hidden w-full">
<div class="rounded-l-2xl md:max-h-[95vh] flex flex-col">
<div class="sticky top-0 z-10 flex h-16 items-center justify-center border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-dark-modal px-5 sm:h-28">
<img src={faviconUrl.value || UNKNOWN_FAVICON} alt="Favicon" class="mr-4 w-8 h-8" />
Expand Down Expand Up @@ -605,7 +605,7 @@ export const LinkModal = component$(({ onSubmitHandler }: LinkModalProps) => {
</Form>
</div>
<div class="rounded-r-2xl md:max-h-[95vh] flex flex-col">
<div class="sticky top-0 z-10 flex !h-14 min-h-14 items-center justify-center border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-dark-modal px-5 sm:h-24 sm:min-h-24">
<div class="sticky top-0 z-10 flex h-16 min-h-16 items-center justify-center border-b border-gray-200 dark:border-gray-700 bg-white dark:bg-dark-modal px-5 sm:h-28">
<h2 class="text-lg font-medium">Social Previews</h2>
</div>
<div class="items-center justify-center space-y-4 bg-gray-100 dark:bg-slate-900 p-5 overflow-auto">
Expand Down
2 changes: 1 addition & 1 deletion apps/frontend/src/routes/dashboard/settings/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ export const updateProfile = globalAction$(
message: 'Display name must be less than 25 characters',
}),
profilePicture: z
.any()
.string()
.optional()
.transform((value) => {
// If value is not base 64 return undefined
Expand Down
2 changes: 0 additions & 2 deletions apps/frontend/vite.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import { qwikVite } from '@builder.io/qwik/optimizer';
import { qwikCity } from '@builder.io/qwik-city/vite';
import { defineConfig, loadEnv } from 'vite';
import tsconfigPaths from 'vite-tsconfig-paths';
import { qwikNxVite } from 'qwik-nx/plugins';
import path from 'path';

export default defineConfig(({ mode }) => {
Expand All @@ -15,7 +14,6 @@ export default defineConfig(({ mode }) => {
},
cacheDir: '../../node_modules/.vite/apps/frontend',
plugins: [
qwikNxVite(),
qwikCity(),
qwikVite({
client: {
Expand Down
Loading

0 comments on commit 18066aa

Please sign in to comment.