feat: implemented new pages design with bare minimum functionality (#503)
* chore: add page types and page api service * chore: add create, list, update and delete on pages * chore: add create, delete and patch page blocks * feat: add and remove pages to favorite * fix: made neccessary changes - used tailwind for hover events - add error toast alert - used partial for patch request * fix: replace absolute positiong with a flex box * fix: design list page view to match with ui * feat: add top large textarea for page title and description * refactor: add page label with types * feat: add pages grid layout * feat: add tabs and masonry layout * fix: build errors --------- Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
This commit is contained in:
parent
c755907d99
commit
4a81b988b4
7 changed files with 455 additions and 37 deletions
|
|
@ -7,6 +7,7 @@ import { mutate } from "swr";
|
|||
import pagesService from "services/pages.service";
|
||||
// ui
|
||||
import { CustomMenu } from "components/ui";
|
||||
import Label from "./page-label";
|
||||
// icons
|
||||
import { PencilIcon, StarIcon, TrashIcon } from "@heroicons/react/24/outline";
|
||||
// helpers
|
||||
|
|
@ -24,20 +25,6 @@ type TSingleStatProps = {
|
|||
handleDeletePage: () => void;
|
||||
};
|
||||
|
||||
const Label: React.FC<any> = (props) => {
|
||||
let color = "bg-green-100 text-green-800";
|
||||
if (props.variant === "red") {
|
||||
color = "bg-red-100 text-red-800";
|
||||
} else if (props.variant === "blue") {
|
||||
color = "bg-blue-100 text-blue-800";
|
||||
}
|
||||
return (
|
||||
<p className={`inline-flex rounded-full px-2 text-xs font-semibold leading-5 ${color}`}>
|
||||
{props.children}
|
||||
</p>
|
||||
);
|
||||
};
|
||||
|
||||
export const SinglePageListItem: React.FC<TSingleStatProps> = (props) => {
|
||||
const { page, handleEditPage, handleDeletePage } = props;
|
||||
|
||||
|
|
@ -111,7 +98,7 @@ export const SinglePageListItem: React.FC<TSingleStatProps> = (props) => {
|
|||
return (
|
||||
<div>
|
||||
<li>
|
||||
<div className="relative px-4 py-4 hover:bg-gray-50 sm:px-6">
|
||||
<div className="relative rounded px-4 py-4 hover:bg-gray-200 sm:px-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex gap-2">
|
||||
<Link href={`/${workspaceSlug}/projects/${projectId}/pages/${page.id}`}>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue