binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-2443] fix: role validation and code refactor (#5596)

Browse source 
* chore: delete cycle toast message updated

* fix: view page empty state

* fix: project settings automation

* fix: intake delete action

* fix: project label validation

* fix: project label validation

* fix: project state permission updated

* chore: code refactor
This commit is contained in:
Anmol Singh Bhatia 2024-09-12 20:08:13 +05:30 • committed by GitHub
parent 5f1939cdeb
commit 441385fc95
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 134 additions and 77 deletions
Download patch file Download diff file Expand all files Collapse all files

23
web/core/components/project-states/group-item.tsx
View file

@ -6,6 +6,8 @@ import { Plus } from "lucide-react";
import { IState, TStateGroups } from "@plane/types";
// components
import { StateList, StateCreate } from "@/components/project-states";
import { useUserPermissions } from "@/hooks/store";
import { EUserPermissions, EUserPermissionsLevel } from "ee/constants/user-permissions";
type TGroupItem = {
workspaceSlug: string;
@ -17,22 +19,28 @@ type TGroupItem = {
export const GroupItem: FC<TGroupItem> = observer((props) => {
const { workspaceSlug, projectId, groupKey, groupedStates, states } = props;
// store hooks
const { allowPermissions } = useUserPermissions();
// state
const [createState, setCreateState] = useState(false);
const isEditable = allowPermissions([EUserPermissions.ADMIN], EUserPermissionsLevel.PROJECT);
return (
<div className="space-y-3">
<div className="flex justify-between items-center">
<div className="text-base font-medium text-custom-text-200 capitalize">{groupKey}</div>
<div
className="flex-shrink-0 w-6 h-6 rounded flex justify-center items-center overflow-hidden transition-colors hover:bg-custom-background-80 cursor-pointer text-custom-primary-100/80 hover:text-custom-primary-100"
onClick={() => !createState && setCreateState(true)}
>
<Plus className="w-4 h-4" />
</div>
{isEditable && (
<div
className="flex-shrink-0 w-6 h-6 rounded flex justify-center items-center overflow-hidden transition-colors hover:bg-custom-background-80 cursor-pointer text-custom-primary-100/80 hover:text-custom-primary-100"
onClick={() => !createState && setCreateState(true)}
>
<Plus className="w-4 h-4" />
</div>
)}
</div>
{createState && (
{isEditable && createState && (
<StateCreate
workspaceSlug={workspaceSlug}
projectId={projectId}
@ -48,6 +56,7 @@ export const GroupItem: FC<TGroupItem> = observer((props) => {
groupKey={groupKey}
groupedStates={groupedStates}
states={states}
disabled={!isEditable}
/>
</div>
</div>

52
web/core/components/project-states/state-item.tsx
View file

@ -24,10 +24,11 @@ type TStateItem = {
groupedStates: Record<string, IState[]>;
totalStates: number;
state: IState;
disabled?: boolean;
};
export const StateItem: FC<TStateItem> = observer((props) => {
const { workspaceSlug, projectId, groupKey, groupedStates, totalStates, state } = props;
const { workspaceSlug, projectId, groupKey, groupedStates, totalStates, state, disabled = false } = props;
// hooks
const { moveStatePosition } = useProjectState();
// states
@ -131,7 +132,7 @@ export const StateItem: FC<TStateItem> = observer((props) => {
)}
>
{/* draggable indicator */}
{totalStates != 1 && (
{!disabled && totalStates != 1 && (
<div className="flex-shrink-0 w-3 h-3 rounded-sm absolute left-0 hidden group-hover:flex justify-center items-center transition-colors bg-custom-background-90 cursor-pointer text-custom-text-200 hover:text-custom-text-100">
<GripVertical className="w-3 h-3" />
</div>
@ -148,28 +149,35 @@ export const StateItem: FC<TStateItem> = observer((props) => {
<p className="text-xs text-custom-text-200">{state.description}</p>
</div>
<div className="hidden group-hover:flex items-center gap-2">
{/* state mark as default option */}
<div className="flex-shrink-0 text-xs transition-all">
<StateMarksAsDefault
workspaceSlug={workspaceSlug}
projectId={projectId}
stateId={state.id}
isDefault={state.default ? true : false}
/>
</div>
{!disabled && (
<div className="hidden group-hover:flex items-center gap-2">
{/* state mark as default option */}
<div className="flex-shrink-0 text-xs transition-all">
<StateMarksAsDefault
workspaceSlug={workspaceSlug}
projectId={projectId}
stateId={state.id}
isDefault={state.default ? true : false}
/>
</div>
{/* state edit options */}
<div className="flex items-center gap-1 transition-all">
<button
className="flex-shrink-0 w-5 h-5 rounded flex justify-center items-center overflow-hidden transition-colors hover:bg-custom-background-80 cursor-pointer text-custom-text-200 hover:text-custom-text-100"
onClick={() => setUpdateStateModal(true)}
>
<Pencil className="w-3 h-3" />
</button>
<StateDelete workspaceSlug={workspaceSlug} projectId={projectId} totalStates={totalStates} state={state} />
{/* state edit options */}
<div className="flex items-center gap-1 transition-all">
<button
className="flex-shrink-0 w-5 h-5 rounded flex justify-center items-center overflow-hidden transition-colors hover:bg-custom-background-80 cursor-pointer text-custom-text-200 hover:text-custom-text-100"
onClick={() => setUpdateStateModal(true)}
>
<Pencil className="w-3 h-3" />
</button>
<StateDelete
workspaceSlug={workspaceSlug}
projectId={projectId}
totalStates={totalStates}
state={state}
/>
</div>
</div>
</div>
)}
</div>
{/* draggable drop bottom indicator */}

4
web/core/components/project-states/state-list.tsx
View file

@ -12,10 +12,11 @@ type TStateList = {
groupKey: TStateGroups;
groupedStates: Record<string, IState[]>;
states: IState[];
disabled?: boolean;
};
export const StateList: FC<TStateList> = observer((props) => {
const { workspaceSlug, projectId, groupKey, groupedStates, states } = props;
const { workspaceSlug, projectId, groupKey, groupedStates, states, disabled = false } = props;
return (
<>
@ -28,6 +29,7 @@ export const StateList: FC<TStateList> = observer((props) => {
groupedStates={groupedStates}
totalStates={states.length || 0}
state={state}
disabled={disabled}
/>
))}
</>