Skip to content

Commit

Permalink
Major cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
@zaaakher
zaaakher committed Nov 2, 2023
1 parent 6022a5c commit 0440441
Show file tree
Hide file tree
Showing 55 changed files with 172 additions and 345 deletions.
8 changes: 0 additions & 8 deletions components/blocks/Usage.tsx
View file
Expand Up @@ -33,14 +33,6 @@ export const Usage: FC<UsageCardTypes> = (props) => {
<div> ({props.percent}%)</div>
</div>
<Progress value={props.percent ?? 0} />
{/* <div className="hawa-mt-2 hawa-h-2.5 hawa-w-full hawa-rounded-full hawa-bg-gray-200 dark:hawa-bg-gray-700">
<div
className="hawa-h-2.5 hawa-rounded-full hawa-bg-primary"
style={{
width: `${props.percent ?? 0}%`,
}}
></div>
</div> */}
</div>
);
};
10 changes: 5 additions & 5 deletions components/blocks/feedback/FeedbackEmoji.tsx
View file
Expand Up @@ -41,8 +41,8 @@ export const FeedbackEmoji: FC<ComponentTypes> = (props) => {
return (
<div
className={cn(
"hawa-flex hawa-flex-col hawa-gap-2 hawa-rounded hawa-border hawa-p-2 hawa-transition-all",
selectedEmoji ? "hawa-h-[195px] hawa-min-w-fit" : "hawa-h-[44px] "
"hawa-flex hawa-flex-col hawa-rounded hawa-border hawa-p-2 hawa-transition-all",
selectedEmoji ? "hawa-h-[189px] hawa-min-w-fit" : "hawa-h-[44px] "
)}
>
<div className="hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-2 ">
Expand Down Expand Up @@ -98,13 +98,13 @@ export const FeedbackEmoji: FC<ComponentTypes> = (props) => {
</div>
</div>
) : (
<div className="hawa-flex hawa-flex-col hawa-gap-2">
<div className="hawa-flex hawa-flex-col hawa-gap-1 hawa-p-1">
<Popover
className="hawa-select-none hawa-p-1 hawa-text-xs "
open={helperText}
trigger={
<Textarea
className={cn("hawa-mb-2 hawa-h-full hawa-resize-none")}
className={cn("hawa-h-full hawa-resize-none hawa-mt-2")}
placeholder="Your feedback"
onChange={(e) => {
if (e.target.value) {
Expand All @@ -115,7 +115,7 @@ export const FeedbackEmoji: FC<ComponentTypes> = (props) => {
/>
}
>
<span className="hawa-m-2">Please enter your feedback</span>{" "}
<span className="hawa-m-0">Please enter your feedback</span>
</Popover>
<Button
isLoading={loadingSubmit}
Expand Down
3 changes: 1 addition & 2 deletions components/blocks/feedback/FeedbackForm.tsx
View file
Expand Up @@ -28,7 +28,7 @@ export const FeedbackForm: React.FC<FeedbackFormType> = (props) => {
const formSchema = z.object({
requestType: z
.string({ required_error: props.texts.requestTypeRequired })
.nonempty({ message: props.texts.requestTypeRequired }),
.min(1, { message: props.texts.requestTypeRequired }),
description: z
.string({ required_error: props.texts.descriptionRequired })
.min(10, { message: props.texts.descriptionTooShort }),
Expand All @@ -38,7 +38,6 @@ export const FeedbackForm: React.FC<FeedbackFormType> = (props) => {
resolver: zodResolver(formSchema),
});

// TODO: translate this and have texts object
return (
<Card>
<CardContent headless>
Expand Down
16 changes: 7 additions & 9 deletions components/blocks/feedback/FeedbackRating.tsx
View file
@@ -1,22 +1,20 @@
import React, { FC, useEffect, useRef, useState } from "react";
import clsx from "clsx";
import { Button } from "../../elements";
import { cn } from "../../util";

type ComponentTypes = {
title?: string;
question: string;
banner?: boolean;
options?: any[];
position?: "bottom-right" | "bottom-left";
onOptionClicked?: (option: any) => void;
texts?: {
least: string;
most: string;
};
position?: "bottom-right" | "bottom-left";
onOptionClicked?: (option: any) => void;
};

// TODO: add option to turn it into a banner

export const FeedbackRating: FC<ComponentTypes> = ({
position = "bottom-right",
...props
Expand Down Expand Up @@ -55,19 +53,19 @@ export const FeedbackRating: FC<ComponentTypes> = ({
return (
<div
ref={popUpRef}
className={clsx(
className={cn(
props.banner
? "hawa-w-full hawa-left-0 hawa-fixed hawa-bottom-0 hawa-px-0 md:hawa-px-4"
: "hawa-fixed hawa-bottom-4 ",
boxPosition[position]
)}
>
<div
className={clsx(
className={cn(
"hawa-relative hawa-flex hawa-w-full hawa-flex-col hawa-gap-2 hawa-rounded hawa-border hawa-bg-background hawa-p-4 hawa-shadow-md hawa-transition-all",
closed ? "hawa-opacity-0" : "hawa-opacity-100",
props.banner &&
"hawa-rounded-none md:hawa-rounded hawa-px-4 md:hawa-px-64"
"hawa-rounded-none md:hawa-rounded-t hawa-px-4 md:hawa-px-64"
)}
>
<div className="hawa-absolute hawa-left-2 hawa-top-2 hawa-p-1.5 hawa-text-sm">
Expand Down Expand Up @@ -115,7 +113,7 @@ export const FeedbackRating: FC<ComponentTypes> = ({
clearTimeout(timeoutDestroy);
}, 5300);
}}
className={clsx(
className={cn(
"hawa-w-full hawa-cursor-pointer hawa-rounded hawa-border hawa-p-4 hawa-text-center hawa-transition-all ",
clickedOption === op
? "hawa-bg-gray-500 hawa-text-white"
Expand Down
11 changes: 5 additions & 6 deletions components/blocks/feedback/UserReferralSource.tsx
View file
@@ -1,4 +1,9 @@
import React, { FC, useEffect, useRef, useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import * as z from "zod";
import { cn } from "../../util";
import { DirectionType } from "../../types/commonTypes";
import {
Button,
Radio,
Expand All @@ -7,12 +12,6 @@ import {
CardContent,
RadioOptionsTypes,
} from "../../elements";
import { cn } from "../../util";
import { Controller, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";

import * as z from "zod";
import { DirectionType } from "@/components/types/commonTypes";

type ComponentTypes = {
title?: string;
Expand Down
2 changes: 1 addition & 1 deletion components/blocks/misc/Announcement.tsx
View file
@@ -1,5 +1,5 @@
import React, { FC } from "react";
import { Card, CardContent, CardFooter, Button } from "../../elements";
import { Card, CardContent, Button } from "../../elements";

type AnnouncementTypes = {
onActionClick: () => void;
Expand Down
11 changes: 5 additions & 6 deletions components/blocks/misc/EmptyState.tsx
View file
@@ -1,16 +1,15 @@
import React, { FC } from "react";
import { Card, CardContent, CardFooter } from "../../elements/Card";
import { Button } from "../../elements/Button";
import { Card, CardContent, CardFooter, Button } from "../../elements";

type TEmptyState = {
type EmptyStateProps = {
onActionClick: () => void;
texts?: {
youreCaughtUp?: string;
actionText?: string;
};
};

export const EmptyState: FC<TEmptyState> = ({ texts, onActionClick }) => {
export const EmptyState: FC<EmptyStateProps> = ({ texts, onActionClick }) => {
return (
<Card>
<CardContent headless>
Expand All @@ -28,13 +27,13 @@ export const EmptyState: FC<TEmptyState> = ({ texts, onActionClick }) => {
</svg>
</div>
<div className="hawa-m-2 hawa-text-xl hawa-font-bold">
{texts?.youreCaughtUp ?? "You're all caught up"}
{texts?.youreCaughtUp || "You're all caught up"}
</div>
</div>
</CardContent>
<CardFooter>
<Button className="hawa-w-full" onClick={() => onActionClick()}>
{texts?.actionText ?? "Go Home"}
{texts?.actionText || "Go Home"}
</Button>
</CardFooter>
</Card>
Expand Down
7 changes: 3 additions & 4 deletions components/blocks/misc/LeadGenerator.tsx
View file
@@ -1,4 +1,5 @@
import React, { FC } from "react";
import { useForm, Controller } from "react-hook-form";
import {
Card,
CardContent,
Expand All @@ -8,9 +9,8 @@ import {
Button,
Input,
} from "../../elements";
import { useForm, Controller } from "react-hook-form";

type TLeadGenerator = {
type LGProps = {
texts?: {
title?: string;
subtitle?: string;
Expand All @@ -20,7 +20,7 @@ type TLeadGenerator = {
submitHandler: (e: string) => void;
};

export const LeadGenerator: FC<TLeadGenerator> = ({ texts, submitHandler }) => {
export const LeadGenerator: FC<LGProps> = ({ texts, submitHandler }) => {
const { handleSubmit, control, formState } = useForm();
const onSubmit = (data: any) => {
if (submitHandler) {
Expand Down Expand Up @@ -52,7 +52,6 @@ export const LeadGenerator: FC<TLeadGenerator> = ({ texts, submitHandler }) => {
message: texts?.invalidEmail || "Invalid email address",
},
}}
// rules={{ required: true }}
defaultValue=""
render={({ field }) => (
<Input {...field} type="email" placeholder="example@sikka.io" />
Expand Down
4 changes: 2 additions & 2 deletions components/blocks/misc/LegalTexts.tsx
View file
@@ -1,12 +1,12 @@
import React from "react";
import { cn } from "../../util";
import {
ScrollArea,
Tabs,
TabsContent,
TabsList,
TabsTrigger,
} from "../../elements";
import { cn } from "../../util";
import React from "react";

type TabType = {
title: string;
Expand Down
10 changes: 5 additions & 5 deletions components/blocks/misc/NoPermission.tsx
View file
@@ -1,14 +1,14 @@
import React, { FC } from "react";
import { Card, CardContent } from "../../elements/Card";

type TNoPermission = {
type NoPermissionProps = {
texts?: {
title: string;
subtitle: string;
};
};

export const NoPermission: FC<TNoPermission> = ({ texts }) => {
export const NoPermission: FC<NoPermissionProps> = ({ texts }) => {
return (
<Card>
<CardContent headless>
Expand All @@ -23,13 +23,13 @@ export const NoPermission: FC<TNoPermission> = ({ texts }) => {
width="0.35em"
>
<path d="M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z"></path>
</svg>{" "}
</svg>
</div>
<div className="hawa-m-2 hawa-text-xl hawa-font-bold">
{texts?.title ?? "You don't have permission"}
{texts?.title || "You don't have permission"}
</div>
<div>
{texts?.subtitle ??
{texts?.subtitle ||
"If you think this is a problem please contact your administrator or our customer support"}
</div>
</div>
Expand Down
11 changes: 4 additions & 7 deletions components/blocks/misc/NotFound.tsx
View file
Expand Up @@ -11,10 +11,7 @@ type NotFoundTypes = {
};
};

export const NotFound: FC<NotFoundTypes> = ({
variant = "contained",
texts,
}) => {
export const NotFound: FC<NotFoundTypes> = ({ texts }) => {
return (
<Card>
<CardContent headless>
Expand All @@ -23,17 +20,17 @@ export const NotFound: FC<NotFoundTypes> = ({
404
</div>
<div className="hawa-m-2 hawa-text-center hawa-text-xl hawa-font-bold ">
{texts?.pageNotFound ?? "Page Not Found"}
{texts?.pageNotFound || "Page Not Found"}
</div>
<div className="hawa-mb-4 hawa-text-center">
{texts?.ifLost ?? (
{texts?.ifLost || (
<>
{"If you're lost please contact us "}
<span className="clickable-link">help@sikka.io</span>
</>
)}
</div>
<Button className="hawa-w-full">{texts?.home ?? "Home"}</Button>
<Button className="hawa-w-full">{texts?.home || "Home"}</Button>
</div>
</CardContent>
</Card>
Expand Down
23 changes: 8 additions & 15 deletions components/blocks/misc/Testimonial.tsx
View file
@@ -1,11 +1,11 @@
import React, { FC } from "react"
import { Card, CardContent } from "../../elements/Card"
import React, { FC } from "react";
import { Card, CardContent } from "../../elements/Card";

type TEmptyState = {
variant?: "outlined" | "contained" | "neobrutalism"
}
type TestimonialProps = {
variant?: "outlined" | "contained" | "neobrutalism";
};

export const Testimonial: FC<TEmptyState> = (props) => {
export const Testimonial: FC<TestimonialProps> = () => {
return (
<Card>
<CardContent headless>
Expand Down Expand Up @@ -33,15 +33,8 @@ export const Testimonial: FC<TEmptyState> = (props) => {
<strong>Brent Lassi</strong>
<div> Chief Information Security Officer</div>
</div>
{/* <div>
<img
src="https://www.datocms-assets.com/55802/1636449069-bluecore-logo-dark.svg"
title="Logo of Brent Lassi"
alt="Logo of Brent Lassi"
/>
</div> */}
</div>
</CardContent>
</Card>
)
}
);
};
36 changes: 3 additions & 33 deletions components/blocks/pricing/ComparingPlans.tsx
View file
@@ -1,37 +1,7 @@
import React, { useState, FC } from "react";
import { Radio } from "../../elements";
import { Tooltip } from "../../elements/Tooltip";
import { DirectionType } from "@/components/types/commonTypes";

const CheckMark = () => (
<svg
className="hawa-h-5 hawa-w-5 hawa-text-green-500"
aria-hidden="true"
fill="currentColor"
viewBox="0 0 20 20"
>
<path
fillRule="evenodd"
d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
clipRule="evenodd"
></path>
</svg>
);

const UncheckMark = () => (
<svg
className="hawa-h-5 hawa-w-5 hawa-text-red-500"
aria-hidden="true"
fill="currentColor"
viewBox="0 0 20 20"
>
<path
fillRule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clipRule="evenodd"
></path>
</svg>
);
import { Radio, Tooltip } from "../../elements";
import { DirectionType } from "../../types/commonTypes";
import { CheckMark, UncheckMark } from "../../icons";

type ComparingPlansTypes = {
plans: {
Expand Down

0 comments on commit 0440441

Please sign in to comment.