dev: project sort ordering migration

apiserver/bin/user_script.py

@@ -1,4 +1,4 @@
-import os, sys, random, string
+import os, sys
 import uuid
 
 sys.path.append("/code")
@@ -19,9 +19,9 @@ def populate():
         user = User.objects.create(email=default_email, username=uuid.uuid4().hex)
         user.set_password(default_password)
         user.save()
-        print(f"User created with an email: {default_email}")
-    else:
-        print(f"User already exists with the default email: {default_email}")
+        print("User created")
+
+    print("Success")
 
 
 if __name__ == "__main__":

apiserver/plane/api/serializers/__init__.py

@@ -1,5 +1,10 @@
 from .base import BaseSerializer
-from .user import UserSerializer, UserLiteSerializer, ChangePasswordSerializer, ResetPasswordSerializer, UserAdminLiteSerializer
+from .people import (
+    ChangePasswordSerializer,
+    ResetPasswordSerializer,
+    TokenSerializer,
+)
+from .user import UserSerializer, UserLiteSerializer
 from .workspace import (
     WorkSpaceSerializer,
     WorkSpaceMemberSerializer,
@@ -7,7 +12,6 @@ from .workspace import (
     WorkSpaceMemberInviteSerializer,
     WorkspaceLiteSerializer,
     WorkspaceThemeSerializer,
-    WorkspaceMemberAdminSerializer,
 )
 from .project import (
     ProjectSerializer,

apiserver/plane/api/serializers/issue.py

@@ -291,8 +291,7 @@ class IssueCreateSerializer(BaseSerializer):
 
 class IssueActivitySerializer(BaseSerializer):
     actor_detail = UserLiteSerializer(read_only=True, source="actor")
-    issue_detail = IssueFlatSerializer(read_only=True, source="issue")
-    project_detail = ProjectLiteSerializer(read_only=True, source="project")
+    workspace_detail = WorkspaceLiteSerializer(read_only=True, source="workspace")
 
     class Meta:
         model = IssueActivity

apiserver/plane/api/serializers/people.py

@@ -0,0 +1,57 @@
+from rest_framework.serializers import (
+    ModelSerializer,
+    Serializer,
+    CharField,
+    SerializerMethodField,
+)
+from rest_framework.authtoken.models import Token
+from rest_framework_simplejwt.tokens import RefreshToken
+
+
+from plane.db.models import User
+
+
+class UserSerializer(ModelSerializer):
+    class Meta:
+        model = User
+        fields = "__all__"
+        extra_kwargs = {"password": {"write_only": True}}
+
+
+class ChangePasswordSerializer(Serializer):
+    model = User
+
+    """
+    Serializer for password change endpoint.
+    """
+    old_password = CharField(required=True)
+    new_password = CharField(required=True)
+
+
+class ResetPasswordSerializer(Serializer):
+    model = User
+
+    """
+    Serializer for password change endpoint.
+    """
+    new_password = CharField(required=True)
+    confirm_password = CharField(required=True)
+
+
+class TokenSerializer(ModelSerializer):
+
+    user = UserSerializer()
+    access_token = SerializerMethodField()
+    refresh_token = SerializerMethodField()
+
+    def get_access_token(self, obj):
+        refresh_token = RefreshToken.for_user(obj.user)
+        return str(refresh_token.access_token)
+
+    def get_refresh_token(self, obj):
+        refresh_token = RefreshToken.for_user(obj.user)
+        return str(refresh_token)
+
+    class Meta:
+        model = Token
+        fields = "__all__"

apiserver/plane/api/serializers/project.py

@@ -7,7 +7,7 @@ from rest_framework import serializers
 # Module imports
 from .base import BaseSerializer
 from plane.api.serializers.workspace import WorkSpaceSerializer, WorkspaceLiteSerializer
-from plane.api.serializers.user import UserLiteSerializer, UserAdminLiteSerializer
+from plane.api.serializers.user import UserLiteSerializer
 from plane.db.models import (
     Project,
     ProjectMember,
@@ -110,17 +110,6 @@ class ProjectMemberSerializer(BaseSerializer):
         fields = "__all__"
 
 
-class ProjectMemberAdminSerializer(BaseSerializer):
-    workspace = WorkspaceLiteSerializer(read_only=True)
-    project = ProjectLiteSerializer(read_only=True)
-    member = UserAdminLiteSerializer(read_only=True)
-
-
-    class Meta:
-        model = ProjectMember
-        fields = "__all__"
-
-
 class ProjectMemberInviteSerializer(BaseSerializer):
     project = ProjectLiteSerializer(read_only=True)
     workspace = WorkspaceLiteSerializer(read_only=True)

apiserver/plane/api/serializers/user.py

@@ -1,6 +1,3 @@
-# Third party imports
-from rest_framework import serializers
-
 # Module import
 from .base import BaseSerializer
 from plane.db.models import User
@@ -40,50 +37,11 @@ class UserLiteSerializer(BaseSerializer):
             "id",
             "first_name",
             "last_name",
-            "avatar",
-            "is_bot",
-            "display_name",
-        ]
-        read_only_fields = [
-            "id",
-            "is_bot",
-        ]
-
-
-class UserAdminLiteSerializer(BaseSerializer):
-
-    class Meta:
-        model = User
-        fields = [
-            "id",
-            "first_name",
-            "last_name",
-            "avatar",
-            "is_bot",
-            "display_name",
             "email",
+            "avatar",
+            "is_bot",
         ]
         read_only_fields = [
             "id",
             "is_bot",
         ]
-
-
-class ChangePasswordSerializer(serializers.Serializer):
-    model = User
-
-    """
-    Serializer for password change endpoint.
-    """
-    old_password = serializers.CharField(required=True)
-    new_password = serializers.CharField(required=True)
-
-
-class ResetPasswordSerializer(serializers.Serializer):
-    model = User
-
-    """
-    Serializer for password change endpoint.
-    """
-    new_password = serializers.CharField(required=True)
-    confirm_password = serializers.CharField(required=True)

apiserver/plane/api/serializers/workspace.py

@@ -3,7 +3,7 @@ from rest_framework import serializers
 
 # Module imports
 from .base import BaseSerializer
-from .user import UserLiteSerializer, UserAdminLiteSerializer
+from .user import UserLiteSerializer
 
 from plane.db.models import (
     User,
@@ -33,30 +33,10 @@ class WorkSpaceSerializer(BaseSerializer):
             "owner",
         ]
 
-class WorkspaceLiteSerializer(BaseSerializer):
-    class Meta:
-        model = Workspace
-        fields = [
-            "name",
-            "slug",
-            "id",
-        ]
-        read_only_fields = fields
-
-
 
 class WorkSpaceMemberSerializer(BaseSerializer):
     member = UserLiteSerializer(read_only=True)
-    workspace = WorkspaceLiteSerializer(read_only=True)
-
-    class Meta:
-        model = WorkspaceMember
-        fields = "__all__"
-
-
-class WorkspaceMemberAdminSerializer(BaseSerializer):
-    member = UserAdminLiteSerializer(read_only=True)
-    workspace = WorkspaceLiteSerializer(read_only=True)
+    workspace = WorkSpaceSerializer(read_only=True)
 
     class Meta:
         model = WorkspaceMember
@@ -121,6 +101,17 @@ class TeamSerializer(BaseSerializer):
             return super().update(instance, validated_data)
 
 
+class WorkspaceLiteSerializer(BaseSerializer):
+    class Meta:
+        model = Workspace
+        fields = [
+            "name",
+            "slug",
+            "id",
+        ]
+        read_only_fields = fields
+
+
 class WorkspaceThemeSerializer(BaseSerializer):
     class Meta:
         model = WorkspaceTheme

apiserver/plane/api/urls.py

@@ -32,7 +32,6 @@ from plane.api.views import (
     InviteWorkspaceEndpoint,
     JoinWorkspaceEndpoint,
     WorkSpaceMemberViewSet,
-    WorkspaceMembersEndpoint,
     WorkspaceInvitationsViewset,
     UserWorkspaceInvitationsEndpoint,
     WorkspaceMemberUserEndpoint,
@@ -60,7 +59,6 @@ from plane.api.views import (
     ProjectViewSet,
     InviteProjectEndpoint,
     ProjectMemberViewSet,
-    ProjectMemberEndpoint,
     ProjectMemberInvitationsViewset,
     ProjectMemberUserEndpoint,
     AddMemberToProjectEndpoint,
@@ -88,7 +86,6 @@ from plane.api.views import (
     IssueSubscriberViewSet,
     IssueReactionViewSet,
     CommentReactionViewSet,
-    ExportIssuesEndpoint,
     ## End Issues
     # States
     StateViewSet,
@@ -337,11 +334,6 @@ urlpatterns = [
         ),
         name="workspace",
     ),
-    path(
-        "workspaces/<str:slug>/workspace-members/",
-        WorkspaceMembersEndpoint.as_view(),
-        name="workspace-members",
-    ),
     path(
         "workspaces/<str:slug>/teams/",
         TeamMemberViewSet.as_view(
@@ -475,11 +467,6 @@ urlpatterns = [
         ),
         name="project",
     ),
-    path(
-        "workspaces/<str:slug>/projects/<uuid:project_id>/project-members/",
-        ProjectMemberEndpoint.as_view(),
-        name="project",
-    ),
     path(
         "workspaces/<str:slug>/projects/<uuid:project_id>/members/add/",
         AddMemberToProjectEndpoint.as_view(),
@@ -821,11 +808,6 @@ urlpatterns = [
         IssueAttachmentEndpoint.as_view(),
         name="project-issue-attachments",
     ),
-    path(
-        "workspaces/<str:slug>/export-issues/",
-        ExportIssuesEndpoint.as_view(),
-        name="export-issues",
-    ),
     ## End Issues
     ## Issue Activity
     path(

apiserver/plane/api/views/__init__.py

@@ -12,9 +12,8 @@ from .project import (
     ProjectUserViewsEndpoint,
     ProjectMemberUserEndpoint,
     ProjectFavoritesViewSet,
-    ProjectMemberEndpoint,
 )
-from .user import (
+from .people import (
     UserEndpoint,
     UpdateUserOnBoardedEndpoint,
     UpdateUserTourCompletedEndpoint,
@@ -48,7 +47,6 @@ from .workspace import (
     WorkspaceUserProfileEndpoint,
     WorkspaceUserProfileIssuesEndpoint,
     WorkspaceLabelsEndpoint,
-    WorkspaceMembersEndpoint,
 )
 from .state import StateViewSet
 from .view import IssueViewViewSet, ViewIssuesEndpoint, IssueViewFavoriteViewSet
@@ -77,7 +75,6 @@ from .issue import (
     IssueSubscriberViewSet,
     CommentReactionViewSet,
     IssueReactionViewSet,
-    ExportIssuesEndpoint
 )
 
 from .auth_extended import (

apiserver/plane/api/views/analytic.py

@@ -79,12 +79,12 @@ class AnalyticsEndpoint(BaseAPIView):
                 )
 
             assignee_details = {}
-            if x_axis in ["assignees__id"] or segment in ["assignees__id"]:
+            if x_axis in ["assignees__email"] or segment in ["assignees__email"]:
                 assignee_details = (
                     Issue.issue_objects.filter(workspace__slug=slug, **filters, assignees__avatar__isnull=False)
                     .order_by("assignees__id")
                     .distinct("assignees__id")
-                    .values("assignees__avatar", "assignees__display_name", "assignees__first_name", "assignees__last_name", "assignees__id")
+                    .values("assignees__avatar", "assignees__email", "assignees__first_name", "assignees__last_name")
                 )
 
 
@@ -243,21 +243,21 @@ class DefaultAnalyticsEndpoint(BaseAPIView):
             )
             most_issue_created_user = (
                 queryset.exclude(created_by=None)
-                .values("created_by__first_name", "created_by__last_name", "created_by__avatar", "created_by__display_name")
+                .values("created_by__first_name", "created_by__last_name", "created_by__avatar", "created_by__email")
                 .annotate(count=Count("id"))
                 .order_by("-count")
             )[:5]
 
             most_issue_closed_user = (
                 queryset.filter(completed_at__isnull=False, assignees__isnull=False)
-                .values("assignees__first_name", "assignees__last_name", "assignees__avatar", "assignees__display_name")
+                .values("assignees__first_name", "assignees__last_name", "assignees__avatar", "assignees__email")
                 .annotate(count=Count("id"))
                 .order_by("-count")
             )[:5]
 
             pending_issue_user = (
                 queryset.filter(completed_at__isnull=True)
-                .values("assignees__first_name", "assignees__last_name", "assignees__avatar", "assignees__display_name")
+                .values("assignees__first_name", "assignees__last_name", "assignees__avatar", "assignees__email")
                 .annotate(count=Count("id"))
                 .order_by("-count")
             )

apiserver/plane/api/views/auth_extended.py

@@ -22,7 +22,7 @@ from sentry_sdk import capture_exception
 
 ## Module imports
 from . import BaseAPIView
-from plane.api.serializers import (
+from plane.api.serializers.people import (
     ChangePasswordSerializer,
     ResetPasswordSerializer,
 )

apiserver/plane/api/views/importer.py

@@ -332,7 +332,7 @@ class BulkImportIssuesEndpoint(BaseAPIView):
             # if there is no default state assign any random state
             if default_state is None:
                 default_state = State.objects.filter(
-                    ~Q(name="Triage"), project_id=project_id
+                    ~Q(name="Triage"), sproject_id=project_id
                 ).first()
 
             # Get the maximum sequence_id
@@ -458,7 +458,7 @@ class BulkImportIssuesEndpoint(BaseAPIView):
                         actor=request.user,
                         project_id=project_id,
                         workspace_id=project.workspace_id,
-                        comment=f"imported the issue from {service}",
+                        comment=f"{request.user.email} importer the issue from {service}",
                         verb="created",
                         created_by=request.user,
                     )

apiserver/plane/api/views/issue.py

@@ -74,7 +74,6 @@ from plane.db.models import (
 from plane.bgtasks.issue_activites_task import issue_activity
 from plane.utils.grouper import group_results
 from plane.utils.issue_filters import issue_filters
-from plane.bgtasks.project_issue_export import issue_export_task
 
 
 class IssueViewSet(BaseViewSet):
@@ -478,7 +477,7 @@ class IssueActivityEndpoint(BaseAPIView):
                     ~Q(field="comment"),
                     project__project_projectmember__member=self.request.user,
                 )
-                .select_related("actor", "workspace", "issue", "project")
+                .select_related("actor", "workspace")
             ).order_by("created_at")
             issue_comments = (
                 IssueComment.objects.filter(issue_id=issue_id)
@@ -1446,30 +1445,3 @@ class CommentReactionViewSet(BaseViewSet):
                 {"error": "Something went wrong please try again later"},
                 status=status.HTTP_400_BAD_REQUEST,
             )
-
-
-
-class ExportIssuesEndpoint(BaseAPIView):
-    permission_classes = [
-        WorkSpaceAdminPermission,
-    ]
-
-    def post(self, request, slug):
-        try:
-
-            issue_export_task.delay(
-                email=request.user.email, data=request.data, slug=slug ,exporter_name=request.user.first_name
-            )
-
-            return Response(
-                {
-                    "message": f"Once the export is ready it will be emailed to you at {str(request.user.email)}"
-                },
-                status=status.HTTP_200_OK,
-            )
-        except Exception as e:
-            capture_exception(e)
-            return Response(
-                {"error": "Something went wrong please try again later"},
-                status=status.HTTP_400_BAD_REQUEST,
-            )

apiserver/plane/api/views/notification.py

@@ -10,7 +10,7 @@ from plane.utils.paginator import BasePaginator
 
 # Module imports
 from .base import BaseViewSet, BaseAPIView
-from plane.db.models import Notification, IssueAssignee, IssueSubscriber, Issue, WorkspaceMember
+from plane.db.models import Notification, IssueAssignee, IssueSubscriber, Issue
 from plane.api.serializers import NotificationSerializer
 
 
@@ -83,13 +83,10 @@ class NotificationViewSet(BaseViewSet, BasePaginator):
 
             # Created issues
             if type == "created":
-                if WorkspaceMember.objects.filter(workspace__slug=slug, member=request.user, role__lt=15).exists():
-                    notifications = Notification.objects.none()
-                else:
-                    issue_ids = Issue.objects.filter(
-                        workspace__slug=slug, created_by=request.user
-                    ).values_list("pk", flat=True)
-                    notifications = notifications.filter(entity_identifier__in=issue_ids)
+                issue_ids = Issue.objects.filter(
+                    workspace__slug=slug, created_by=request.user
+                ).values_list("pk", flat=True)
+                notifications = notifications.filter(entity_identifier__in=issue_ids)
 
             # Pagination
             if request.GET.get("per_page", False) and request.GET.get("cursor", False):

apiserver/plane/api/views/page.py

@@ -301,7 +301,7 @@ class CreateIssueFromPageBlockEndpoint(BaseAPIView):
                 issue=issue,
                 actor=request.user,
                 project_id=project_id,
-                comment=f"created the issue from {page_block.name} block",
+                comment=f"{request.user.email} created the issue from {page_block.name} block",
                 verb="created",
             )
 

apiserver/plane/api/views/people.py

@@ -140,7 +140,7 @@ class UserActivityEndpoint(BaseAPIView, BasePaginator):
     def get(self, request):
         try:
             queryset = IssueActivity.objects.filter(actor=request.user).select_related(
-                "actor", "workspace", "issue", "project"
+                "actor", "workspace"
             )
 
             return self.paginate(

apiserver/plane/api/views/project.py

@@ -25,7 +25,7 @@ from plane.api.serializers import (
     ProjectFavoriteSerializer,
 )
 
-from plane.api.permissions import ProjectBasePermission, ProjectEntityPermission
+from plane.api.permissions import ProjectBasePermission
 
 from plane.db.models import (
     Project,
@@ -123,7 +123,7 @@ class ProjectViewSet(BaseViewSet):
             sort_order_query = ProjectMember.objects.filter(
                 member=request.user,
                 project_id=OuterRef("pk"),
-                workspace__slug=self.kwargs.get("slug"),
+                workspace__slug=self.kwargs.get("slug"),   
             ).values("sort_order")
             projects = (
                 self.get_queryset()
@@ -176,7 +176,7 @@ class ProjectViewSet(BaseViewSet):
                 serializer.save()
 
                 # Add the user as Administrator to the project
-                project_member = ProjectMember.objects.create(
+                ProjectMember.objects.create(
                     project_id=serializer.data["id"], member=request.user, role=20
                 )
 
@@ -238,11 +238,9 @@ class ProjectViewSet(BaseViewSet):
                     ]
                 )
 
-                data = serializer.data
-                data["sort_order"] = project_member.sort_order
-                return Response(data, status=status.HTTP_201_CREATED)
+                return Response(serializer.data, status=status.HTTP_201_CREATED)
             return Response(
-                serializer.errors,
+                [serializer.errors[error][0] for error in serializer.errors],
                 status=status.HTTP_400_BAD_REQUEST,
             )
         except IntegrityError as e:
@@ -458,7 +456,7 @@ class ProjectMemberViewSet(BaseViewSet):
     ]
 
     search_fields = [
-        "member__display_name",
+        "member__email",
         "member__first_name",
     ]
 
@@ -602,29 +600,19 @@ class AddMemberToProjectEndpoint(BaseAPIView):
                 )
             bulk_project_members = []
 
-            project_members = (
-                ProjectMember.objects.filter(
-                    workspace__slug=slug,
-                    member_id__in=[member.get("member_id") for member in members],
-                )
-                .values("member_id", "sort_order")
-                .order_by("sort_order")
-            )
+            project_members = ProjectMember.objects.filter(
+                workspace=self.workspace, member_id__in=[member.get("member_id") for member in members]
+            ).values("member_id").annotate(sort_order_min=Min("sort_order"))
 
             for member in members:
-                sort_order = [
-                    project_member.get("sort_order")
-                    for project_member in project_members
-                    if str(project_member.get("member_id"))
-                    == str(member.get("member_id"))
-                ]
+                sort_order = [project_member.get("sort_order") for project_member in project_members]
                 bulk_project_members.append(
                     ProjectMember(
                         member_id=member.get("member_id"),
                         role=member.get("role", 10),
                         project_id=project_id,
                         workspace_id=project.workspace_id,
-                        sort_order=sort_order[0] - 10000 if len(sort_order) else 65535,
+                        sort_order=sort_order[0] - 10000 if len(sort_order) else 65535
                     )
                 )
 
@@ -984,23 +972,3 @@ class ProjectFavoritesViewSet(BaseViewSet):
                 {"error": "Something went wrong please try again later"},
                 status=status.HTTP_400_BAD_REQUEST,
             )
-
-
-class ProjectMemberEndpoint(BaseAPIView):
-    permission_classes = [
-        ProjectEntityPermission,
-    ]
-
-    def get(self, request, slug, project_id):
-        try:
-            project_members = ProjectMember.objects.filter(
-                project_id=project_id, workspace__slug=slug
-            ).select_related("project", "member")
-            serializer = ProjectMemberSerializer(project_members, many=True)
-            return Response(serializer.data, status=status.HTTP_200_OK)
-        except Exception as e:
-            capture_exception(e)
-            return Response(
-                {"error": "Something went wrong please try again later"},
-                status=status.HTTP_400_BAD_REQUEST,
-            )

apiserver/plane/api/views/workspace.py

@@ -47,7 +47,6 @@ from plane.api.serializers import (
     WorkspaceThemeSerializer,
     IssueActivitySerializer,
     IssueLiteSerializer,
-    WorkspaceMemberAdminSerializer
 )
 from plane.api.views.base import BaseAPIView
 from . import BaseViewSet
@@ -76,7 +75,6 @@ from plane.db.models import (
     Label,
     WorkspaceMember,
     CycleIssue,
-    IssueReaction,
 )
 from plane.api.permissions import (
     WorkSpaceBasePermission,
@@ -538,7 +536,7 @@ class UserWorkspaceInvitationsEndpoint(BaseViewSet):
 
 
 class WorkSpaceMemberViewSet(BaseViewSet):
-    serializer_class = WorkspaceMemberAdminSerializer
+    serializer_class = WorkSpaceMemberSerializer
     model = WorkspaceMember
 
     permission_classes = [
@@ -546,7 +544,7 @@ class WorkSpaceMemberViewSet(BaseViewSet):
     ]
 
     search_fields = [
-        "member__display_name",
+        "member__email",
         "member__first_name",
     ]
 
@@ -691,7 +689,7 @@ class TeamMemberViewSet(BaseViewSet):
     ]
 
     search_fields = [
-        "member__display_name",
+        "member__email",
         "member__first_name",
     ]
 
@@ -1049,6 +1047,7 @@ class WorkspaceThemeViewSet(BaseViewSet):
 
 
 class WorkspaceUserProfileStatsEndpoint(BaseAPIView):
+
     def get(self, request, slug, user_id):
         try:
             filters = issue_filters(request.query_params, "GET")
@@ -1146,18 +1145,14 @@ class WorkspaceUserProfileStatsEndpoint(BaseAPIView):
             upcoming_cycles = CycleIssue.objects.filter(
                 workspace__slug=slug,
                 cycle__start_date__gt=timezone.now().date(),
-                issue__assignees__in=[
-                    user_id,
-                ],
+                issue__assignees__in=[user_id,]
             ).values("cycle__name", "cycle__id", "cycle__project_id")
 
             present_cycle = CycleIssue.objects.filter(
                 workspace__slug=slug,
                 cycle__start_date__lt=timezone.now().date(),
                 cycle__end_date__gt=timezone.now().date(),
-                issue__assignees__in=[
-                    user_id,
-                ],
+                issue__assignees__in=[user_id,]
             ).values("cycle__name", "cycle__id", "cycle__project_id")
 
             return Response(
@@ -1170,7 +1165,7 @@ class WorkspaceUserProfileStatsEndpoint(BaseAPIView):
                     "pending_issues": pending_issues_count,
                     "subscribed_issues": subscribed_issues_count,
                     "present_cycles": present_cycle,
-                    "upcoming_cycles": upcoming_cycles,
+                    "upcoming_cycles": upcoming_cycles, 
                 }
             )
         except Exception as e:
@@ -1188,13 +1183,14 @@ class WorkspaceUserActivityEndpoint(BaseAPIView):
 
     def get(self, request, slug, user_id):
         try:
+
             projects = request.query_params.getlist("project", [])
 
             queryset = IssueActivity.objects.filter(
                 workspace__slug=slug,
                 project__project_projectmember__member=request.user,
                 actor=user_id,
-            ).select_related("actor", "workspace", "issue", "project")
+            ).select_related("actor", "workspace")
 
             if projects:
                 queryset = queryset.filter(project__in=projects)
@@ -1215,13 +1211,12 @@ class WorkspaceUserActivityEndpoint(BaseAPIView):
 
 
 class WorkspaceUserProfileEndpoint(BaseAPIView):
+
     def get(self, request, slug, user_id):
         try:
             user_data = User.objects.get(pk=user_id)
 
-            requesting_workspace_member = WorkspaceMember.objects.get(
-                workspace__slug=slug, member=request.user
-            )
+            requesting_workspace_member = WorkspaceMember.objects.get(workspace__slug=slug, member=request.user)
             projects = []
             if requesting_workspace_member.role >= 10:
                 projects = (
@@ -1231,8 +1226,7 @@ class WorkspaceUserProfileEndpoint(BaseAPIView):
                     )
                     .annotate(
                         created_issues=Count(
-                            "project_issue",
-                            filter=Q(project_issue__created_by_id=user_id),
+                            "project_issue", filter=Q(project_issue__created_by_id=user_id)
                         )
                     )
                     .annotate(
@@ -1287,7 +1281,6 @@ class WorkspaceUserProfileEndpoint(BaseAPIView):
                         "cover_image": user_data.cover_image,
                         "date_joined": user_data.date_joined,
                         "user_timezone": user_data.user_timezone,
-                        "display_name": user_data.display_name,
                     },
                 },
                 status=status.HTTP_200_OK,
@@ -1328,12 +1321,6 @@ class WorkspaceUserProfileIssuesEndpoint(BaseAPIView):
                 )
                 .select_related("project", "workspace", "state", "parent")
                 .prefetch_related("assignees", "labels")
-                .prefetch_related(
-                    Prefetch(
-                        "issue_reactions",
-                        queryset=IssueReaction.objects.select_related("actor"),
-                    )
-                )
                 .order_by("-created_at")
                 .annotate(
                     link_count=IssueLink.objects.filter(issue=OuterRef("id"))
@@ -1445,23 +1432,3 @@ class WorkspaceLabelsEndpoint(BaseAPIView):
                 {"error": "Something went wrong please try again later"},
                 status=status.HTTP_400_BAD_REQUEST,
             )
-
-
-class WorkspaceMembersEndpoint(BaseAPIView):
-    permission_classes = [
-        WorkspaceEntityPermission,
-    ]
-
-    def get(self, request, slug):
-        try:
-            workspace_members = WorkspaceMember.objects.filter(
-                workspace__slug=slug
-            ).select_related("workspace", "member")
-            serialzier = WorkSpaceMemberSerializer(workspace_members, many=True)
-            return Response(serialzier.data, status=status.HTTP_200_OK)
-        except Exception as e:
-            capture_exception(e)
-            return Response(
-                {"error": "Something went wrong please try again later"},
-                status=status.HTTP_400_BAD_REQUEST,
-            )

apiserver/plane/bgtasks/analytic_plot_export.py

@@ -21,7 +21,7 @@ row_mapping = {
     "state__name": "State",
     "state__group": "State Group",
     "labels__name": "Label",
-    "assignees__display_name": "Assignee Name",
+    "assignees__email": "Assignee Name",
     "start_date": "Start Date",
     "target_date": "Due Date",
     "completed_at": "Completed At",
@@ -51,12 +51,12 @@ def analytic_export_task(email, data, slug):
         segmented = segment
 
         assignee_details = {}
-        if x_axis in ["assignees__display_name"] or segment in ["assignees__display_name"]:
+        if x_axis in ["assignees__email"] or segment in ["assignees__email"]:
             assignee_details = (
                 Issue.issue_objects.filter(workspace__slug=slug, **filters, assignees__avatar__isnull=False)
                 .order_by("assignees__id")
                 .distinct("assignees__id")
-                .values("assignees__avatar", "assignees__display_name", "assignees__first_name", "assignees__last_name")
+                .values("assignees__avatar", "assignees__email", "assignees__first_name", "assignees__last_name")
             )
 
         if segment:
@@ -93,17 +93,17 @@ def analytic_export_task(email, data, slug):
                     else:
                         generated_row.append("0")
                 # x-axis replacement for names
-                if x_axis in ["assignees__display_name"]:
-                    assignee = [user for user in assignee_details if str(user.get("assignees__display_name")) == str(item)]
+                if x_axis in ["assignees__email"]:
+                    assignee = [user for user in assignee_details if str(user.get("assignees__email")) == str(item)]
                     if len(assignee):
                         generated_row[0] = str(assignee[0].get("assignees__first_name")) + " " + str(assignee[0].get("assignees__last_name"))
                 rows.append(tuple(generated_row))
 
-            # If segment is ["assignees__display_name"] then replace segment_zero rows with first and last names
-            if segmented in ["assignees__display_name"]:
+            # If segment is ["assignees__email"] then replace segment_zero rows with first and last names
+            if segmented in ["assignees__email"]:
                 for index, segm in enumerate(row_zero[2:]):
                     # find the name of the user
-                    assignee = [user for user in assignee_details if str(user.get("assignees__display_name")) == str(segm)]
+                    assignee = [user for user in assignee_details if str(user.get("assignees__email")) == str(segm)]
                     if len(assignee):
                         row_zero[index] = str(assignee[0].get("assignees__first_name")) + " " + str(assignee[0].get("assignees__last_name"))
 
@@ -141,8 +141,8 @@ def analytic_export_task(email, data, slug):
                             else distribution.get(item)[0].get("estimate  "),
                         ]
                 # x-axis replacement to names
-                if x_axis in ["assignees__display_name"]:
-                    assignee = [user for user in assignee_details if str(user.get("assignees__display_name")) == str(item)]
+                if x_axis in ["assignees__email"]:
+                    assignee = [user for user in assignee_details if str(user.get("assignees__email")) == str(item)]
                     if len(assignee):
                         row[0] = str(assignee[0].get("assignees__first_name")) + " " + str(assignee[0].get("assignees__last_name"))
 

apiserver/plane/bgtasks/issue_activites_task.py

@@ -48,7 +48,7 @@ def track_name(
                 field="name",
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated the name to {requested_data.get('name')}",
+                comment=f"{actor.email} updated the name to {requested_data.get('name')}",
             )
         )
 
@@ -75,7 +75,7 @@ def track_parent(
                     field="parent",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the parent issue to None",
+                    comment=f"{actor.email} updated the parent issue to None",
                     old_identifier=old_parent.id,
                     new_identifier=None,
                 )
@@ -95,7 +95,7 @@ def track_parent(
                     field="parent",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the parent issue to {new_parent.name}",
+                    comment=f"{actor.email} updated the parent issue to {new_parent.name}",
                     old_identifier=old_parent.id if old_parent is not None else None,
                     new_identifier=new_parent.id,
                 )
@@ -123,7 +123,7 @@ def track_priority(
                     field="priority",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the priority to None",
+                    comment=f"{actor.email} updated the priority to None",
                 )
             )
         else:
@@ -137,7 +137,7 @@ def track_priority(
                     field="priority",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the priority to {requested_data.get('priority')}",
+                    comment=f"{actor.email} updated the priority to {requested_data.get('priority')}",
                 )
             )
 
@@ -165,7 +165,7 @@ def track_state(
                 field="state",
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated the state to {new_state.name}",
+                comment=f"{actor.email} updated the state to {new_state.name}",
                 old_identifier=old_state.id,
                 new_identifier=new_state.id,
             )
@@ -194,7 +194,7 @@ def track_description(
                 field="description",
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated the description to {requested_data.get('description_html')}",
+                comment=f"{actor.email} updated the description to {requested_data.get('description_html')}",
             )
         )
 
@@ -220,7 +220,7 @@ def track_target_date(
                     field="target_date",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the target date to None",
+                    comment=f"{actor.email} updated the target date to None",
                 )
             )
         else:
@@ -234,7 +234,7 @@ def track_target_date(
                     field="target_date",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the target date to {requested_data.get('target_date')}",
+                    comment=f"{actor.email} updated the target date to {requested_data.get('target_date')}",
                 )
             )
 
@@ -260,7 +260,7 @@ def track_start_date(
                     field="start_date",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the start date to None",
+                    comment=f"{actor.email} updated the start date to None",
                 )
             )
         else:
@@ -274,7 +274,7 @@ def track_start_date(
                     field="start_date",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the start date to {requested_data.get('start_date')}",
+                    comment=f"{actor.email} updated the start date to {requested_data.get('start_date')}",
                 )
             )
 
@@ -303,7 +303,7 @@ def track_labels(
                         field="labels",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"added label {label.name}",
+                        comment=f"{actor.email} added label {label.name}",
                         new_identifier=label.id,
                         old_identifier=None,
                     )
@@ -324,7 +324,7 @@ def track_labels(
                         field="labels",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"removed label {label.name}",
+                        comment=f"{actor.email} removed label {label.name}",
                         old_identifier=label.id,
                         new_identifier=None,
                     )
@@ -353,12 +353,12 @@ def track_assignees(
                         actor=actor,
                         verb="updated",
                         old_value="",
-                        new_value=assignee.display_name,
+                        new_value=assignee.email,
                         field="assignees",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"added assignee {assignee.display_name}",
-                        new_identifier=assignee.id,
+                        comment=f"{actor.email} added assignee {assignee.email}",
+                        new_identifier=actor.id,
                     )
                 )
 
@@ -374,13 +374,13 @@ def track_assignees(
                         issue_id=issue_id,
                         actor=actor,
                         verb="updated",
-                        old_value=assignee.display_name,
+                        old_value=assignee.email,
                         new_value="",
                         field="assignees",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"removed assignee {assignee.display_name}",
-                        old_identifier=assignee.id,
+                        comment=f"{actor.email} removed assignee {assignee.email}",
+                        old_identifier=actor.id,
                     )
                 )
 
@@ -419,7 +419,7 @@ def track_blocks(
                         field="blocks",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"added blocking issue {project.identifier}-{issue.sequence_id}",
+                        comment=f"{actor.email} added blocking issue {issue.project.identifier}-{issue.sequence_id}",
                         new_identifier=issue.id,
                     )
                 )
@@ -441,7 +441,7 @@ def track_blocks(
                         field="blocks",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"removed blocking issue {project.identifier}-{issue.sequence_id}",
+                        comment=f"{actor.email} removed blocking issue {issue.project.identifier}-{issue.sequence_id}",
                         old_identifier=issue.id,
                     )
                 )
@@ -481,7 +481,7 @@ def track_blockings(
                         field="blocking",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"added blocked by issue {project.identifier}-{issue.sequence_id}",
+                        comment=f"{actor.email} added blocked by issue {issue.project.identifier}-{issue.sequence_id}",
                         new_identifier=issue.id,
                     )
                 )
@@ -503,7 +503,7 @@ def track_blockings(
                         field="blocking",
                         project=project,
                         workspace=project.workspace,
-                        comment=f"removed blocked by issue {project.identifier}-{issue.sequence_id}",
+                        comment=f"{actor.email} removed blocked by issue {issue.project.identifier}-{issue.sequence_id}",
                         old_identifier=issue.id,
                     )
                 )
@@ -517,7 +517,7 @@ def create_issue_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"created the issue",
+            comment=f"{actor.email} created the issue",
             verb="created",
             actor=actor,
         )
@@ -539,7 +539,7 @@ def track_estimate_points(
                     field="estimate_point",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the estimate point to None",
+                    comment=f"{actor.email} updated the estimate point to None",
                 )
             )
         else:
@@ -553,7 +553,7 @@ def track_estimate_points(
                     field="estimate_point",
                     project=project,
                     workspace=project.workspace,
-                    comment=f"updated the estimate point to {requested_data.get('estimate_point')}",
+                    comment=f"{actor.email} updated the estimate point to {requested_data.get('estimate_point')}",
                 )
             )
 
@@ -567,7 +567,7 @@ def track_archive_at(
                 issue_id=issue_id,
                 project=project,
                 workspace=project.workspace,
-                comment=f"has restored the issue",
+                comment=f"{actor.email} has restored the issue",
                 verb="updated",
                 actor=actor,
                 field="archived_at",
@@ -661,7 +661,7 @@ def delete_issue_activity(
         IssueActivity(
             project=project,
             workspace=project.workspace,
-            comment=f"deleted the issue",
+            comment=f"{actor.email} deleted the issue",
             verb="deleted",
             actor=actor,
             field="issue",
@@ -682,7 +682,7 @@ def create_comment_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"created a comment",
+            comment=f"{actor.email} created a comment",
             verb="created",
             actor=actor,
             field="comment",
@@ -707,7 +707,7 @@ def update_comment_activity(
                 issue_id=issue_id,
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated a comment",
+                comment=f"{actor.email} updated a comment",
                 verb="updated",
                 actor=actor,
                 field="comment",
@@ -728,7 +728,7 @@ def delete_comment_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"deleted the comment",
+            comment=f"{actor.email} deleted the comment",
             verb="deleted",
             actor=actor,
             field="comment",
@@ -766,7 +766,7 @@ def create_cycle_issue_activity(
                 field="cycles",
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated cycle from {old_cycle.name} to {new_cycle.name}",
+                comment=f"{actor.email} updated cycle from {old_cycle.name} to {new_cycle.name}",
                 old_identifier=old_cycle.id,
                 new_identifier=new_cycle.id,
             )
@@ -787,7 +787,7 @@ def create_cycle_issue_activity(
                 field="cycles",
                 project=project,
                 workspace=project.workspace,
-                comment=f"added cycle {cycle.name}",
+                comment=f"{actor.email} added cycle {cycle.name}",
                 new_identifier=cycle.id,
             )
         )
@@ -816,7 +816,7 @@ def delete_cycle_issue_activity(
                 field="cycles",
                 project=project,
                 workspace=project.workspace,
-                comment=f"removed this issue from {cycle.name if cycle is not None else None}",
+                comment=f"{actor.email} removed this issue from {cycle.name if cycle is not None else None}",
                 old_identifier=cycle.id if cycle is not None else None,
             )
         )
@@ -852,7 +852,7 @@ def create_module_issue_activity(
                 field="modules",
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated module from {old_module.name} to {new_module.name}",
+                comment=f"{actor.email} updated module from {old_module.name} to {new_module.name}",
                 old_identifier=old_module.id,
                 new_identifier=new_module.id,
             )
@@ -872,7 +872,7 @@ def create_module_issue_activity(
                 field="modules",
                 project=project,
                 workspace=project.workspace,
-                comment=f"added module {module.name}",
+                comment=f"{actor.email} added module {module.name}",
                 new_identifier=module.id,
             )
         )
@@ -901,7 +901,7 @@ def delete_module_issue_activity(
                 field="modules",
                 project=project,
                 workspace=project.workspace,
-                comment=f"removed this issue from {module.name if module is not None else None}",
+                comment=f"{actor.email} removed this issue from {module.name if module is not None else None}",
                 old_identifier=module.id if module is not None else None,
             )
         )
@@ -920,7 +920,7 @@ def create_link_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"created a link",
+            comment=f"{actor.email} created a link",
             verb="created",
             actor=actor,
             field="link",
@@ -944,7 +944,7 @@ def update_link_activity(
                 issue_id=issue_id,
                 project=project,
                 workspace=project.workspace,
-                comment=f"updated a link",
+                comment=f"{actor.email} updated a link",
                 verb="updated",
                 actor=actor,
                 field="link",
@@ -969,7 +969,7 @@ def delete_link_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"deleted the link",
+            comment=f"{actor.email} deleted the link",
             verb="deleted",
             actor=actor,
             field="link",
@@ -992,7 +992,7 @@ def create_attachment_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"created an attachment",
+            comment=f"{actor.email} created an attachment",
             verb="created",
             actor=actor,
             field="attachment",
@@ -1010,7 +1010,7 @@ def delete_attachment_activity(
             issue_id=issue_id,
             project=project,
             workspace=project.workspace,
-            comment=f"deleted the attachment",
+            comment=f"{actor.email} deleted the attachment",
             verb="deleted",
             actor=actor,
             field="attachment",

apiserver/plane/bgtasks/project_issue_export.py

@@ -1,191 +0,0 @@
-# Python imports
-import csv
-import io
-
-# Django imports
-from django.core.mail import EmailMultiAlternatives
-from django.template.loader import render_to_string
-from django.utils.html import strip_tags
-from django.conf import settings
-from django.utils import timezone
-
-# Third party imports
-from celery import shared_task
-from sentry_sdk import capture_exception
-
-# Module imports
-from plane.db.models import Issue
-
-@shared_task
-def issue_export_task(email, data, slug, exporter_name):
-    try:
-
-        project_ids = data.get("project_id", [])
-        issues_filter = {"workspace__slug": slug}
-
-        if project_ids:
-            issues_filter["project_id__in"] = project_ids
-
-        issues = (
-                Issue.objects.filter(**issues_filter)
-                .select_related("project", "workspace", "state", "parent", "created_by")
-                .prefetch_related(
-                    "assignees", "labels", "issue_cycle__cycle", "issue_module__module"
-                )
-                .values_list(
-                    "project__identifier",
-                    "sequence_id",
-                    "name",
-                    "description_stripped",
-                    "priority",
-                    "start_date",
-                    "target_date",
-                    "state__name",
-                    "project__name",
-                    "created_at",
-                    "updated_at",
-                    "completed_at",
-                    "archived_at",
-                    "issue_cycle__cycle__name",
-                    "issue_cycle__cycle__start_date",
-                    "issue_cycle__cycle__end_date",
-                    "issue_module__module__name",
-                    "issue_module__module__start_date",
-                    "issue_module__module__target_date",
-                    "created_by__first_name",
-                    "created_by__last_name",
-                    "assignees__first_name",
-                    "assignees__last_name",
-                    "labels__name",
-                )
-            )
-
-        # CSV header
-        header = [
-            "Issue ID",
-            "Project",
-            "Name",
-            "Description",
-            "State",
-            "Priority",
-            "Created By",
-            "Assignee",
-            "Labels",
-            "Cycle Name",
-            "Cycle Start Date",
-            "Cycle End Date",
-            "Module Name",
-            "Module Start Date",
-            "Module Target Date",
-            "Created At"
-            "Updated At"
-            "Completed At"
-            "Archived At"
-        ]
-
-        # Prepare the CSV data
-        rows = [header]
-
-        # Write data for each issue
-        for issue in issues:
-            (
-                project_identifier,
-                sequence_id,
-                name,
-                description,
-                priority,
-                start_date,
-                target_date,
-                state_name,
-                project_name,
-                created_at,
-                updated_at,
-                completed_at,
-                archived_at,
-                cycle_name,
-                cycle_start_date,
-                cycle_end_date,
-                module_name,
-                module_start_date,
-                module_target_date,
-                created_by_first_name,
-                created_by_last_name,
-                assignees_first_names,
-                assignees_last_names,
-                labels_names,
-            ) = issue
-            
-            created_by_fullname = (
-                f"{created_by_first_name} {created_by_last_name}"
-                if created_by_first_name and created_by_last_name
-                else ""
-            )
-
-            assignees_names = ""
-            if assignees_first_names and assignees_last_names:
-                assignees_names = ", ".join(
-                    [
-                        f"{assignees_first_name} {assignees_last_name}"
-                        for assignees_first_name, assignees_last_name in zip(
-                            assignees_first_names, assignees_last_names
-                        )
-                    ]
-                )
-
-            labels_names = ", ".join(labels_names) if labels_names else ""
-
-            row = [
-                f"{project_identifier}-{sequence_id}",
-                project_name,
-                name,
-                description,
-                state_name,
-                priority,
-                created_by_fullname,
-                assignees_names,
-                labels_names,
-                cycle_name,
-                cycle_start_date,
-                cycle_end_date,
-                module_name,
-                module_start_date,
-                module_target_date,
-                start_date,
-                target_date,
-                created_at,
-                updated_at,
-                completed_at,
-                archived_at,
-            ]
-            rows.append(row)
-
-        # Create CSV file in-memory
-        csv_buffer = io.StringIO()
-        writer = csv.writer(csv_buffer, delimiter=",", quoting=csv.QUOTE_ALL)
-
-        # Write CSV data to the buffer
-        for row in rows:
-            writer.writerow(row)
-
-        subject = "Your Issue Export is ready"
-
-        context = {
-            "username": exporter_name,
-        }
-
-        html_content = render_to_string("emails/exports/issues.html", context)
-        text_content = strip_tags(html_content)
-
-        csv_buffer.seek(0)
-        msg = EmailMultiAlternatives(
-            subject, text_content, settings.EMAIL_FROM, [email]
-        )
-        msg.attach(f"{slug}-issues-{timezone.now().date()}.csv", csv_buffer.read(), "text/csv")
-        msg.send(fail_silently=False)
-
-    except Exception as e:
-        # Print logs if in DEBUG mode
-        if settings.DEBUG:
-            print(e)
-        capture_exception(e)
-        return

apiserver/plane/db/migrations/0039_auto_20230723_2203.py

@@ -89,8 +89,8 @@ class Migration(migrations.Migration):
             field=models.JSONField(default=plane.db.models.workspace.get_default_props),
         ),
         migrations.AddField(
-            model_name='projectmember',
-            name='sort_order',
+            model_name="projectmember",
+            name="sort_order",
             field=models.FloatField(default=65535),
         ),
         migrations.RunPython(update_project_member_sort_order),

apiserver/plane/db/migrations/0040_projectmember_preferences_user_cover_image_and_more.py

@@ -1,81 +0,0 @@
-# Generated by Django 4.2.3 on 2023-08-01 06:02
-
-from django.conf import settings
-from django.db import migrations, models
-import django.db.models.deletion
-import plane.db.models.project
-import uuid
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ('db', '0039_auto_20230723_2203'),
-    ]
-
-    operations = [
-        migrations.AddField(
-            model_name='projectmember',
-            name='preferences',
-            field=models.JSONField(default=plane.db.models.project.get_default_preferences),
-        ),
-        migrations.AddField(
-            model_name='user',
-            name='cover_image',
-            field=models.URLField(blank=True, max_length=800, null=True),
-        ),
-        migrations.CreateModel(
-            name='IssueReaction',
-            fields=[
-                ('created_at', models.DateTimeField(auto_now_add=True, verbose_name='Created At')),
-                ('updated_at', models.DateTimeField(auto_now=True, verbose_name='Last Modified At')),
-                ('id', models.UUIDField(db_index=True, default=uuid.uuid4, editable=False, primary_key=True, serialize=False, unique=True)),
-                ('reaction', models.CharField(max_length=20)),
-                ('actor', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='issue_reactions', to=settings.AUTH_USER_MODEL)),
-                ('created_by', models.ForeignKey(null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='%(class)s_created_by', to=settings.AUTH_USER_MODEL, verbose_name='Created By')),
-                ('issue', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='issue_reactions', to='db.issue')),
-                ('project', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='project_%(class)s', to='db.project')),
-                ('updated_by', models.ForeignKey(null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='%(class)s_updated_by', to=settings.AUTH_USER_MODEL, verbose_name='Last Modified By')),
-                ('workspace', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='workspace_%(class)s', to='db.workspace')),
-            ],
-            options={
-                'verbose_name': 'Issue Reaction',
-                'verbose_name_plural': 'Issue Reactions',
-                'db_table': 'issue_reactions',
-                'ordering': ('-created_at',),
-                'unique_together': {('issue', 'actor', 'reaction')},
-            },
-        ),
-        migrations.CreateModel(
-            name='CommentReaction',
-            fields=[
-                ('created_at', models.DateTimeField(auto_now_add=True, verbose_name='Created At')),
-                ('updated_at', models.DateTimeField(auto_now=True, verbose_name='Last Modified At')),
-                ('id', models.UUIDField(db_index=True, default=uuid.uuid4, editable=False, primary_key=True, serialize=False, unique=True)),
-                ('reaction', models.CharField(max_length=20)),
-                ('actor', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='comment_reactions', to=settings.AUTH_USER_MODEL)),
-                ('comment', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='comment_reactions', to='db.issuecomment')),
-                ('created_by', models.ForeignKey(null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='%(class)s_created_by', to=settings.AUTH_USER_MODEL, verbose_name='Created By')),
-                ('project', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='project_%(class)s', to='db.project')),
-                ('updated_by', models.ForeignKey(null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='%(class)s_updated_by', to=settings.AUTH_USER_MODEL, verbose_name='Last Modified By')),
-                ('workspace', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='workspace_%(class)s', to='db.workspace')),
-            ],
-            options={
-                'verbose_name': 'Comment Reaction',
-                'verbose_name_plural': 'Comment Reactions',
-                'db_table': 'comment_reactions',
-                'ordering': ('-created_at',),
-                'unique_together': {('comment', 'actor', 'reaction')},
-            },
-        ),       
-        migrations.AlterField(
-            model_name='project',
-            name='identifier',
-            field=models.CharField(max_length=12, verbose_name='Project Identifier'),
-        ),
-        migrations.AlterField(
-            model_name='projectidentifier',
-            name='name',
-            field=models.CharField(max_length=12),
-        ),
-    ]

apiserver/plane/db/migrations/0041_user_display_name_alter_analyticview_created_by_and_more.py

@@ -1,101 +0,0 @@
-# Generated by Django 4.2.3 on 2023-08-04 09:12
-import string
-import random
-from django.conf import settings
-from django.db import migrations, models
-import django.db.models.deletion
-
-
-def generate_display_name(apps, schema_editor):
-    UserModel = apps.get_model("db", "User")
-    updated_users = []
-    for obj in UserModel.objects.all():
-        obj.display_name = (
-            obj.email.split("@")[0]
-            if len(obj.email.split("@"))
-            else "".join(random.choice(string.ascii_letters) for _ in range(6))
-        )
-        updated_users.append(obj)
-    UserModel.objects.bulk_update(updated_users, ["display_name"], batch_size=100)
-
-
-def rectify_field_issue_activity(apps, schema_editor):
-    Model = apps.get_model("db", "IssueActivity")
-    updated_activity = []
-    for obj in Model.objects.filter(field="assignee"):
-        obj.field = "assignees"
-        updated_activity.append(obj)
-
-    Model.objects.bulk_update(updated_activity, ["field"], batch_size=100)
-
-
-def update_assignee_issue_activity(apps, schema_editor):
-    Model = apps.get_model("db", "IssueActivity")
-    updated_activity = []
-
-    # Get all the users
-    User = apps.get_model("db", "User")
-    users = User.objects.values("id", "email", "display_name")
-
-    for obj in Model.objects.filter(field="assignees"):
-        if bool(obj.new_value) and not bool(obj.old_value):
-            # Get user from list
-            assigned_user = [
-                user for user in users if user.get("email") == obj.new_value
-            ]
-            if assigned_user:
-                obj.new_value = assigned_user[0].get("display_name")
-                obj.new_identifier = assigned_user[0].get("id")
-                # Update the comment
-                words = obj.comment.split()
-                words[-1] = assigned_user[0].get("display_name")
-                obj.comment = " ".join(words)
-
-        if bool(obj.old_value) and not bool(obj.new_value):
-            # Get user from list
-            assigned_user = [
-                user for user in users if user.get("email") == obj.old_value
-            ]
-            if assigned_user:
-                obj.old_value = assigned_user[0].get("display_name")
-                obj.old_identifier = assigned_user[0].get("id")
-                # Update the comment
-                words = obj.comment.split()
-                words[-1] = assigned_user[0].get("display_name")
-                obj.comment = " ".join(words)
-
-        updated_activity.append(obj)
-
-    Model.objects.bulk_update(
-        updated_activity,
-        ["old_value", "new_value", "old_identifier", "new_identifier", "comment"],
-        batch_size=200,
-    )
-
-
-def update_name_activity(apps, schema_editor):
-    Model = apps.get_model("db", "IssueActivity")
-    update_activity = []
-    for obj in Model.objects.filter(field="name"):
-        obj.comment = obj.comment.replace("start date", "name")
-        update_activity.append(obj)
-
-    Model.objects.bulk_update(update_activity, ["comment"], batch_size=1000)
-
-
-class Migration(migrations.Migration):
-    dependencies = [
-        ("db", "0040_projectmember_preferences_user_cover_image_and_more"),
-    ]
-
-    operations = [
-        migrations.AddField(
-            model_name="user",
-            name="display_name",
-            field=models.CharField(default="", max_length=255),
-        ),
-        migrations.RunPython(generate_display_name),
-        migrations.RunPython(rectify_field_issue_activity),
-        migrations.RunPython(update_assignee_issue_activity),
-        migrations.RunPython(update_name_activity),
-    ]

apiserver/plane/db/models/project.py

@@ -161,7 +161,7 @@ class ProjectMember(ProjectBaseModel):
     def save(self, *args, **kwargs):
         if self._state.adding:
             smallest_sort_order = ProjectMember.objects.filter(
-                workspace_id=self.project.workspace_id, member=self.member
+                workspace_id=self.project.workspace_id, member_id=self.member_id
             ).aggregate(smallest=models.Min("sort_order"))["smallest"]
 
             # Project ordering

apiserver/plane/db/models/user.py

@@ -1,7 +1,6 @@
 # Python imports
+from enum import unique
 import uuid
-import string
-import random
 
 # Django imports
 from django.db import models
@@ -19,7 +18,6 @@ from sentry_sdk import capture_exception
 from slack_sdk import WebClient
 from slack_sdk.errors import SlackApiError
 
-
 def get_default_onboarding():
     return {
         "profile_complete": False,
@@ -28,7 +26,6 @@ def get_default_onboarding():
         "workspace_join": False,
     }
 
-
 class User(AbstractBaseUser, PermissionsMixin):
     id = models.UUIDField(
         default=uuid.uuid4, unique=True, editable=False, db_index=True, primary_key=True
@@ -84,7 +81,6 @@ class User(AbstractBaseUser, PermissionsMixin):
     role = models.CharField(max_length=300, null=True, blank=True)
     is_bot = models.BooleanField(default=False)
     theme = models.JSONField(default=dict)
-    display_name = models.CharField(max_length=255, default="")
     is_tour_completed = models.BooleanField(default=False)
     onboarding_step = models.JSONField(default=get_default_onboarding)
 
@@ -111,13 +107,6 @@ class User(AbstractBaseUser, PermissionsMixin):
             self.token = uuid.uuid4().hex + uuid.uuid4().hex
             self.token_updated_at = timezone.now()
 
-        if not self.display_name:
-            self.display_name = (
-                self.email.split("@")[0]
-                if len(self.email.split("@"))
-                else "".join(random.choice(string.ascii_letters) for _ in range(6))
-            )
-
         if self.is_superuser:
             self.is_staff = True
 

apiserver/templates/emails/exports/issues.html

@@ -1,9 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html>
-    Dear {{username}},<br/>
-    Your requested Issue's data has been successfully exported from Plane. The export includes all relevant information about issues you requested from your selected projects.</br>
-    Please find the attachment and download the CSV file. If you have any questions or need further assistance, please don't hesitate to contact our support team at <a href = "mailto: engineering@plane.com">engineering@plane.so</a>. We're here to help!</br>
-    Thank you for using Plane. We hope this export will aid you in effectively managing your projects.</br>
-    Regards,
-    Team Plane
-</html>

apps/app/components/analytics/custom-analytics/graph/custom-tooltip.tsx

@@ -14,17 +14,17 @@ type Props = {
 export const CustomTooltip: React.FC<Props> = ({ datum, analytics, params }) => {
   let tooltipValue: string | number = "";
 
-  const renderAssigneeName = (assigneeId: string): string => {
-    const assignee = analytics.extras.assignee_details.find((a) => a.assignees__id === assigneeId);
-
-    if (!assignee) return "No assignee";
-
-    return assignee.assignees__display_name || "No assignee";
-  };
-
   if (params.segment) {
     if (DATE_KEYS.includes(params.segment)) tooltipValue = renderMonthAndYear(datum.id);
-    else tooltipValue = datum.id;
+    else if (params.segment === "assignees__email") {
+      const assignee = analytics.extras.assignee_details.find(
+        (a) => a.assignees__email === datum.id
+      );
+
+      if (assignee)
+        tooltipValue = assignee.assignees__first_name + " " + assignee.assignees__last_name;
+      else tooltipValue = "No assignees";
+    } else tooltipValue = datum.id;
   } else {
     if (DATE_KEYS.includes(params.x_axis)) tooltipValue = datum.indexValue;
     else tooltipValue = datum.id === "count" ? "Issue count" : "Estimate";
@@ -49,10 +49,7 @@ export const CustomTooltip: React.FC<Props> = ({ datum, analytics, params }) =>
             : ""
         }`}
       >
-        {params.segment === "assignees__id"
-          ? renderAssigneeName(tooltipValue.toString())
-          : tooltipValue}
-        :
+        {tooltipValue}:
       </span>
       <span>{datum.value}</span>
     </div>

apps/app/components/analytics/custom-analytics/graph/index.tsx

@@ -29,14 +29,6 @@ export const AnalyticsGraph: React.FC<Props> = ({
   yAxisKey,
   fullScreen,
 }) => {
-  const renderAssigneeName = (assigneeId: string): string => {
-    const assignee = analytics.extras.assignee_details.find((a) => a.assignees__id === assigneeId);
-
-    if (!assignee) return "?";
-
-    return assignee.assignees__display_name || "?";
-  };
-
   const generateYAxisTickValues = () => {
     if (!analytics) return [];
 
@@ -78,17 +70,17 @@ export const AnalyticsGraph: React.FC<Props> = ({
       height={fullScreen ? "400px" : "300px"}
       margin={{
         right: 20,
-        bottom: params.x_axis === "assignees__id" ? 50 : longestXAxisLabel.length * 5 + 20,
+        bottom: params.x_axis === "assignees__email" ? 50 : longestXAxisLabel.length * 5 + 20,
       }}
       axisBottom={{
         tickSize: 0,
         tickPadding: 10,
         tickRotation: barGraphData.data.length > 7 ? -45 : 0,
         renderTick:
-          params.x_axis === "assignees__id"
+          params.x_axis === "assignees__email"
             ? (datum) => {
                 const avatar = analytics.extras.assignee_details?.find(
-                  (a) => a?.assignees__display_name === datum?.value
+                  (a) => a?.assignees__email === datum?.value
                 )?.assignees__avatar;
 
                 if (avatar && avatar !== "")
@@ -109,11 +101,7 @@ export const AnalyticsGraph: React.FC<Props> = ({
                     <g transform={`translate(${datum.x},${datum.y})`}>
                       <circle cy={18} r={8} fill="#374151" />
                       <text x={0} y={21} textAnchor="middle" fontSize={9} fill="#ffffff">
-                        {params.x_axis === "assignees__id"
-                          ? datum.value && datum.value !== "None"
-                            ? renderAssigneeName(datum.value)[0].toUpperCase()
-                            : "?"
-                          : datum.value && datum.value !== "None"
+                        {datum.value && datum.value !== "None"
                           ? `${datum.value}`.toUpperCase()[0]
                           : "?"}
                       </text>

apps/app/components/analytics/custom-analytics/sidebar.tsx

@@ -277,7 +277,9 @@ export const AnalyticsSidebar: React.FC<Props> = ({
                   <div className="space-y-4 mt-4">
                     <div className="flex items-center gap-2 text-xs">
                       <h6 className="text-custom-text-200">Lead</h6>
-                      <span>{cycleDetails.owned_by?.display_name}</span>
+                      <span>
+                        {cycleDetails.owned_by?.first_name} {cycleDetails.owned_by?.last_name}
+                      </span>
                     </div>
                     <div className="flex items-center gap-2 text-xs">
                       <h6 className="text-custom-text-200">Start Date</h6>
@@ -303,7 +305,10 @@ export const AnalyticsSidebar: React.FC<Props> = ({
                   <div className="space-y-4 mt-4">
                     <div className="flex items-center gap-2 text-xs">
                       <h6 className="text-custom-text-200">Lead</h6>
-                      <span>{moduleDetails.lead_detail?.display_name}</span>
+                      <span>
+                        {moduleDetails.lead_detail?.first_name}{" "}
+                        {moduleDetails.lead_detail?.last_name}
+                      </span>
                     </div>
                     <div className="flex items-center gap-2 text-xs">
                       <h6 className="text-custom-text-200">Start Date</h6>

apps/app/components/analytics/custom-analytics/table.tsx

@@ -22,12 +22,15 @@ type Props = {
 };
 
 export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, params, yAxisKey }) => {
-  const renderAssigneeName = (assigneeId: string): string => {
-    const assignee = analytics.extras.assignee_details.find((a) => a.assignees__id === assigneeId);
+  const renderAssigneeName = (email: string): string => {
+    const assignee = analytics.extras.assignee_details.find((a) => a.assignees__email === email);
 
     if (!assignee) return "No assignee";
 
-    return assignee.assignees__display_name || "No assignee";
+    if (assignee.assignees__first_name !== "")
+      return assignee.assignees__first_name + " " + assignee.assignees__last_name;
+
+    return email;
   };
 
   return (
@@ -62,10 +65,10 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
                             }}
                           />
                         )}
-                        {params.segment === "assignees__id"
-                          ? renderAssigneeName(key)
-                          : DATE_KEYS.includes(params.segment ?? "")
+                        {DATE_KEYS.includes(params.segment ?? "")
                           ? renderMonthAndYear(key)
+                          : params.segment === "assignees__email"
+                          ? renderAssigneeName(key)
                           : key}
                       </div>
                     </th>
@@ -105,7 +108,7 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
                         }}
                       />
                     )}
-                    {params.x_axis === "assignees__id"
+                    {params.x_axis === "assignees__email"
                       ? renderAssigneeName(`${item.name}`)
                       : addSpaceIfCamelCase(`${item.name}`)}
                   </td>

apps/app/components/analytics/scope-and-demand/leaderboard.tsx

@@ -1,7 +1,7 @@
 type Props = {
   users: {
     avatar: string | null;
-    display_name: string | null;
+    email: string | null;
     firstName: string;
     lastName: string;
     count: number;
@@ -16,7 +16,7 @@ export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => (
       <div className="mt-3 space-y-3">
         {users.map((user) => (
           <div
-            key={user.display_name ?? "None"}
+            key={user.email ?? "None"}
             className="flex items-start justify-between gap-4 text-xs"
           >
             <div className="flex items-center gap-2">
@@ -25,16 +25,16 @@ export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => (
                   <img
                     src={user.avatar}
                     className="absolute top-0 left-0 h-full w-full object-cover rounded-full"
-                    alt={user.display_name ?? "None"}
+                    alt={user.email ?? "None"}
                   />
                 </div>
               ) : (
                 <div className="grid place-items-center flex-shrink-0 rounded-full bg-gray-700 text-[11px] capitalize text-white h-4 w-4">
-                  {user.display_name !== "" ? user?.display_name?.[0] : "?"}
+                  {user.firstName !== "" ? user.firstName[0] : "?"}
                 </div>
               )}
               <span className="break-words text-custom-text-200">
-                {user.display_name !== "" ? `${user.display_name}` : "No assignee"}
+                {user.firstName !== "" ? `${user.firstName} ${user.lastName}` : "No assignee"}
               </span>
             </div>
             <span className="flex-shrink-0">{user.count}</span>

apps/app/components/analytics/scope-and-demand/scope-and-demand.tsx

@@ -56,9 +56,9 @@ export const ScopeAndDemand: React.FC<Props> = ({ fullScreen = true }) => {
               <AnalyticsLeaderboard
                 users={defaultAnalytics.most_issue_created_user?.map((user) => ({
                   avatar: user?.created_by__avatar,
+                  email: user?.created_by__email,
                   firstName: user?.created_by__first_name,
                   lastName: user?.created_by__last_name,
-                  display_name: user?.created_by__display_name,
                   count: user?.count,
                 }))}
                 title="Most issues created"
@@ -66,9 +66,9 @@ export const ScopeAndDemand: React.FC<Props> = ({ fullScreen = true }) => {
               <AnalyticsLeaderboard
                 users={defaultAnalytics.most_issue_closed_user?.map((user) => ({
                   avatar: user?.assignees__avatar,
+                  email: user?.assignees__email,
                   firstName: user?.assignees__first_name,
                   lastName: user?.assignees__last_name,
-                  display_name: user?.assignees__display_name,
                   count: user?.count,
                 }))}
                 title="Most issues closed"

apps/app/components/analytics/scope-and-demand/scope.tsx

@@ -16,20 +16,23 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
         {defaultAnalytics.pending_issue_user.length > 0 ? (
           <BarGraph
             data={defaultAnalytics.pending_issue_user}
-            indexBy="assignees__display_name"
+            indexBy="assignees__email"
             keys={["count"]}
             height="250px"
             colors={() => `#f97316`}
             customYAxisTickValues={defaultAnalytics.pending_issue_user.map((d) => d.count)}
             tooltip={(datum) => {
               const assignee = defaultAnalytics.pending_issue_user.find(
-                (a) => a.assignees__display_name === `${datum.indexValue}`
+                (a) => a.assignees__email === `${datum.indexValue}`
               );
 
               return (
                 <div className="rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
                   <span className="font-medium text-custom-text-200">
-                    {assignee ? assignee.assignees__display_name : "No assignee"}:{" "}
+                    {assignee
+                      ? assignee.assignees__first_name + " " + assignee.assignees__last_name
+                      : "No assignee"}
+                    :{" "}
                   </span>
                   {datum.value}
                 </div>

apps/app/components/command-palette/change-interface-theme.tsx

@@ -5,8 +5,6 @@ import { Command } from "cmdk";
 import { THEMES_OBJ } from "constants/themes";
 import { useTheme } from "next-themes";
 import { SettingIcon } from "components/icons";
-import userService from "services/user.service";
-import useUser from "hooks/use-user";
 
 type Props = {
   setIsPaletteOpen: Dispatch<SetStateAction<boolean>>;
@@ -14,50 +12,24 @@ type Props = {
 
 export const ChangeInterfaceTheme: React.FC<Props> = ({ setIsPaletteOpen }) => {
   const [mounted, setMounted] = useState(false);
-
   const { setTheme } = useTheme();
 
-  const { user, mutateUser } = useUser();
-
-  const updateUserTheme = (newTheme: string) => {
-    if (!user) return;
-
-    setTheme(newTheme);
-
-    mutateUser((prevData) => {
-      if (!prevData) return prevData;
-
-      return {
-        ...prevData,
-        theme: {
-          ...prevData.theme,
-          theme: newTheme,
-        },
-      };
-    }, false);
-
-    userService.updateUser({
-      theme: {
-        ...user.theme,
-        theme: newTheme,
-      },
-    });
-  };
-
   // useEffect only runs on the client, so now we can safely show the UI
   useEffect(() => {
     setMounted(true);
   }, []);
 
-  if (!mounted) return null;
+  if (!mounted) {
+    return null;
+  }
 
   return (
     <>
-      {THEMES_OBJ.filter((t) => t.value !== "custom").map((theme) => (
+      {THEMES_OBJ.map((theme) => (
         <Command.Item
           key={theme.value}
           onSelect={() => {
-            updateUserTheme(theme.value);
+            setTheme(theme.value);
             setIsPaletteOpen(false);
           }}
           className="focus:outline-none"

apps/app/components/command-palette/command-pallette.tsx

@@ -24,12 +24,8 @@ import issuesService from "services/issues.service";
 import inboxService from "services/inbox.service";
 // fetch keys
 import { INBOX_LIST, ISSUE_DETAILS } from "constants/fetch-keys";
-// mobx store
-import { useMobxStore } from "lib/mobx/store-provider";
 
 export const CommandPalette: React.FC = () => {
-  const store: any = useMobxStore();
-
   const [isPaletteOpen, setIsPaletteOpen] = useState(false);
   const [isIssueModalOpen, setIsIssueModalOpen] = useState(false);
   const [isProjectModalOpen, setIsProjectModalOpen] = useState(false);
@@ -78,36 +74,37 @@ export const CommandPalette: React.FC = () => {
 
   const handleKeyDown = useCallback(
     (e: KeyboardEvent) => {
-      // if on input, textarea or editor, don't do anything
-      if (
-        e.target instanceof HTMLTextAreaElement ||
-        e.target instanceof HTMLInputElement ||
-        (e.target as Element).classList?.contains("remirror-editor")
-      )
-        return;
-
+      const singleShortcutKeys = ["p", "v", "d", "h", "q", "m"];
       const { key, ctrlKey, metaKey, altKey, shiftKey } = e;
-
       if (!key) return;
-
       const keyPressed = key.toLowerCase();
-
-      const cmdClicked = ctrlKey || metaKey;
-
-      if (cmdClicked) {
-        if (keyPressed === "k") {
+      if (
+        !(e.target instanceof HTMLTextAreaElement) &&
+        !(e.target instanceof HTMLInputElement) &&
+        !(e.target as Element).classList?.contains("remirror-editor")
+      ) {
+        if ((ctrlKey || metaKey) && keyPressed === "k") {
           e.preventDefault();
           setIsPaletteOpen(true);
-        } else if (keyPressed === "c" && altKey) {
+        } else if ((ctrlKey || metaKey) && keyPressed === "c") {
+          if (altKey) {
+            e.preventDefault();
+            copyIssueUrlToClipboard();
+          }
+        } else if (keyPressed === "c") {
           e.preventDefault();
-          copyIssueUrlToClipboard();
-        } else if (keyPressed === "b") {
+          setIsIssueModalOpen(true);
+        } else if ((ctrlKey || metaKey) && keyPressed === "b") {
           e.preventDefault();
           toggleCollapsed();
-        }
-      } else {
-        if (keyPressed === "c") {
-          setIsIssueModalOpen(true);
+        } else if (key === "Delete") {
+          e.preventDefault();
+          setIsBulkDeleteIssuesModalOpen(true);
+        } else if (
+          singleShortcutKeys.includes(keyPressed) &&
+          (ctrlKey || metaKey || altKey || shiftKey)
+        ) {
+          e.preventDefault();
         } else if (keyPressed === "p") {
           setIsProjectModalOpen(true);
         } else if (keyPressed === "v") {
@@ -120,13 +117,10 @@ export const CommandPalette: React.FC = () => {
           setIsCreateCycleModalOpen(true);
         } else if (keyPressed === "m") {
           setIsCreateModuleModalOpen(true);
-        } else if (keyPressed === "backspace" || keyPressed === "delete") {
-          e.preventDefault();
-          setIsBulkDeleteIssuesModalOpen(true);
         }
       }
     },
-    [copyIssueUrlToClipboard, toggleCollapsed]
+    [toggleCollapsed, copyIssueUrlToClipboard]
   );
 
   useEffect(() => {

apps/app/components/command-palette/issue/change-issue-assignee.tsx

@@ -34,12 +34,15 @@ export const ChangeIssueAssignee: React.FC<Props> = ({ setIsPaletteOpen, issue,
   const options =
     members?.map(({ member }) => ({
       value: member.id,
-      query: member.display_name,
+      query:
+        (member.first_name && member.first_name !== "" ? member.first_name : member.email) +
+          " " +
+          member.last_name ?? "",
       content: (
         <>
           <div className="flex items-center gap-2">
             <Avatar user={member} />
-            {member.display_name}
+            {member.first_name && member.first_name !== "" ? member.first_name : member.email}
           </div>
           {issue.assignees.includes(member.id) && (
             <div>

apps/app/components/core/feeds.tsx

@@ -0,0 +1,331 @@
+import React from "react";
+
+import Link from "next/link";
+
+// icons
+import {
+  ArrowTopRightOnSquareIcon,
+  ChatBubbleLeftEllipsisIcon,
+  Squares2X2Icon,
+} from "@heroicons/react/24/outline";
+import { BlockedIcon, BlockerIcon } from "components/icons";
+import { Icon } from "components/ui";
+// helpers
+import { renderShortDateWithYearFormat, timeAgo } from "helpers/date-time.helper";
+import { addSpaceIfCamelCase } from "helpers/string.helper";
+// types
+import RemirrorRichTextEditor from "components/rich-text-editor";
+
+const activityDetails: {
+  [key: string]: {
+    message?: string;
+    icon: JSX.Element;
+  };
+} = {
+  assignee: {
+    message: "removed the assignee",
+    icon: <Icon iconName="group" className="!text-sm" aria-hidden="true" />,
+  },
+  assignees: {
+    message: "added a new assignee",
+    icon: <Icon iconName="group" className="!text-sm" aria-hidden="true" />,
+  },
+  blocks: {
+    message: "marked this issue being blocked by",
+    icon: <BlockedIcon height="12" width="12" color="#6b7280" />,
+  },
+  blocking: {
+    message: "marked this issue is blocking",
+    icon: <BlockerIcon height="12" width="12" color="#6b7280" />,
+  },
+  cycles: {
+    message: "set the cycle to",
+    icon: <Icon iconName="contrast" className="!text-sm" aria-hidden="true" />,
+  },
+  labels: {
+    icon: <Icon iconName="sell" className="!text-sm" aria-hidden="true" />,
+  },
+  modules: {
+    message: "set the module to",
+    icon: <Icon iconName="dataset" className="!text-sm" aria-hidden="true" />,
+  },
+  state: {
+    message: "set the state to",
+    icon: <Squares2X2Icon className="h-3 w-3 text-custom-text-200" aria-hidden="true" />,
+  },
+  priority: {
+    message: "set the priority to",
+    icon: <Icon iconName="signal_cellular_alt" className="!text-sm" aria-hidden="true" />,
+  },
+  name: {
+    message: "set the name to",
+    icon: <Icon iconName="chat" className="!text-sm" aria-hidden="true" />,
+  },
+  description: {
+    message: "updated the description.",
+    icon: <Icon iconName="chat" className="!text-sm" aria-hidden="true" />,
+  },
+  estimate_point: {
+    message: "set the estimate point to",
+    icon: <Icon iconName="change_history" className="!text-sm" aria-hidden="true" />,
+  },
+  target_date: {
+    message: "set the due date to",
+    icon: <Icon iconName="calendar_today" className="!text-sm" aria-hidden="true" />,
+  },
+  parent: {
+    message: "set the parent to",
+    icon: <Icon iconName="supervised_user_circle" className="!text-sm" aria-hidden="true" />,
+  },
+  issue: {
+    message: "deleted the issue.",
+    icon: <Icon iconName="delete" className="!text-sm" aria-hidden="true" />,
+  },
+  estimate: {
+    message: "updated the estimate",
+    icon: <Icon iconName="change_history" className="!text-sm" aria-hidden="true" />,
+  },
+  link: {
+    message: "updated the link",
+    icon: <Icon iconName="link" className="!text-sm" aria-hidden="true" />,
+  },
+  attachment: {
+    message: "updated the attachment",
+    icon: <Icon iconName="attach_file" className="!text-sm" aria-hidden="true" />,
+  },
+  archived_at: {
+    message: "archived",
+    icon: <Icon iconName="archive" className="!text-sm text-custom-text-200" aria-hidden="true" />,
+  },
+};
+
+export const Feeds: React.FC<any> = ({ activities }) => (
+  <div>
+    <ul role="list" className="-mb-4">
+      {activities.map((activity: any, activityIdx: number) => {
+        // determines what type of action is performed
+        let action = activityDetails[activity.field as keyof typeof activityDetails]?.message;
+        if (activity.field === "labels") {
+          action = activity.new_value !== "" ? "added a new label" : "removed the label";
+        } else if (activity.field === "blocking") {
+          action =
+            activity.new_value !== ""
+              ? "marked this issue is blocking"
+              : "removed the issue from blocking";
+        } else if (activity.field === "blocks") {
+          action =
+            activity.new_value !== "" ? "marked this issue being blocked by" : "removed blocker";
+        } else if (activity.field === "target_date") {
+          action =
+            activity.new_value && activity.new_value !== ""
+              ? "set the due date to"
+              : "removed the due date";
+        } else if (activity.field === "parent") {
+          action =
+            activity.new_value && activity.new_value !== ""
+              ? "set the parent to"
+              : "removed the parent";
+        } else if (activity.field === "priority") {
+          action =
+            activity.new_value && activity.new_value !== ""
+              ? "set the priority to"
+              : "removed the priority";
+        } else if (activity.field === "description") {
+          action = "updated the";
+        } else if (activity.field === "attachment") {
+          action = `${activity.verb} the`;
+        } else if (activity.field === "link") {
+          action = `${activity.verb} the`;
+        } else if (activity.field === "archived_at") {
+          action =
+            activity.new_value && activity.new_value === "restore"
+              ? "restored the issue"
+              : "archived the issue";
+        }
+        // for values that are after the action clause
+        let value: any = activity.new_value ? activity.new_value : activity.old_value;
+        if (
+          activity.verb === "created" &&
+          activity.field !== "cycles" &&
+          activity.field !== "modules" &&
+          activity.field !== "attachment" &&
+          activity.field !== "link" &&
+          activity.field !== "estimate"
+        ) {
+          const { workspace_detail, project, issue } = activity;
+          value = (
+            <span className="text-custom-text-200">
+              created{" "}
+              <Link href={`/${workspace_detail.slug}/projects/${project}/issues/${issue}`}>
+                <a className="inline-flex items-center hover:underline">
+                  this issue. <ArrowTopRightOnSquareIcon className="ml-1 h-3.5 w-3.5" />
+                </a>
+              </Link>
+            </span>
+          );
+        } else if (activity.field === "state") {
+          value = activity.new_value ? addSpaceIfCamelCase(activity.new_value) : "None";
+        } else if (activity.field === "labels") {
+          let name;
+          let id = "#000000";
+          if (activity.new_value !== "") {
+            name = activity.new_value;
+            id = activity.new_identifier ? activity.new_identifier : id;
+          } else {
+            name = activity.old_value;
+            id = activity.old_identifier ? activity.old_identifier : id;
+          }
+
+          value = name;
+        } else if (activity.field === "assignees") {
+          value = activity.new_value;
+        } else if (activity.field === "target_date") {
+          const date =
+            activity.new_value && activity.new_value !== ""
+              ? activity.new_value
+              : activity.old_value;
+          value = renderShortDateWithYearFormat(date as string);
+        } else if (activity.field === "description") {
+          value = "description";
+        } else if (activity.field === "attachment") {
+          value = "attachment";
+        } else if (activity.field === "link") {
+          value = "link";
+        } else if (activity.field === "estimate_point") {
+          value = activity.new_value
+            ? activity.new_value + ` Point${parseInt(activity.new_value ?? "", 10) > 1 ? "s" : ""}`
+            : "None";
+        }
+
+        if (activity.field === "comment") {
+          return (
+            <div key={activity.id} className="mt-2">
+              <div className="relative flex items-start space-x-3">
+                <div className="relative px-1">
+                  {activity.field ? (
+                    activity.new_value === "restore" ? (
+                      <Icon iconName="history" className="text-sm text-custom-text-200" />
+                    ) : (
+                      activityDetails[activity.field as keyof typeof activityDetails]?.icon
+                    )
+                  ) : activity.actor_detail.avatar && activity.actor_detail.avatar !== "" ? (
+                    <img
+                      src={activity.actor_detail.avatar}
+                      alt={activity.actor_detail.first_name}
+                      height={30}
+                      width={30}
+                      className="grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-500 text-white"
+                    />
+                  ) : (
+                    <div
+                      className={`grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-500 text-white`}
+                    >
+                      {activity.actor_detail.first_name.charAt(0)}
+                    </div>
+                  )}
+
+                  <span className="absolute -bottom-0.5 -right-1 rounded-tl bg-custom-background-80 px-0.5 py-px">
+                    <ChatBubbleLeftEllipsisIcon
+                      className="h-3.5 w-3.5 text-custom-text-200"
+                      aria-hidden="true"
+                    />
+                  </span>
+                </div>
+                <div className="min-w-0 flex-1">
+                  <div>
+                    <div className="text-xs">
+                      {activity.actor_detail.first_name}
+                      {activity.actor_detail.is_bot ? "Bot" : " " + activity.actor_detail.last_name}
+                    </div>
+                    <p className="mt-0.5 text-xs text-custom-text-200">
+                      Commented {timeAgo(activity.created_at)}
+                    </p>
+                  </div>
+                  <div className="issue-comments-section p-0">
+                    <RemirrorRichTextEditor
+                      value={
+                        activity.new_value && activity.new_value !== ""
+                          ? activity.new_value
+                          : activity.old_value
+                      }
+                      editable={false}
+                      noBorder
+                      customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+          );
+        }
+
+        if ("field" in activity && activity.field !== "updated_by") {
+          return (
+            <li key={activity.id}>
+              <div className="relative pb-1">
+                {activities.length > 1 && activityIdx !== activities.length - 1 ? (
+                  <span
+                    className="absolute top-5 left-5 -ml-px h-full w-0.5 bg-custom-background-80"
+                    aria-hidden="true"
+                  />
+                ) : null}
+                <div className="relative flex items-start space-x-2">
+                  <>
+                    <div>
+                      <div className="relative px-1.5">
+                        <div className="mt-1.5">
+                          <div className="ring-6 flex h-7 w-7 items-center justify-center rounded-full bg-custom-background-80 text-custom-text-200 ring-white">
+                            {activity.field ? (
+                              activityDetails[activity.field as keyof typeof activityDetails]?.icon
+                            ) : activity.actor_detail.avatar &&
+                              activity.actor_detail.avatar !== "" ? (
+                              <img
+                                src={activity.actor_detail.avatar}
+                                alt={activity.actor_detail.first_name}
+                                height={24}
+                                width={24}
+                                className="rounded-full"
+                              />
+                            ) : (
+                              <div
+                                className={`grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-700 text-xs text-white`}
+                              >
+                                {activity.actor_detail.first_name.charAt(0)}
+                              </div>
+                            )}
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div className="min-w-0 flex-1 py-3">
+                      <div className="text-xs text-custom-text-200">
+                        {activity.field === "archived_at" && activity.new_value !== "restore" ? (
+                          <span className="text-gray font-medium">Plane</span>
+                        ) : (
+                          <span className="text-gray font-medium">
+                            {activity.actor_detail.first_name}
+                            {activity.actor_detail.is_bot
+                              ? " Bot"
+                              : " " + activity.actor_detail.last_name}
+                          </span>
+                        )}
+                        <span> {action} </span>
+                        {activity.field !== "archived_at" && (
+                          <span className="text-xs font-medium text-custom-text-100">
+                            {" "}
+                            {value}{" "}
+                          </span>
+                        )}
+                        <span className="whitespace-nowrap">{timeAgo(activity.created_at)}</span>
+                      </div>
+                    </div>
+                  </>
+                </div>
+              </div>
+            </li>
+          );
+        }
+      })}
+    </ul>
+  </div>
+);

apps/app/components/core/filters/filters-list.tsx

@@ -157,10 +157,10 @@ export const FiltersList: React.FC<Props> = ({
                         return (
                           <div
                             key={memberId}
-                            className="inline-flex items-center gap-x-1 rounded-full bg-custom-background-90 px-1"
+                            className="inline-flex items-center gap-x-1 rounded-full bg-custom-background-90 px-1 capitalize"
                           >
                             <Avatar user={member} />
-                            <span>{member?.display_name}</span>
+                            <span>{member?.first_name}</span>
                             <span
                               className="cursor-pointer"
                               onClick={() =>
@@ -184,7 +184,7 @@ export const FiltersList: React.FC<Props> = ({
                             className="inline-flex items-center gap-x-1 rounded-full bg-custom-background-90 px-1 capitalize"
                           >
                             <Avatar user={member} />
-                            <span>{member?.display_name}</span>
+                            <span>{member?.first_name}</span>
                             <span
                               className="cursor-pointer"
                               onClick={() =>

apps/app/components/core/filters/issues-view-filter.tsx

@@ -181,85 +181,78 @@ export const IssuesFilterView: React.FC = () => {
                       <>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Group by</h4>
-                          <div className="w-28">
-                            <CustomMenu
-                              label={
-                                GROUP_BY_OPTIONS.find((option) => option.key === groupByProperty)
-                                  ?.name ?? "Select"
-                              }
-                              className="!w-full"
-                              buttonClassName="w-full"
-                            >
-                              {GROUP_BY_OPTIONS.map((option) => {
-                                if (issueView === "kanban" && option.key === null) return null;
-                                if (option.key === "project") return null;
+                          <CustomMenu
+                            label={
+                              GROUP_BY_OPTIONS.find((option) => option.key === groupByProperty)
+                                ?.name ?? "Select"
+                            }
+                            className="w-28"
+                            buttonClassName="w-full"
+                          >
+                            {GROUP_BY_OPTIONS.map((option) => {
+                              if (issueView === "kanban" && option.key === null) return null;
+                              if (option.key === "project") return null;
 
-                                return (
-                                  <CustomMenu.MenuItem
-                                    key={option.key}
-                                    onClick={() => setGroupByProperty(option.key)}
-                                  >
-                                    {option.name}
-                                  </CustomMenu.MenuItem>
-                                );
-                              })}
-                            </CustomMenu>
-                          </div>
+                              return (
+                                <CustomMenu.MenuItem
+                                  key={option.key}
+                                  onClick={() => setGroupByProperty(option.key)}
+                                >
+                                  {option.name}
+                                </CustomMenu.MenuItem>
+                              );
+                            })}
+                          </CustomMenu>
                         </div>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Order by</h4>
-                          <div className="w-28">
-                            <CustomMenu
-                              label={
-                                ORDER_BY_OPTIONS.find((option) => option.key === orderBy)?.name ??
-                                "Select"
-                              }
-                              className="!w-full"
-                              buttonClassName="w-full"
-                            >
-                              {ORDER_BY_OPTIONS.map((option) =>
-                                groupByProperty === "priority" &&
-                                option.key === "priority" ? null : (
-                                  <CustomMenu.MenuItem
-                                    key={option.key}
-                                    onClick={() => {
-                                      setOrderBy(option.key);
-                                    }}
-                                  >
-                                    {option.name}
-                                  </CustomMenu.MenuItem>
-                                )
-                              )}
-                            </CustomMenu>
-                          </div>
+                          <CustomMenu
+                            label={
+                              ORDER_BY_OPTIONS.find((option) => option.key === orderBy)?.name ??
+                              "Select"
+                            }
+                            className="w-28"
+                            buttonClassName="w-full"
+                          >
+                            {ORDER_BY_OPTIONS.map((option) =>
+                              groupByProperty === "priority" && option.key === "priority" ? null : (
+                                <CustomMenu.MenuItem
+                                  key={option.key}
+                                  onClick={() => {
+                                    setOrderBy(option.key);
+                                  }}
+                                >
+                                  {option.name}
+                                </CustomMenu.MenuItem>
+                              )
+                            )}
+                          </CustomMenu>
                         </div>
                       </>
                     )}
                     <div className="flex items-center justify-between">
                       <h4 className="text-custom-text-200">Issue type</h4>
-                      <div className="w-28">
-                        <CustomMenu
-                          label={
-                            FILTER_ISSUE_OPTIONS.find((option) => option.key === filters.type)
-                              ?.name ?? "Select"
-                          }
-                          className="!w-full"
-                          buttonClassName="w-full"
-                        >
-                          {FILTER_ISSUE_OPTIONS.map((option) => (
-                            <CustomMenu.MenuItem
-                              key={option.key}
-                              onClick={() =>
-                                setFilters({
-                                  type: option.key,
-                                })
-                              }
-                            >
-                              {option.name}
-                            </CustomMenu.MenuItem>
-                          ))}
-                        </CustomMenu>
-                      </div>
+                      <CustomMenu
+                        label={
+                          FILTER_ISSUE_OPTIONS.find((option) => option.key === filters.type)
+                            ?.name ?? "Select"
+                        }
+                        className="w-28"
+                        buttonClassName="w-full"
+                      >
+                        {FILTER_ISSUE_OPTIONS.map((option) => (
+                          <CustomMenu.MenuItem
+                            key={option.key}
+                            onClick={() =>
+                              setFilters({
+                                type: option.key,
+                              })
+                            }
+                          >
+                            {option.name}
+                          </CustomMenu.MenuItem>
+                        ))}
+                      </CustomMenu>
                     </div>
 
                     {issueView !== "calendar" && issueView !== "spreadsheet" && (

apps/app/components/core/index.ts

@@ -3,6 +3,6 @@ export * from "./modals";
 export * from "./sidebar";
 export * from "./theme";
 export * from "./views";
-export * from "./activity";
+export * from "./feeds";
 export * from "./reaction-selector";
 export * from "./image-picker-popover";

apps/app/components/core/sidebar/links-list.tsx

@@ -62,7 +62,7 @@ export const LinksList: React.FC<Props> = ({ links, handleDeleteLink, userAuth }
                 by{" "}
                 {link.created_by_detail.is_bot
                   ? link.created_by_detail.first_name + " Bot"
-                  : link.created_by_detail.display_name}
+                  : link.created_by_detail.email}
               </p>
             </div>
           </a>

apps/app/components/core/sidebar/sidebar-progress-stats.tsx

@@ -133,10 +133,9 @@ export const SidebarProgressStats: React.FC<Props> = ({
                           avatar: assignee.avatar ?? "",
                           first_name: assignee.first_name ?? "",
                           last_name: assignee.last_name ?? "",
-                          display_name: assignee.display_name ?? "",
                         }}
                       />
-                      <span>{assignee.display_name}</span>
+                      <span>{assignee.first_name}</span>
                     </div>
                   }
                   completed={assignee.completed_issues}

apps/app/components/core/theme/custom-theme-selector.tsx

@@ -4,15 +4,17 @@ import { useTheme } from "next-themes";
 
 import { useForm } from "react-hook-form";
 
+// hooks
+import useUser from "hooks/use-user";
 // ui
 import { PrimaryButton } from "components/ui";
 import { ColorPickerInput } from "components/core";
+// services
+import userService from "services/user.service";
+// helper
+import { applyTheme } from "helpers/theme.helper";
 // types
 import { ICustomTheme } from "types";
-// mobx react lite
-import { observer } from "mobx-react-lite";
-// mobx store
-import { useMobxStore } from "lib/mobx/store-provider";
 
 type Props = {
   preLoadedData?: Partial<ICustomTheme> | null;
@@ -26,14 +28,11 @@ const defaultValues: ICustomTheme = {
   sidebarText: "#c5c5c5",
   darkPalette: false,
   palette: "",
-  theme: "custom",
 };
 
-export const CustomThemeSelector: React.FC<Props> = observer(({ preLoadedData }) => {
-  const store: any = useMobxStore();
-  const { setTheme } = useTheme();
-
+export const CustomThemeSelector: React.FC<Props> = ({ preLoadedData }) => {
   const [darkPalette, setDarkPalette] = useState(false);
+
   const {
     register,
     formState: { errors, isSubmitting },
@@ -44,14 +43,11 @@ export const CustomThemeSelector: React.FC<Props> = observer(({ preLoadedData })
   } = useForm<ICustomTheme>({
     defaultValues,
   });
-  useEffect(() => {
-    reset({
-      ...defaultValues,
-      ...preLoadedData,
-    });
-  }, [preLoadedData, reset]);
 
-  const handleUpdateTheme = async (formData: any) => {
+  const { setTheme } = useTheme();
+  const { mutateUser } = useUser();
+
+  const handleFormSubmit = async (formData: ICustomTheme) => {
     const payload: ICustomTheme = {
       background: formData.background,
       text: formData.text,
@@ -60,17 +56,36 @@ export const CustomThemeSelector: React.FC<Props> = observer(({ preLoadedData })
       sidebarText: formData.sidebarText,
       darkPalette: darkPalette,
       palette: `${formData.background},${formData.text},${formData.primary},${formData.sidebarBackground},${formData.sidebarText}`,
-      theme: "custom",
     };
 
-    setTheme("custom");
+    await userService
+      .updateUser({
+        theme: payload,
+      })
+      .then((res) => {
+        mutateUser((prevData) => {
+          if (!prevData) return prevData;
 
-    return store.user
-      .updateCurrentUserSettings({ theme: payload })
-      .then((response: any) => response)
-      .catch((error: any) => error);
+          return { ...prevData, ...res };
+        }, false);
+
+        setTheme("custom");
+        applyTheme(payload.palette, darkPalette);
+      })
+      .catch((err) => console.log(err));
   };
 
+  const handleUpdateTheme = async (formData: any) => {
+    await handleFormSubmit({ ...formData, darkPalette });
+  };
+
+  useEffect(() => {
+    reset({
+      ...defaultValues,
+      ...preLoadedData,
+    });
+  }, [preLoadedData, reset]);
+
   return (
     <form onSubmit={handleSubmit(handleUpdateTheme)}>
       <div className="space-y-5">
@@ -149,4 +164,4 @@ export const CustomThemeSelector: React.FC<Props> = observer(({ preLoadedData })
       </div>
     </form>
   );
-});
+};

apps/app/components/core/theme/theme-switch.tsx

@@ -1,44 +1,43 @@
-// next-themes
+import { useState, useEffect, Dispatch, SetStateAction } from "react";
+
 import { useTheme } from "next-themes";
-// hooks
-import useUser from "hooks/use-user";
+
 // constants
 import { THEMES_OBJ } from "constants/themes";
 // ui
 import { CustomSelect } from "components/ui";
 // types
-import { ICustomTheme } from "types";
-import { unsetCustomCssVariables } from "helpers/theme.helper";
-// mobx react lite
-import { observer } from "mobx-react-lite";
-// mobx store
-import { useMobxStore } from "lib/mobx/store-provider";
+import { ICustomTheme, IUser } from "types";
 
 type Props = {
-  setPreLoadedData: React.Dispatch<React.SetStateAction<ICustomTheme | null>>;
+  user: IUser | undefined;
+  setPreLoadedData: Dispatch<SetStateAction<ICustomTheme | null>>;
   customThemeSelectorOptions: boolean;
-  setCustomThemeSelectorOptions: React.Dispatch<React.SetStateAction<boolean>>;
+  setCustomThemeSelectorOptions: Dispatch<SetStateAction<boolean>>;
 };
 
-export const ThemeSwitch: React.FC<Props> = observer(
-  ({ setPreLoadedData, customThemeSelectorOptions, setCustomThemeSelectorOptions }) => {
-    const store: any = useMobxStore();
+export const ThemeSwitch: React.FC<Props> = ({
+  user,
+  setPreLoadedData,
+  customThemeSelectorOptions,
+  setCustomThemeSelectorOptions,
+}) => {
+  const [mounted, setMounted] = useState(false);
+  const { theme, setTheme } = useTheme();
 
-    const { user, mutateUser } = useUser();
-    const { theme, setTheme } = useTheme();
+  // useEffect only runs on the client, so now we can safely show the UI
+  useEffect(() => {
+    setMounted(true);
+  }, []);
 
-    const updateUserTheme = (newTheme: string) => {
-      if (!user) return;
-      setTheme(newTheme);
-      return store.user
-        .updateCurrentUserSettings({ theme: { ...user.theme, theme: newTheme } })
-        .then((response: any) => response)
-        .catch((error: any) => error);
-    };
+  if (!mounted) {
+    return null;
+  }
 
-    const currentThemeObj = THEMES_OBJ.find((t) => t.value === theme);
+  const currentThemeObj = THEMES_OBJ.find((t) => t.value === theme);
 
-    return (
+  return (
+    <>
       <CustomSelect
         value={theme}
         label={
@@ -85,18 +84,26 @@ export const ThemeSwitch: React.FC<Props> = observer(
                   user.theme.palette !== ",,,,"
                     ? user.theme.palette
                     : "#0d101b,#c5c5c5,#3f76ff,#0d101b,#c5c5c5",
-                theme: "custom",
               });
             }
 
             if (!customThemeSelectorOptions) setCustomThemeSelectorOptions(true);
           } else {
             if (customThemeSelectorOptions) setCustomThemeSelectorOptions(false);
-            unsetCustomCssVariables();
+
+            for (let i = 10; i <= 900; i >= 100 ? (i += 100) : (i += 10)) {
+              document.documentElement.style.removeProperty(`--color-background-${i}`);
+              document.documentElement.style.removeProperty(`--color-text-${i}`);
+              document.documentElement.style.removeProperty(`--color-border-${i}`);
+              document.documentElement.style.removeProperty(`--color-primary-${i}`);
+              document.documentElement.style.removeProperty(`--color-sidebar-background-${i}`);
+              document.documentElement.style.removeProperty(`--color-sidebar-text-${i}`);
+              document.documentElement.style.removeProperty(`--color-sidebar-border-${i}`);
+            }
           }
 
-          updateUserTheme(value);
-          document.documentElement.style.setProperty("--color-scheme", type);
+          setTheme(value);
+          document.documentElement.style.setProperty("color-scheme", type);
         }}
         input
         width="w-full"
@@ -130,6 +137,6 @@ export const ThemeSwitch: React.FC<Props> = observer(
           </CustomSelect.Option>
         ))}
       </CustomSelect>
-    );
-  }
-);
+    </>
+  );
+};

apps/app/components/core/views/all-views.tsx

@@ -21,9 +21,9 @@ import {
   GanttChartView,
 } from "components/core";
 // ui
-import { EmptyState, Spinner } from "components/ui";
+import { EmptyState, SecondaryButton, Spinner } from "components/ui";
 // icons
-import { TrashIcon } from "@heroicons/react/24/outline";
+import { PlusIcon, TrashIcon } from "@heroicons/react/24/outline";
 // images
 import emptyIssue from "public/empty-state/issue.svg";
 import emptyIssueArchive from "public/empty-state/issue-archive.svg";
@@ -39,16 +39,6 @@ type Props = {
   addIssueToGroup: (groupTitle: string) => void;
   disableUserActions: boolean;
   dragDisabled?: boolean;
-  emptyState: {
-    title: string;
-    description?: string;
-    primaryButton?: {
-      icon: any;
-      text: string;
-      onClick: () => void;
-    };
-    secondaryButton?: React.ReactNode;
-  };
   handleIssueAction: (issue: IIssue, action: "copy" | "delete" | "edit") => void;
   handleOnDragEnd: (result: DropResult) => Promise<void>;
   openIssuesListModal: (() => void) | null;
@@ -63,7 +53,6 @@ export const AllViews: React.FC<Props> = ({
   addIssueToGroup,
   disableUserActions,
   dragDisabled = false,
-  emptyState,
   handleIssueAction,
   handleOnDragEnd,
   openIssuesListModal,
@@ -167,28 +156,41 @@ export const AllViews: React.FC<Props> = ({
             title="Archived Issues will be shown here"
             description="All the issues that have been in the completed or canceled groups for the configured period of time can be viewed here."
             image={emptyIssueArchive}
-            primaryButton={{
-              text: "Go to Automation Settings",
-              onClick: () => {
-                router.push(`/${workspaceSlug}/projects/${projectId}/settings/automations`);
-              },
+            buttonText="Go to Automation Settings"
+            onClick={() => {
+              router.push(`/${workspaceSlug}/projects/${projectId}/settings/automations`);
             }}
           />
         ) : (
           <EmptyState
-            title={emptyState.title}
-            description={emptyState.description}
-            image={emptyIssue}
-            primaryButton={
-              emptyState.primaryButton
-                ? {
-                    icon: emptyState.primaryButton.icon,
-                    text: emptyState.primaryButton.text,
-                    onClick: emptyState.primaryButton.onClick,
-                  }
-                : undefined
+            title={
+              cycleId
+                ? "Cycle issues will appear here"
+                : moduleId
+                ? "Module issues will appear here"
+                : "Project issues will appear here"
             }
-            secondaryButton={emptyState.secondaryButton}
+            description="Issues help you track individual pieces of work. With Issues, keep track of what's going on, who is working on it, and what's done."
+            image={emptyIssue}
+            buttonText="New Issue"
+            buttonIcon={<PlusIcon className="h-4 w-4" />}
+            secondaryButton={
+              cycleId || moduleId ? (
+                <SecondaryButton
+                  className="flex items-center gap-1.5"
+                  onClick={openIssuesListModal ?? (() => {})}
+                >
+                  <PlusIcon className="h-4 w-4" />
+                  Add an existing issue
+                </SecondaryButton>
+              ) : null
+            }
+            onClick={() => {
+              const e = new KeyboardEvent("keydown", {
+                key: "c",
+              });
+              document.dispatchEvent(e);
+            }}
           />
         )
       ) : (

apps/app/components/core/views/board-view/board-header.tsx

@@ -81,7 +81,10 @@ export const BoardHeader: React.FC<Props> = ({
         break;
       case "created_by":
         const member = members?.find((member) => member.member.id === groupTitle)?.member;
-        title = member?.display_name ?? "";
+        title =
+          member?.first_name && member.first_name !== ""
+            ? `${member.first_name} ${member.last_name}`
+            : member?.email ?? "";
         break;
     }
 
@@ -146,9 +149,7 @@ export const BoardHeader: React.FC<Props> = ({
         >
           <span className="flex items-center">{getGroupIcon()}</span>
           <h2
-            className={`text-lg font-semibold truncate ${
-              selectedGroup === "created_by" ? "" : "capitalize"
-            }`}
+            className="text-lg font-semibold capitalize truncate"
             style={{
               writingMode: isCollapsed ? "horizontal-tb" : "vertical-rl",
             }}

apps/app/components/core/views/board-view/single-issue.tsx

@@ -24,7 +24,6 @@ import {
   ViewEstimateSelect,
   ViewIssueLabel,
   ViewPrioritySelect,
-  ViewStartDateSelect,
   ViewStateSelect,
 } from "components/issues";
 // ui
@@ -222,7 +221,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
           Copy issue link
         </ContextMenu.Item>
         <a
-          href={`/${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`}
+          href={`/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`}
           target="_blank"
           rel="noreferrer noopener"
         >
@@ -323,14 +322,6 @@ export const SingleBoardIssue: React.FC<Props> = ({
                 selfPositioned
               />
             )}
-            {properties.start_date && issue.start_date && (
-              <ViewStartDateSelect
-                issue={issue}
-                partialUpdateIssue={partialUpdateIssue}
-                user={user}
-                isNotAllowed={isNotAllowed}
-              />
-            )}
             {properties.due_date && issue.target_date && (
               <ViewDueDateSelect
                 issue={issue}

apps/app/components/core/views/calendar-view/single-issue.tsx

@@ -21,7 +21,6 @@ import {
   ViewEstimateSelect,
   ViewLabelSelect,
   ViewPrioritySelect,
-  ViewStartDateSelect,
   ViewStateSelect,
 } from "components/issues";
 // icons
@@ -193,7 +192,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
             </CustomMenu>
           </div>
         )}
-        <Link href={`/${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`}>
+        <Link href={`/${workspaceSlug}/projects/${issue?.project_detail.id}/issues/${issue.id}`}>
           <a className="flex w-full cursor-pointer flex-col items-start justify-center gap-1.5">
             {properties.key && (
               <Tooltip
@@ -231,14 +230,7 @@ export const SingleCalendarIssue: React.FC<Props> = ({
                 user={user}
               />
             )}
-            {properties.start_date && issue.start_date && (
-              <ViewStartDateSelect
-                issue={issue}
-                partialUpdateIssue={partialUpdateIssue}
-                user={user}
-                isNotAllowed={isNotAllowed}
-              />
-            )}
+
             {properties.due_date && issue.target_date && (
               <ViewDueDateSelect
                 issue={issue}

apps/app/components/core/views/issues-view.tsx

@@ -22,7 +22,7 @@ import { FiltersList, AllViews } from "components/core";
 import { CreateUpdateIssueModal, DeleteIssueModal } from "components/issues";
 import { CreateUpdateViewModal } from "components/views";
 // ui
-import { PrimaryButton, SecondaryButton } from "components/ui";
+import { PrimaryButton } from "components/ui";
 // icons
 import { PlusIcon } from "@heroicons/react/24/outline";
 // helpers
@@ -515,35 +515,6 @@ export const IssuesView: React.FC<Props> = ({
           selectedGroup === "labels" ||
           selectedGroup === "state_detail.group"
         }
-        emptyState={{
-          title: cycleId
-            ? "Cycle issues will appear here"
-            : moduleId
-            ? "Module issues will appear here"
-            : "Project issues will appear here",
-          description:
-            "Issues help you track individual pieces of work. With Issues, keep track of what's going on, who is working on it, and what's done.",
-          primaryButton: {
-            icon: <PlusIcon className="h-4 w-4" />,
-            text: "New Issue",
-            onClick: () => {
-              const e = new KeyboardEvent("keydown", {
-                key: "c",
-              });
-              document.dispatchEvent(e);
-            },
-          },
-          secondaryButton:
-            cycleId || moduleId ? (
-              <SecondaryButton
-                className="flex items-center gap-1.5"
-                onClick={openIssuesListModal ?? (() => {})}
-              >
-                <PlusIcon className="h-4 w-4" />
-                Add an existing issue
-              </SecondaryButton>
-            ) : null,
-        }}
         handleOnDragEnd={handleOnDragEnd}
         handleIssueAction={handleIssueAction}
         openIssuesListModal={openIssuesListModal ? openIssuesListModal : null}

apps/app/components/core/views/list-view/single-issue.tsx

@@ -16,7 +16,6 @@ import {
   ViewEstimateSelect,
   ViewIssueLabel,
   ViewPrioritySelect,
-  ViewStartDateSelect,
   ViewStateSelect,
 } from "components/issues";
 // ui
@@ -157,9 +156,9 @@ export const SingleListIssue: React.FC<Props> = ({
     });
   };
 
-  const issuePath = isArchivedIssues
-    ? `/${workspaceSlug}/projects/${issue.project}/archived-issues/${issue.id}`
-    : `/${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`;
+  const singleIssuePath = isArchivedIssues
+    ? `/${workspaceSlug}/projects/${projectId}/archived-issues/${issue.id}`
+    : `/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`;
 
   const isNotAllowed =
     userAuth.isGuest || userAuth.isViewer || disableUserActions || isArchivedIssues;
@@ -188,7 +187,7 @@ export const SingleListIssue: React.FC<Props> = ({
         <ContextMenu.Item Icon={LinkIcon} onClick={handleCopyText}>
           Copy issue link
         </ContextMenu.Item>
-        <a href={issuePath} target="_blank" rel="noreferrer noopener">
+        <a href={singleIssuePath} target="_blank" rel="noreferrer noopener">
           <ContextMenu.Item Icon={ArrowTopRightOnSquareIcon}>
             Open issue in new tab
           </ContextMenu.Item>
@@ -203,7 +202,7 @@ export const SingleListIssue: React.FC<Props> = ({
         }}
       >
         <div className="flex-grow cursor-pointer min-w-[200px] whitespace-nowrap overflow-hidden overflow-ellipsis">
-          <Link href={issuePath}>
+          <Link href={singleIssuePath}>
             <a className="group relative flex items-center gap-2">
               {properties.key && (
                 <Tooltip
@@ -245,14 +244,6 @@ export const SingleListIssue: React.FC<Props> = ({
               isNotAllowed={isNotAllowed}
             />
           )}
-          {properties.start_date && issue.start_date && (
-            <ViewStartDateSelect
-              issue={issue}
-              partialUpdateIssue={partialUpdateIssue}
-              user={user}
-              isNotAllowed={isNotAllowed}
-            />
-          )}
           {properties.due_date && issue.target_date && (
             <ViewDueDateSelect
               issue={issue}

apps/app/components/core/views/list-view/single-list.tsx

@@ -96,7 +96,10 @@ export const SingleList: React.FC<Props> = ({
         break;
       case "created_by":
         const member = members?.find((member) => member.member.id === groupTitle)?.member;
-        title = member?.display_name ?? "";
+        title =
+          member?.first_name && member.first_name !== ""
+            ? `${member.first_name} ${member.last_name}`
+            : member?.email ?? "";
         break;
     }
 
@@ -160,11 +163,7 @@ export const SingleList: React.FC<Props> = ({
                   <div className="flex items-center">{getGroupIcon()}</div>
                 )}
                 {selectedGroup !== null ? (
-                  <h2
-                    className={`text-sm font-semibold leading-6 text-custom-text-100 ${
-                      selectedGroup === "created_by" ? "" : "capitalize"
-                    }`}
-                  >
+                  <h2 className="text-sm font-semibold capitalize leading-6 text-custom-text-100">
                     {getGroupTitle()}
                   </h2>
                 ) : (

apps/app/components/core/views/spreadsheet-view/single-issue.tsx

@@ -263,7 +263,7 @@ export const SingleSpreadsheetIssue: React.FC<Props> = ({
           )}
         </div>
 
-        <Link href={`/${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`}>
+        <Link href={`/${workspaceSlug}/projects/${issue?.project_detail?.id}/issues/${issue.id}`}>
           <a className="truncate text-custom-text-100 cursor-pointer w-full text-[0.825rem]">
             {issue.name}
           </a>

apps/app/components/cycles/active-cycle-details.tsx

@@ -361,14 +361,14 @@ export const ActiveCycleDetails: React.FC = () => {
                       height={16}
                       width={16}
                       className="rounded-full"
-                      alt={cycle.owned_by.display_name}
+                      alt={cycle.owned_by.first_name}
                     />
                   ) : (
                     <span className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-background-100 capitalize">
-                      {cycle.owned_by.display_name.charAt(0)}
+                      {cycle.owned_by.first_name.charAt(0)}
                     </span>
                   )}
-                  <span className="text-custom-text-200">{cycle.owned_by.display_name}</span>
+                  <span className="text-custom-text-200">{cycle.owned_by.first_name}</span>
                 </div>
 
                 {cycle.assignees.length > 0 && (

apps/app/components/cycles/active-cycle-stats.tsx

@@ -88,10 +88,9 @@ export const ActiveCycleProgressStats: React.FC<Props> = ({ cycle }) => {
                             avatar: assignee.avatar ?? "",
                             first_name: assignee.first_name ?? "",
                             last_name: assignee.last_name ?? "",
-                            display_name: assignee.display_name ?? "",
                           }}
                         />
-                        <span>{assignee.display_name}</span>
+                        <span>{assignee.first_name}</span>
                       </div>
                     }
                     completed={assignee.completed_issues}

apps/app/components/cycles/sidebar.tsx

@@ -450,14 +450,14 @@ export const CycleDetailsSidebar: React.FC<Props> = ({
                           height={12}
                           width={12}
                           className="rounded-full"
-                          alt={cycle.owned_by.display_name}
+                          alt={cycle.owned_by.first_name}
                         />
                       ) : (
                         <span className="flex h-5 w-5 items-center justify-center rounded-full bg-gray-800 capitalize  text-white">
-                          {cycle.owned_by.display_name.charAt(0)}
+                          {cycle.owned_by.first_name.charAt(0)}
                         </span>
                       )}
-                      <span className="text-custom-text-200">{cycle.owned_by.display_name}</span>
+                      <span className="text-custom-text-200">{cycle.owned_by.first_name}</span>
                     </div>
                   </div>
 

apps/app/components/cycles/single-cycle-card.tsx

@@ -250,14 +250,14 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
                           height={16}
                           width={16}
                           className="rounded-full"
-                          alt={cycle.owned_by.display_name}
+                          alt={cycle.owned_by.first_name}
                         />
                       ) : (
                         <span className="flex h-5 w-5 items-center justify-center rounded-full bg-orange-300 capitalize text-white">
-                          {cycle.owned_by.display_name.charAt(0)}
+                          {cycle.owned_by.first_name.charAt(0)}
                         </span>
                       )}
-                      <span className="text-custom-text-200">{cycle.owned_by.display_name}</span>
+                      <span className="text-custom-text-200">{cycle.owned_by.first_name}</span>
                     </div>
                   </div>
                   <div className="flex h-5 items-center gap-2">

apps/app/components/cycles/single-cycle-list.tsx

@@ -254,11 +254,11 @@ export const SingleCycleList: React.FC<TSingleStatProps> = ({
                         height={16}
                         width={16}
                         className="rounded-full"
-                        alt={cycle.owned_by.display_name}
+                        alt={cycle.owned_by.first_name}
                       />
                     ) : (
                       <span className="flex h-5 w-5 items-center justify-center rounded-full bg-orange-300 capitalize text-white">
-                        {cycle.owned_by.display_name.charAt(0)}
+                        {cycle.owned_by.first_name.charAt(0)}
                       </span>
                     )}
                   </div>

apps/app/components/integration/github/single-user-select.tsx

@@ -44,12 +44,19 @@ export const SingleUserSelect: React.FC<Props> = ({ collaborator, index, users,
   );
 
   const options = members?.map((member) => ({
-    value: member.member.display_name,
-    query: member.member.display_name ?? "",
+    value: member.member.email,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {member.member.first_name && member.member.first_name !== ""
+          ? member.member.first_name + "(" + member.member.email + ")"
+          : member.member.email}
       </div>
     ),
   }));

apps/app/components/integration/jira/import-users.tsx

@@ -3,17 +3,11 @@ import { FC } from "react";
 // next
 import { useRouter } from "next/router";
 
-// swr
-import useSWR from "swr";
-
 // react-hook-form
 import { useFormContext, useFieldArray, Controller } from "react-hook-form";
 
-// fetch keys
-import { WORKSPACE_MEMBERS_WITH_EMAIL } from "constants/fetch-keys";
-
-// services
-import workspaceService from "services/workspace.service";
+// hooks
+import useWorkspaceMembers from "hooks/use-workspace-members";
 
 // components
 import { ToggleSwitch, Input, CustomSelect, CustomSearchSelect, Avatar } from "components/ui";
@@ -36,20 +30,22 @@ export const JiraImportUsers: FC = () => {
   const router = useRouter();
   const { workspaceSlug } = router.query;
 
-  const { data: members } = useSWR(
-    workspaceSlug ? WORKSPACE_MEMBERS_WITH_EMAIL(workspaceSlug?.toString() ?? "") : null,
-    workspaceSlug
-      ? () => workspaceService.workspaceMembersWithEmail(workspaceSlug?.toString() ?? "")
-      : null
-  );
+  const { workspaceMembers: members } = useWorkspaceMembers(workspaceSlug?.toString() ?? "");
 
   const options = members?.map((member) => ({
     value: member.member.email,
-    query: member.member.display_name ?? "",
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {member.member.first_name && member.member.first_name !== ""
+          ? member.member.first_name + " (" + member.member.email + ")"
+          : member.member.email}
       </div>
     ),
   }));

apps/app/components/integration/single-import.tsx

@@ -42,7 +42,12 @@ export const SingleImport: React.FC<Props> = ({ service, refreshing, handleDelet
       </h4>
       <div className="mt-2 flex items-center gap-2 text-xs text-custom-text-200">
         <span>{renderShortDateWithYearFormat(service.created_at)}</span>|
-        <span>Imported by {service.initiated_by_detail.display_name}</span>
+        <span>
+          Imported by{" "}
+          {service.initiated_by_detail.first_name && service.initiated_by_detail.first_name !== ""
+            ? service.initiated_by_detail.first_name + " " + service.initiated_by_detail.last_name
+            : service.initiated_by_detail.email}
+        </span>
       </div>
     </div>
     <CustomMenu ellipsis>

apps/app/components/issues/activity.tsx

@@ -8,12 +8,12 @@ import useSWR from "swr";
 // services
 import issuesService from "services/issues.service";
 // components
-import { ActivityIcon, ActivityMessage } from "components/core";
 import { CommentCard } from "components/issues/comment";
 // ui
 import { Icon, Loader } from "components/ui";
 // helpers
 import { timeAgo } from "helpers/date-time.helper";
+import { activityDetails } from "helpers/activity.helper";
 // types
 import { ICurrentUserResponse, IIssueComment } from "types";
 // fetch-keys
@@ -91,11 +91,11 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
       <ul role="list" className="-mb-4">
         {issueActivities.map((activityItem, index) => {
           // determines what type of action is performed
-          const message = activityItem.field ? (
-            <ActivityMessage activity={activityItem} />
-          ) : (
-            "created the issue."
-          );
+          const message = activityItem.field
+            ? activityDetails[activityItem.field as keyof typeof activityDetails]?.message(
+                activityItem
+              )
+            : "created the issue.";
 
           if ("field" in activityItem && activityItem.field !== "updated_by") {
             return (
@@ -116,13 +116,14 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
                               activityItem.new_value === "restore" ? (
                                 <Icon iconName="history" className="text-sm text-custom-text-200" />
                               ) : (
-                                <ActivityIcon activity={activityItem} />
+                                activityDetails[activityItem.field as keyof typeof activityDetails]
+                                  ?.icon
                               )
                             ) : activityItem.actor_detail.avatar &&
                               activityItem.actor_detail.avatar !== "" ? (
                               <img
                                 src={activityItem.actor_detail.avatar}
-                                alt={activityItem.actor_detail.display_name}
+                                alt={activityItem.actor_detail.first_name}
                                 height={24}
                                 width={24}
                                 className="rounded-full"
@@ -131,7 +132,7 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
                               <div
                                 className={`grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-700 text-xs text-white`}
                               >
-                                {activityItem.actor_detail.display_name.charAt(0)}
+                                {activityItem.actor_detail.first_name.charAt(0)}
                               </div>
                             )}
                           </div>
@@ -150,7 +151,8 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
                         ) : (
                           <Link href={`/${workspaceSlug}/profile/${activityItem.actor_detail.id}`}>
                             <a className="text-gray font-medium">
-                              {activityItem.actor_detail.display_name}
+                              {activityItem.actor_detail.first_name}{" "}
+                              {activityItem.actor_detail.last_name}
                             </a>
                           </Link>
                         )}{" "}

apps/app/components/issues/attachment/attachments.tsx

@@ -77,7 +77,7 @@ export const IssueAttachments = () => {
                       <Tooltip
                         tooltipContent={`${
                           people?.find((person) => person.member.id === file.updated_by)?.member
-                            .display_name ?? ""
+                            .first_name ?? ""
                         } uploaded on ${renderLongDateFormat(file.updated_at)}`}
                       >
                         <span>

apps/app/components/issues/comment/comment-card.tsx

@@ -70,7 +70,7 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
         {comment.actor_detail.avatar && comment.actor_detail.avatar !== "" ? (
           <img
             src={comment.actor_detail.avatar}
-            alt={comment.actor_detail.display_name}
+            alt={comment.actor_detail.first_name}
             height={30}
             width={30}
             className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-200"
@@ -79,7 +79,7 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
           <div
             className={`grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-500 text-white`}
           >
-            {comment.actor_detail.display_name.charAt(0)}
+            {comment.actor_detail.first_name.charAt(0)}
           </div>
         )}
 
@@ -93,9 +93,8 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
       <div className="min-w-0 flex-1">
         <div>
           <div className="text-xs">
-            {comment.actor_detail.is_bot
-              ? comment.actor_detail.first_name + " Bot"
-              : comment.actor_detail.display_name}
+            {comment.actor_detail.first_name}
+            {comment.actor_detail.is_bot ? "Bot" : " " + comment.actor_detail.last_name}
           </div>
           <p className="mt-0.5 text-xs text-custom-text-200">
             Commented {timeAgo(comment.created_at)}
@@ -141,7 +140,11 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
               ref={showEditorRef}
             />
 
-            <CommentReaction projectId={comment.project} commentId={comment.id} />
+            <CommentReaction
+              workspaceSlug={comment?.workspace_detail?.slug}
+              projectId={comment.project}
+              commentId={comment.id}
+            />
           </div>
         </div>
       </div>

apps/app/components/issues/comment/comment-reaction.tsx

@@ -1,7 +1,5 @@
 import React from "react";
 
-import { useRouter } from "next/router";
-
 // hooks
 import useUser from "hooks/use-user";
 import useCommentReaction from "hooks/use-comment-reaction";
@@ -11,15 +9,13 @@ import { ReactionSelector } from "components/core";
 import { renderEmoji } from "helpers/emoji.helper";
 
 type Props = {
+  workspaceSlug?: string | string[];
   projectId?: string | string[];
   commentId: string;
 };
 
 export const CommentReaction: React.FC<Props> = (props) => {
-  const { projectId, commentId } = props;
-
-  const router = useRouter();
-  const { workspaceSlug } = router.query;
+  const { workspaceSlug, projectId, commentId } = props;
 
   const { user } = useUser();
 

apps/app/components/issues/delete-issue-modal.tsx

@@ -59,9 +59,8 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, u
   };
 
   const handleDeletion = async () => {
-    if (!workspaceSlug || !data) return;
-
     setIsDeleteLoading(true);
+    if (!workspaceSlug || !projectId || !data) return;
 
     await issueServices
       .deleteIssue(workspaceSlug as string, data.project, data.id, user)
@@ -113,7 +112,7 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data, u
         } else {
           if (cycleId) mutate(CYCLE_ISSUES_WITH_PARAMS(cycleId as string, params));
           else if (moduleId) mutate(MODULE_ISSUES_WITH_PARAMS(moduleId as string, params));
-          else mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(data.project, params));
+          else mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(projectId as string, params));
         }
 
         handleClose();

apps/app/components/issues/form.tsx

@@ -75,7 +75,6 @@ const defaultValues: Partial<IIssue> = {
   assignees_list: [],
   labels: [],
   labels_list: [],
-  start_date: null,
   target_date: null,
 };
 
@@ -97,7 +96,6 @@ export interface IssueFormProps {
     | "priority"
     | "assignee"
     | "label"
-    | "startDate"
     | "dueDate"
     | "estimate"
     | "parent"
@@ -241,15 +239,6 @@ export const IssueForm: FC<IssueFormProps> = ({
     });
   }, [getValues, projectId, reset]);
 
-  const startDate = watch("start_date");
-  const targetDate = watch("target_date");
-
-  const minDate = startDate ? new Date(startDate) : null;
-  minDate?.setDate(minDate.getDate());
-
-  const maxDate = targetDate ? new Date(targetDate) : null;
-  maxDate?.setDate(maxDate.getDate());
-
   return (
     <>
       {projectId && (
@@ -458,34 +447,13 @@ export const IssueForm: FC<IssueFormProps> = ({
                     )}
                   />
                 )}
-                {(fieldsToShow.includes("all") || fieldsToShow.includes("startDate")) && (
-                  <div>
-                    <Controller
-                      control={control}
-                      name="start_date"
-                      render={({ field: { value, onChange } }) => (
-                        <IssueDateSelect
-                          label="Start date"
-                          maxDate={maxDate ?? undefined}
-                          onChange={onChange}
-                          value={value}
-                        />
-                      )}
-                    />
-                  </div>
-                )}
                 {(fieldsToShow.includes("all") || fieldsToShow.includes("dueDate")) && (
                   <div>
                     <Controller
                       control={control}
                       name="target_date"
                       render={({ field: { value, onChange } }) => (
-                        <IssueDateSelect
-                          label="Due date"
-                          minDate={minDate ?? undefined}
-                          onChange={onChange}
-                          value={value}
-                        />
+                        <IssueDateSelect value={value} onChange={onChange} />
                       )}
                     />
                   </div>

apps/app/components/issues/modal.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useCallback } from "react";
+import React, { useEffect, useState } from "react";
 
 import { useRouter } from "next/router";
 
@@ -18,7 +18,6 @@ import useToast from "hooks/use-toast";
 import useInboxView from "hooks/use-inbox-view";
 import useSpreadsheetIssuesView from "hooks/use-spreadsheet-issues-view";
 import useProjects from "hooks/use-projects";
-import useMyIssues from "hooks/my-issues/use-my-issues";
 // components
 import { IssueForm } from "components/issues";
 // types
@@ -53,7 +52,6 @@ export interface IssuesModalProps {
     | "priority"
     | "assignee"
     | "label"
-    | "startDate"
     | "dueDate"
     | "estimate"
     | "parent"
@@ -87,8 +85,6 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
   const { user } = useUser();
   const { projects } = useProjects();
 
-  const { groupedIssues, mutateMyIssues } = useMyIssues(workspaceSlug?.toString());
-
   const { setToastAlert } = useToast();
 
   if (cycleId) prePopulateData = { ...prePopulateData, cycle: cycleId as string };
@@ -99,31 +95,28 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
       assignees: [...(prePopulateData?.assignees ?? []), user?.id ?? ""],
     };
 
-  const onClose = useCallback(() => {
-    handleClose();
-    setActiveProject(null);
-  }, [handleClose]);
-
   useEffect(() => {
-    // if modal is closed, reset active project to null
-    // and return to avoid activeProject being set to some other project
-    if (!isOpen) {
-      setActiveProject(null);
-      return;
-    }
-
-    // if data is present, set active project to the project of the
-    // issue. This has more priority than the project in the url.
     if (data && data.project) {
       setActiveProject(data.project);
       return;
     }
 
-    // if data is not present, set active project to the project
-    // in the url. This has the least priority.
     if (projects && projects.length > 0 && !activeProject)
       setActiveProject(projects?.find((p) => p.id === projectId)?.id ?? projects?.[0].id ?? null);
-  }, [activeProject, data, projectId, projects, isOpen]);
+  }, [activeProject, data, projectId, projects]);
+
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "Escape") {
+        handleClose();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [handleClose]);
 
   const addIssueToCycle = async (issueId: string, cycleId: string) => {
     if (!workspaceSlug || !activeProject) return;
@@ -250,7 +243,6 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
           if (issueView === "calendar") mutate(calendarFetchKey);
           if (issueView === "gantt_chart") mutate(ganttFetchKey);
           if (issueView === "spreadsheet") mutate(spreadsheetFetchKey);
-          if (groupedIssues) mutateMyIssues();
 
           setToastAlert({
             type: "success",
@@ -271,7 +263,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
           });
         });
 
-    if (!createMore) onClose();
+    if (!createMore) handleClose();
   };
 
   const updateIssue = async (payload: Partial<IIssue>) => {
@@ -290,7 +282,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
         if (payload.cycle && payload.cycle !== "") addIssueToCycle(res.id, payload.cycle);
         if (payload.module && payload.module !== "") addIssueToModule(res.id, payload.module);
 
-        if (!createMore) onClose();
+        if (!createMore) handleClose();
 
         setToastAlert({
           type: "success",
@@ -328,7 +320,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
 
   return (
     <Transition.Root show={isOpen} as={React.Fragment}>
-      <Dialog as="div" className="relative z-20" onClose={onClose}>
+      <Dialog as="div" className="relative z-20" onClose={() => handleClose()}>
         <Transition.Child
           as={React.Fragment}
           enter="ease-out duration-300"
@@ -358,7 +350,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = ({
                   initialData={data ?? prePopulateData}
                   createMore={createMore}
                   setCreateMore={setCreateMore}
-                  handleClose={onClose}
+                  handleClose={handleClose}
                   projectId={activeProject ?? ""}
                   setActiveProject={setActiveProject}
                   status={data ? true : false}

apps/app/components/issues/my-issues/my-issues-view-options.tsx

@@ -146,108 +146,105 @@ export const MyIssuesViewOptions: React.FC = () => {
                       <>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Group by</h4>
-                          <div className="w-28">
-                            <CustomMenu
-                              label={
-                                groupBy === "project"
-                                  ? "Project"
-                                  : GROUP_BY_OPTIONS.find((option) => option.key === groupBy)
-                                      ?.name ?? "Select"
-                              }
-                              className="!w-full"
-                              buttonClassName="w-full"
-                            >
-                              {GROUP_BY_OPTIONS.map((option) => {
-                                if (issueView === "kanban" && option.key === null) return null;
-                                if (option.key === "state" || option.key === "created_by")
-                                  return null;
+                          <CustomMenu
+                            label={
+                              groupBy === "project"
+                                ? "Project"
+                                : GROUP_BY_OPTIONS.find((option) => option.key === groupBy)?.name ??
+                                  "Select"
+                            }
+                          >
+                            {GROUP_BY_OPTIONS.map((option) => {
+                              if (issueView === "kanban" && option.key === null) return null;
+                              if (option.key === "state" || option.key === "created_by")
+                                return null;
 
-                                return (
-                                  <CustomMenu.MenuItem
-                                    key={option.key}
-                                    onClick={() => setGroupBy(option.key)}
-                                  >
-                                    {option.name}
-                                  </CustomMenu.MenuItem>
-                                );
-                              })}
-                            </CustomMenu>
-                          </div>
+                              return (
+                                <CustomMenu.MenuItem
+                                  key={option.key}
+                                  onClick={() => setGroupBy(option.key)}
+                                >
+                                  {option.name}
+                                </CustomMenu.MenuItem>
+                              );
+                            })}
+                          </CustomMenu>
                         </div>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Order by</h4>
-                          <div className="w-28">
-                            <CustomMenu
-                              label={
-                                ORDER_BY_OPTIONS.find((option) => option.key === orderBy)?.name ??
-                                "Select"
-                              }
-                              className="!w-full"
-                              buttonClassName="w-full"
-                            >
-                              {ORDER_BY_OPTIONS.map((option) => {
-                                if (groupBy === "priority" && option.key === "priority")
-                                  return null;
-                                if (option.key === "sort_order") return null;
+                          <CustomMenu
+                            label={
+                              ORDER_BY_OPTIONS.find((option) => option.key === orderBy)?.name ??
+                              "Select"
+                            }
+                          >
+                            {ORDER_BY_OPTIONS.map((option) => {
+                              if (groupBy === "priority" && option.key === "priority") return null;
+                              if (option.key === "sort_order") return null;
 
-                                return (
-                                  <CustomMenu.MenuItem
-                                    key={option.key}
-                                    onClick={() => {
-                                      setOrderBy(option.key);
-                                    }}
-                                  >
-                                    {option.name}
-                                  </CustomMenu.MenuItem>
-                                );
-                              })}
-                            </CustomMenu>
-                          </div>
+                              return (
+                                <CustomMenu.MenuItem
+                                  key={option.key}
+                                  onClick={() => {
+                                    setOrderBy(option.key);
+                                  }}
+                                >
+                                  {option.name}
+                                </CustomMenu.MenuItem>
+                              );
+                            })}
+                          </CustomMenu>
                         </div>
                       </>
                     )}
                     <div className="flex items-center justify-between">
                       <h4 className="text-custom-text-200">Issue type</h4>
-                      <div className="w-28">
-                        <CustomMenu
-                          label={
-                            FILTER_ISSUE_OPTIONS.find((option) => option.key === filters?.type)
-                              ?.name ?? "Select"
-                          }
-                          className="!w-full"
-                          buttonClassName="w-full"
-                        >
-                          {FILTER_ISSUE_OPTIONS.map((option) => (
-                            <CustomMenu.MenuItem
-                              key={option.key}
-                              onClick={() =>
-                                setFilters({
-                                  type: option.key,
-                                })
-                              }
-                            >
-                              {option.name}
-                            </CustomMenu.MenuItem>
-                          ))}
-                        </CustomMenu>
-                      </div>
+                      <CustomMenu
+                        label={
+                          FILTER_ISSUE_OPTIONS.find((option) => option.key === filters?.type)
+                            ?.name ?? "Select"
+                        }
+                      >
+                        {FILTER_ISSUE_OPTIONS.map((option) => (
+                          <CustomMenu.MenuItem
+                            key={option.key}
+                            onClick={() =>
+                              setFilters({
+                                type: option.key,
+                              })
+                            }
+                          >
+                            {option.name}
+                          </CustomMenu.MenuItem>
+                        ))}
+                      </CustomMenu>
                     </div>
 
                     {issueView !== "calendar" && issueView !== "spreadsheet" && (
                       <>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Show empty states</h4>
-                          <div className="w-28">
-                            <ToggleSwitch value={showEmptyGroups} onChange={setShowEmptyGroups} />
-                          </div>
+                          <ToggleSwitch value={showEmptyGroups} onChange={setShowEmptyGroups} />
                         </div>
+                        {/* <div className="relative flex justify-end gap-x-3">
+                          <button type="button" onClick={() => resetFilterToDefault()}>
+                            Reset to default
+                          </button>
+                          <button
+                            type="button"
+                            className="font-medium text-custom-primary"
+                            onClick={() => setNewFilterDefaultView()}
+                          >
+                            Set as default
+                          </button>
+                        </div> */}
                       </>
                     )}
                   </div>
 
                   <div className="space-y-2 py-3">
                     <h4 className="text-sm text-custom-text-200">Display Properties</h4>
-                    <div className="flex flex-wrap items-center gap-2 text-custom-text-200">
+                    <div className="flex flex-wrap items-center gap-2">
                       {Object.keys(properties).map((key) => {
                         if (key === "estimate" && !isEstimateActive) return null;
 

apps/app/components/issues/my-issues/my-issues-view.tsx

@@ -21,7 +21,6 @@ import { orderArrayBy } from "helpers/array.helper";
 import { IIssue, IIssueFilterOptions } from "types";
 // fetch-keys
 import { USER_ISSUES, WORKSPACE_LABELS } from "constants/fetch-keys";
-import { PlusIcon } from "@heroicons/react/24/outline";
 
 type Props = {
   openIssuesListModal?: () => void;
@@ -200,7 +199,7 @@ export const MyIssuesView: React.FC<Props> = ({
     [makeIssueCopy, handleEditIssue, handleDeleteIssue]
   );
 
-  const filtersToDisplay = { ...filters, assignees: null, created_by: null, subscriber: null };
+  const filtersToDisplay = { ...filters, assignees: null, created_by: null };
 
   const nullFilters = Object.keys(filtersToDisplay).filter(
     (key) => filtersToDisplay[key as keyof IIssueFilterOptions] === null
@@ -263,24 +262,6 @@ export const MyIssuesView: React.FC<Props> = ({
         addIssueToGroup={addIssueToGroup}
         disableUserActions={disableUserActions}
         dragDisabled={groupBy !== "priority"}
-        emptyState={{
-          title: filters.assignees
-            ? "You don't have any issue assigned to you yet"
-            : filters.created_by
-            ? "You have not created any issue yet."
-            : "You have not subscribed to any issue yet.",
-          description: "Keep track of your work in a single place.",
-          primaryButton: {
-            icon: <PlusIcon className="h-4 w-4" />,
-            text: "New Issue",
-            onClick: () => {
-              const e = new KeyboardEvent("keydown", {
-                key: "c",
-              });
-              document.dispatchEvent(e);
-            },
-          },
-        }}
         handleOnDragEnd={handleOnDragEnd}
         handleIssueAction={handleIssueAction}
         openIssuesListModal={openIssuesListModal ? openIssuesListModal : null}

apps/app/components/issues/select/assignee.tsx

@@ -30,11 +30,20 @@ export const IssueAssigneeSelect: React.FC<Props> = ({ projectId, value = [], on
 
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name ?? "",
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.is_bot ? member.member.first_name : member.member.display_name}
+        {`${
+          member.member.first_name && member.member.first_name !== ""
+            ? member.member.first_name
+            : member.member.email
+        } ${member.member.last_name ?? ""}`}
       </div>
     ),
   }));

apps/app/components/issues/select/date.tsx

@@ -8,14 +8,11 @@ import DatePicker from "react-datepicker";
 import { renderDateFormat, renderShortDateWithYearFormat } from "helpers/date-time.helper";
 
 type Props = {
-  label: string;
-  maxDate?: Date;
-  minDate?: Date;
-  onChange: (val: string | null) => void;
   value: string | null;
+  onChange: (val: string | null) => void;
 };
 
-export const IssueDateSelect: React.FC<Props> = ({ label, maxDate, minDate, onChange, value }) => (
+export const IssueDateSelect: React.FC<Props> = ({ value, onChange }) => (
   <Popover className="relative flex items-center justify-center  rounded-lg">
     {({ open }) => (
       <>
@@ -31,7 +28,7 @@ export const IssueDateSelect: React.FC<Props> = ({ label, maxDate, minDate, onCh
             ) : (
               <>
                 <CalendarDaysIcon className="h-3.5 w-3.5 flex-shrink-0" />
-                <span>{label}</span>
+                <span>Due Date</span>
               </>
             )}
           </span>
@@ -54,8 +51,6 @@ export const IssueDateSelect: React.FC<Props> = ({ label, maxDate, minDate, onCh
                 else onChange(renderDateFormat(val));
               }}
               dateFormat="dd-MM-yyyy"
-              minDate={minDate}
-              maxDate={maxDate}
               inline
             />
           </Popover.Panel>

apps/app/components/issues/sidebar-select/assignee.tsx

@@ -41,11 +41,20 @@ export const SidebarAssigneeSelect: React.FC<Props> = ({
 
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {`${
+          member.member.first_name && member.member.first_name !== ""
+            ? member.member.first_name
+            : member.member.email
+        } ${member.member.last_name ?? ""}`}
       </div>
     ),
   }));

apps/app/components/issues/sidebar.tsx

@@ -54,7 +54,6 @@ type Props = {
     | "parent"
     | "blocker"
     | "blocked"
-    | "startDate"
     | "dueDate"
     | "cycle"
     | "module"
@@ -211,15 +210,6 @@ export const IssueDetailsSidebar: React.FC<Props> = ({
     fieldsToShow.includes("cycle") ||
     fieldsToShow.includes("module");
 
-  const startDate = watchIssue("start_date");
-  const targetDate = watchIssue("target_date");
-
-  const minDate = startDate ? new Date(startDate) : null;
-  minDate?.setDate(minDate.getDate());
-
-  const maxDate = targetDate ? new Date(targetDate) : null;
-  maxDate?.setDate(maxDate.getDate());
-
   const isNotAllowed = memberRole.isGuest || memberRole.isViewer;
 
   return (
@@ -377,34 +367,6 @@ export const IssueDetailsSidebar: React.FC<Props> = ({
                     disabled={uneditable}
                   />
                 )}
-                {(fieldsToShow.includes("all") || fieldsToShow.includes("startDate")) && (
-                  <div className="flex flex-wrap items-center py-2">
-                    <div className="flex items-center gap-x-2 text-sm text-custom-text-200 sm:basis-1/2">
-                      <CalendarDaysIcon className="h-4 w-4 flex-shrink-0" />
-                      <p>Start date</p>
-                    </div>
-                    <div className="sm:basis-1/2">
-                      <Controller
-                        control={control}
-                        name="start_date"
-                        render={({ field: { value } }) => (
-                          <CustomDatePicker
-                            placeholder="Start date"
-                            value={value}
-                            onChange={(val) =>
-                              submitChanges({
-                                start_date: val,
-                              })
-                            }
-                            className="bg-custom-background-90"
-                            maxDate={maxDate ?? undefined}
-                            disabled={isNotAllowed || uneditable}
-                          />
-                        )}
-                      />
-                    </div>
-                  </div>
-                )}
                 {(fieldsToShow.includes("all") || fieldsToShow.includes("dueDate")) && (
                   <div className="flex flex-wrap items-center py-2">
                     <div className="flex items-center gap-x-2 text-sm text-custom-text-200 sm:basis-1/2">
@@ -425,7 +387,6 @@ export const IssueDetailsSidebar: React.FC<Props> = ({
                               })
                             }
                             className="bg-custom-background-90"
-                            minDate={minDate ?? undefined}
                             disabled={isNotAllowed || uneditable}
                           />
                         )}

apps/app/components/issues/view-select/assignee.tsx

@@ -47,11 +47,20 @@ export const ViewAssigneeSelect: React.FC<Props> = ({
 
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {`${
+          member.member.first_name && member.member.first_name !== ""
+            ? member.member.first_name
+            : member.member.email
+        } ${member.member.last_name ?? ""}`}
       </div>
     ),
   }));
@@ -62,7 +71,11 @@ export const ViewAssigneeSelect: React.FC<Props> = ({
       tooltipHeading="Assignees"
       tooltipContent={
         issue.assignee_details.length > 0
-          ? issue.assignee_details.map((assignee) => assignee?.display_name).join(", ")
+          ? issue.assignee_details
+              .map((assignee) =>
+                assignee?.first_name !== "" ? assignee?.first_name : assignee?.email
+              )
+              .join(", ")
           : "No Assignee"
       }
     >

apps/app/components/issues/view-select/due-date.tsx

@@ -32,12 +32,9 @@ export const ViewDueDateSelect: React.FC<Props> = ({
 
   const { issueView } = useIssuesView();
 
-  const minDate = issue.start_date ? new Date(issue.start_date) : null;
-  minDate?.setDate(minDate.getDate());
-
   return (
     <Tooltip
-      tooltipHeading="Due date"
+      tooltipHeading="Due Date"
       tooltipContent={
         issue.target_date ? renderShortDateWithYearFormat(issue.target_date) ?? "N/A" : "N/A"
       }
@@ -59,6 +56,8 @@ export const ViewDueDateSelect: React.FC<Props> = ({
             partialUpdateIssue(
               {
                 target_date: val,
+                priority: issue.priority,
+                state: issue.state,
               },
               issue
             );
@@ -78,7 +77,6 @@ export const ViewDueDateSelect: React.FC<Props> = ({
           className={`${issue?.target_date ? "w-[6.5rem]" : "w-[5rem] text-center"} ${
             issueView === "kanban" ? "bg-custom-background-90" : "bg-custom-background-100"
           }`}
-          minDate={minDate ?? undefined}
           noBorder={noBorder}
           disabled={isNotAllowed}
         />

apps/app/components/issues/view-select/index.ts

@@ -1,7 +1,6 @@
 export * from "./assignee";
 export * from "./due-date";
 export * from "./estimate";
-export * from "./label";
 export * from "./priority";
-export * from "./start-date";
 export * from "./state";
+export * from "./label";

apps/app/components/issues/view-select/start-date.tsx

@@ -1,80 +0,0 @@
-import { useRouter } from "next/router";
-
-// ui
-import { CustomDatePicker, Tooltip } from "components/ui";
-// helpers
-import { findHowManyDaysLeft, renderShortDateWithYearFormat } from "helpers/date-time.helper";
-// services
-import trackEventServices from "services/track-event.service";
-// types
-import { ICurrentUserResponse, IIssue } from "types";
-import useIssuesView from "hooks/use-issues-view";
-
-type Props = {
-  issue: IIssue;
-  partialUpdateIssue: (formData: Partial<IIssue>, issue: IIssue) => void;
-  tooltipPosition?: "top" | "bottom";
-  noBorder?: boolean;
-  user: ICurrentUserResponse | undefined;
-  isNotAllowed: boolean;
-};
-
-export const ViewStartDateSelect: React.FC<Props> = ({
-  issue,
-  partialUpdateIssue,
-  tooltipPosition = "top",
-  noBorder = false,
-  user,
-  isNotAllowed,
-}) => {
-  const router = useRouter();
-  const { workspaceSlug } = router.query;
-
-  const { issueView } = useIssuesView();
-
-  const maxDate = issue.target_date ? new Date(issue.target_date) : null;
-  maxDate?.setDate(maxDate.getDate());
-
-  return (
-    <Tooltip
-      tooltipHeading="Start date"
-      tooltipContent={
-        issue.start_date ? renderShortDateWithYearFormat(issue.start_date) ?? "N/A" : "N/A"
-      }
-      position={tooltipPosition}
-    >
-      <div className="group flex-shrink-0 relative max-w-[6.5rem]">
-        <CustomDatePicker
-          placeholder="Due date"
-          value={issue?.start_date}
-          onChange={(val) => {
-            partialUpdateIssue(
-              {
-                start_date: val,
-              },
-              issue
-            );
-            trackEventServices.trackIssuePartialPropertyUpdateEvent(
-              {
-                workspaceSlug,
-                workspaceId: issue.workspace,
-                projectId: issue.project_detail.id,
-                projectIdentifier: issue.project_detail.identifier,
-                projectName: issue.project_detail.name,
-                issueId: issue.id,
-              },
-              "ISSUE_PROPERTY_UPDATE_DUE_DATE",
-              user
-            );
-          }}
-          className={`${issue?.start_date ? "w-[6.5rem]" : "w-[5rem] text-center"} ${
-            issueView === "kanban" ? "bg-custom-background-90" : "bg-custom-background-100"
-          }`}
-          maxDate={maxDate ?? undefined}
-          noBorder={noBorder}
-          disabled={isNotAllowed}
-        />
-      </div>
-    </Tooltip>
-  );
-};

apps/app/components/labels/create-update-label-inline.tsx

@@ -4,13 +4,8 @@ import { useRouter } from "next/router";
 
 import { mutate } from "swr";
 
-// mobx
-import { useObserver } from "mobx-react-lite";
-
 // react-hook-form
 import { Controller, SubmitHandler, useForm } from "react-hook-form";
-// store
-import labelStore from "store/labels";
 // hooks
 import useUserAuth from "hooks/use-user-auth";
 // react-color
@@ -63,17 +58,20 @@ export const CreateUpdateLabelInline = forwardRef<Ref, Props>(function CreateUpd
     defaultValues,
   });
 
-  const { createLabel } = useObserver(() => ({
-    createLabel: labelStore.createLabel,
-  }));
-
   const handleLabelCreate: SubmitHandler<IIssueLabels> = async (formData) => {
-    if (!workspaceSlug || !projectId || isSubmitting || !user) return;
+    if (!workspaceSlug || !projectId || isSubmitting) return;
 
-    await createLabel(workspaceSlug.toString(), projectId.toString(), formData, user).then(() => {
-      reset(defaultValues);
-      setLabelForm(false);
-    });
+    await issuesService
+      .createIssueLabel(workspaceSlug as string, projectId as string, formData, user)
+      .then((res) => {
+        mutate<IIssueLabels[]>(
+          PROJECT_ISSUE_LABELS(projectId as string),
+          (prevData) => [res, ...(prevData ?? [])],
+          false
+        );
+        reset(defaultValues);
+        setLabelForm(false);
+      });
   };
 
   const handleLabelUpdate: SubmitHandler<IIssueLabels> = async (formData) => {

apps/app/components/modules/select/lead.tsx

@@ -32,11 +32,18 @@ export const ModuleLeadSelect: React.FC<Props> = ({ value, onChange }) => {
 
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {member.member.first_name && member.member.first_name !== ""
+          ? member.member.first_name
+          : member.member.email}
       </div>
     ),
   }));
@@ -55,7 +62,11 @@ export const ModuleLeadSelect: React.FC<Props> = ({ value, onChange }) => {
             <UserCircleIcon className="h-4 w-4 text-custom-text-200" />
           )}
           {selectedOption ? (
-            selectedOption?.display_name
+            selectedOption?.first_name && selectedOption.first_name !== "" ? (
+              selectedOption?.first_name
+            ) : (
+              selectedOption?.email
+            )
           ) : (
             <span className="text-custom-text-200">Lead</span>
           )}

apps/app/components/modules/select/members.tsx

@@ -30,11 +30,18 @@ export const ModuleMembersSelect: React.FC<Props> = ({ value, onChange }) => {
   );
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {member.member.first_name && member.member.first_name !== ""
+          ? member.member.first_name
+          : member.member.email}
       </div>
     ),
   }));

apps/app/components/modules/sidebar-select/select-lead.tsx

@@ -33,11 +33,18 @@ export const SidebarLeadSelect: React.FC<Props> = ({ value, onChange }) => {
 
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {member.member.first_name && member.member.first_name !== ""
+          ? member.member.first_name
+          : member.member.email}
       </div>
     ),
   }));
@@ -57,7 +64,11 @@ export const SidebarLeadSelect: React.FC<Props> = ({ value, onChange }) => {
             <div className="flex items-center gap-2">
               {selectedOption && <Avatar user={selectedOption} />}
               {selectedOption ? (
-                selectedOption?.display_name
+                selectedOption?.first_name && selectedOption.first_name !== "" ? (
+                  selectedOption?.first_name
+                ) : (
+                  selectedOption?.email
+                )
               ) : (
                 <span className="text-custom-text-200">No lead</span>
               )}

apps/app/components/modules/sidebar-select/select-members.tsx

@@ -31,11 +31,18 @@ export const SidebarMembersSelect: React.FC<Props> = ({ value, onChange }) => {
 
   const options = members?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {member.member.first_name && member.member.first_name !== ""
+          ? member.member.first_name
+          : member.member.email}
       </div>
     ),
   }));

apps/app/components/notifications/notification-card.tsx

@@ -27,7 +27,6 @@ import { snoozeOptions } from "constants/notification";
 type NotificationCardProps = {
   notification: IUserNotification;
   markNotificationReadStatus: (notificationId: string) => Promise<void>;
-  markNotificationReadStatusToggle: (notificationId: string) => Promise<void>;
   markNotificationArchivedStatus: (notificationId: string) => Promise<void>;
   setSelectedNotificationForSnooze: (notificationId: string) => void;
   markSnoozeNotification: (notificationId: string, dateTime?: Date | undefined) => Promise<void>;
@@ -37,7 +36,6 @@ export const NotificationCard: React.FC<NotificationCardProps> = (props) => {
   const {
     notification,
     markNotificationReadStatus,
-    markNotificationReadStatusToggle,
     markNotificationArchivedStatus,
     setSelectedNotificationForSnooze,
     markSnoozeNotification,
@@ -78,8 +76,8 @@ export const NotificationCard: React.FC<NotificationCardProps> = (props) => {
         ) : (
           <div className="w-12 h-12 bg-custom-background-80 rounded-full flex justify-center items-center">
             <span className="text-custom-text-100 font-medium text-lg">
-              {notification.triggered_by_details.display_name?.[0] ? (
-                notification.triggered_by_details.display_name?.[0]?.toUpperCase()
+              {notification.triggered_by_details.first_name?.[0] ? (
+                notification.triggered_by_details.first_name?.[0]?.toUpperCase()
               ) : (
                 <Icon iconName="person" className="h-6 w-6" />
               )}
@@ -89,7 +87,10 @@ export const NotificationCard: React.FC<NotificationCardProps> = (props) => {
       </div>
       <div className="space-y-2.5 w-full overflow-hidden">
         <div className="text-sm w-full break-words">
-          <span className="font-semibold">{notification.triggered_by_details.display_name} </span>
+          <span className="font-semibold">
+            {notification.triggered_by_details.first_name}{" "}
+            {notification.triggered_by_details.last_name}{" "}
+          </span>
           {notification.data.issue_activity.field !== "comment" &&
             notification.data.issue_activity.verb}{" "}
           {notification.data.issue_activity.field === "comment"
@@ -158,7 +159,7 @@ export const NotificationCard: React.FC<NotificationCardProps> = (props) => {
             name: notification.read_at ? "Mark as unread" : "Mark as read",
             icon: "chat_bubble",
             onClick: () => {
-              markNotificationReadStatusToggle(notification.id).then(() => {
+              markNotificationReadStatus(notification.id).then(() => {
                 setToastAlert({
                   title: notification.read_at
                     ? "Notification marked as unread"

apps/app/components/notifications/notification-header.tsx

@@ -1,5 +1,10 @@
 import React from "react";
 
+import { useRouter } from "next/router";
+
+// hooks
+import useWorkspaceMembers from "hooks/use-workspace-members";
+
 // components
 import { Icon, Tooltip } from "components/ui";
 // helpers
@@ -39,6 +44,11 @@ export const NotificationHeader: React.FC<NotificationHeaderProps> = (props) =>
     setSelectedTab,
   } = props;
 
+  const router = useRouter();
+  const { workspaceSlug } = router.query;
+
+  const { isOwner, isMember } = useWorkspaceMembers(workspaceSlug?.toString() ?? "");
+
   const notificationTabs: Array<{
     label: string;
     value: NotificationType;
@@ -140,31 +150,59 @@ export const NotificationHeader: React.FC<NotificationHeaderProps> = (props) =>
           </button>
         ) : (
           <nav className="flex space-x-5 overflow-x-auto" aria-label="Tabs">
-            {notificationTabs.map((tab) => (
-              <button
-                type="button"
-                key={tab.value}
-                onClick={() => setSelectedTab(tab.value)}
-                className={`whitespace-nowrap border-b-2 pb-4 px-1 text-sm font-medium outline-none ${
-                  tab.value === selectedTab
-                    ? "border-custom-primary-100 text-custom-primary-100"
-                    : "border-transparent text-custom-text-200"
-                }`}
-              >
-                {tab.label}
-                {tab.unreadCount && tab.unreadCount > 0 ? (
-                  <span
-                    className={`ml-2 rounded-full text-xs px-2 py-0.5 ${
+            {notificationTabs.map((tab) =>
+              tab.value === "created" ? (
+                isMember || isOwner ? (
+                  <button
+                    type="button"
+                    key={tab.value}
+                    onClick={() => setSelectedTab(tab.value)}
+                    className={`whitespace-nowrap border-b-2 pb-4 px-1 text-sm font-medium outline-none ${
                       tab.value === selectedTab
-                        ? "bg-custom-primary-100 text-white"
-                        : "bg-custom-background-80 text-custom-text-200"
+                        ? "border-custom-primary-100 text-custom-primary-100"
+                        : "border-transparent text-custom-text-200"
                     }`}
                   >
-                    {getNumberCount(tab.unreadCount)}
-                  </span>
-                ) : null}
-              </button>
-            ))}
+                    {tab.label}
+                    {tab.unreadCount && tab.unreadCount > 0 ? (
+                      <span
+                        className={`ml-2 rounded-full text-xs px-2 py-0.5 ${
+                          tab.value === selectedTab
+                            ? "bg-custom-primary-100 text-white"
+                            : "bg-custom-background-80 text-custom-text-200"
+                        }`}
+                      >
+                        {getNumberCount(tab.unreadCount)}
+                      </span>
+                    ) : null}
+                  </button>
+                ) : null
+              ) : (
+                <button
+                  type="button"
+                  key={tab.value}
+                  onClick={() => setSelectedTab(tab.value)}
+                  className={`whitespace-nowrap border-b-2 pb-4 px-1 text-sm font-medium ${
+                    tab.value === selectedTab
+                      ? "border-custom-primary-100 text-custom-primary-100"
+                      : "border-transparent text-custom-text-200"
+                  }`}
+                >
+                  {tab.label}
+                  {tab.unreadCount && tab.unreadCount > 0 ? (
+                    <span
+                      className={`ml-2 rounded-full text-xs px-2 py-0.5 ${
+                        tab.value === selectedTab
+                          ? "bg-custom-primary-100 text-white"
+                          : "bg-custom-background-80 text-custom-text-200"
+                      }`}
+                    >
+                      {getNumberCount(tab.unreadCount)}
+                    </span>
+                  ) : null}
+                </button>
+              )
+            )}
           </nav>
         )}
       </div>

apps/app/components/notifications/notification-popover.tsx

@@ -21,12 +21,8 @@ import { NotificationsOutlined } from "@mui/icons-material";
 import emptyNotification from "public/empty-state/notification.svg";
 // helpers
 import { getNumberCount } from "helpers/string.helper";
-// mobx store
-import { useMobxStore } from "lib/mobx/store-provider";
 
 export const NotificationPopover = () => {
-  const store: any = useMobxStore();
-
   const {
     notifications,
     archived,
@@ -42,7 +38,6 @@ export const NotificationPopover = () => {
     notificationMutate,
     markNotificationArchivedStatus,
     markNotificationReadStatus,
-    markNotificationAsRead,
     markSnoozeNotification,
     notificationCount,
     totalNotificationCount,
@@ -81,17 +76,17 @@ export const NotificationPopover = () => {
                 tooltipContent="Notifications"
                 position="right"
                 className="ml-2"
-                disabled={!store?.theme?.sidebarCollapsed}
+                disabled={!sidebarCollapse}
               >
                 <Popover.Button
                   className={`group flex w-full items-center gap-2.5 rounded-md px-3 py-2 text-sm font-medium outline-none ${
                     isActive
                       ? "bg-custom-primary-100/10 text-custom-primary-100"
                       : "text-custom-sidebar-text-200 hover:bg-custom-sidebar-background-80"
-                  } ${store?.theme?.sidebarCollapsed ? "justify-center" : ""}`}
+                  } ${sidebarCollapse ? "justify-center" : ""}`}
                 >
                   <NotificationsOutlined fontSize="small" />
-                  {store?.theme?.sidebarCollapsed ? null : <span>Notifications</span>}
+                  {sidebarCollapse ? null : <span>Notifications</span>}
                   {totalNotificationCount && totalNotificationCount > 0 ? (
                     <span className="ml-auto bg-custom-primary-300 rounded-full text-xs text-white px-1.5">
                       {getNumberCount(totalNotificationCount)}
@@ -133,8 +128,7 @@ export const NotificationPopover = () => {
                               key={notification.id}
                               notification={notification}
                               markNotificationArchivedStatus={markNotificationArchivedStatus}
-                              markNotificationReadStatus={markNotificationAsRead}
-                              markNotificationReadStatusToggle={markNotificationReadStatus}
+                              markNotificationReadStatus={markNotificationReadStatus}
                               setSelectedNotificationForSnooze={setSelectedNotificationForSnooze}
                               markSnoozeNotification={markSnoozeNotification}
                             />

apps/app/components/pages/pages-list/recent-pages-list.tsx

@@ -56,15 +56,13 @@ export const RecentPagesList: React.FC<TPagesListProps> = ({ viewType }) => {
             title="Have your thoughts in place"
             description="You can think of Pages as an AI-powered notepad."
             image={emptyPage}
-            primaryButton={{
-              icon: <PlusIcon className="h-4 w-4" />,
-              text: "New Page",
-              onClick: () => {
-                const e = new KeyboardEvent("keydown", {
-                  key: "d",
-                });
-                document.dispatchEvent(e);
-              },
+            buttonText="New Page"
+            buttonIcon={<PlusIcon className="h-4 w-4" />}
+            onClick={() => {
+              const e = new KeyboardEvent("keydown", {
+                key: "d",
+              });
+              document.dispatchEvent(e);
             }}
           />
         )

apps/app/components/pages/pages-view.tsx

@@ -260,15 +260,13 @@ export const PagesView: React.FC<Props> = ({ pages, viewType }) => {
               title="Have your thoughts in place"
               description="You can think of Pages as an AI-powered notepad."
               image={emptyPage}
-              primaryButton={{
-                icon: <PlusIcon className="h-4 w-4" />,
-                text: "New Page",
-                onClick: () => {
-                  const e = new KeyboardEvent("keydown", {
-                    key: "d",
-                  });
-                  document.dispatchEvent(e);
-                },
+              buttonText="New Page"
+              buttonIcon={<PlusIcon className="h-4 w-4" />}
+              onClick={() => {
+                const e = new KeyboardEvent("keydown", {
+                  key: "d",
+                });
+                document.dispatchEvent(e);
               }}
             />
           )}

apps/app/components/pages/single-page-detailed-item.tsx

@@ -162,7 +162,7 @@ export const SinglePageDetailedItem: React.FC<TSingleStatProps> = ({
                 position="top-right"
                 tooltipContent={`Created by ${
                   people?.find((person) => person.member.id === page.created_by)?.member
-                    .display_name ?? ""
+                    .first_name ?? ""
                 } on ${renderLongDateFormat(`${page.created_at}`)}`}
               >
                 <span>

apps/app/components/pages/single-page-list-item.tsx

@@ -161,7 +161,7 @@ export const SinglePageListItem: React.FC<TSingleStatProps> = ({
                     position="top-right"
                     tooltipContent={`Created by ${
                       people?.find((person) => person.member.id === page.created_by)?.member
-                        .display_name ?? ""
+                        .first_name ?? ""
                     } on ${renderLongDateFormat(`${page.created_at}`)}`}
                   >
                     <span>

apps/app/components/profile/overview/activity.tsx

@@ -1,16 +1,14 @@
 import { useRouter } from "next/router";
+import Link from "next/link";
 
 import useSWR from "swr";
 
 // services
 import userService from "services/user.service";
-// components
-import { ActivityMessage } from "components/core";
 // ui
-import { ProfileEmptyState, Icon, Loader } from "components/ui";
-// image
-import recentActivityEmptyState from "public/empty-state/recent_activity.svg";
+import { Icon, Loader } from "components/ui";
 // helpers
+import { activityDetails } from "helpers/activity.helper";
 import { timeAgo } from "helpers/date-time.helper";
 // fetch-keys
 import { USER_PROFILE_ACTIVITY } from "constants/fetch-keys";
@@ -33,59 +31,51 @@ export const ProfileActivity = () => {
       <h3 className="text-lg font-medium">Recent Activity</h3>
       <div className="border border-custom-border-100 rounded p-6">
         {userProfileActivity ? (
-          userProfileActivity.results.length > 0 ? (
-            <div className="space-y-5">
-              {userProfileActivity.results.map((activity) => (
-                <div key={activity.id} className="flex gap-3">
-                  <div className="flex-shrink-0">
-                    {activity.actor_detail.avatar && activity.actor_detail.avatar !== "" ? (
-                      <img
-                        src={activity.actor_detail.avatar}
-                        alt={activity.actor_detail.display_name}
-                        height={24}
-                        width={24}
-                        className="rounded"
-                      />
-                    ) : (
-                      <div className="grid h-6 w-6 place-items-center rounded border-2 bg-gray-700 text-xs text-white">
-                        {activity.actor_detail.display_name?.charAt(0)}
-                      </div>
-                    )}
-                  </div>
-                  <div className="-mt-1 w-4/5 break-words">
-                    <p className="text-sm text-custom-text-200">
-                      <span className="font-medium text-custom-text-100">
-                        {activity.actor_detail.display_name}{" "}
-                      </span>
-                      {activity.field ? (
-                        <ActivityMessage activity={activity} showIssue />
-                      ) : (
-                        <span>
-                          created this{" "}
-                          <a
-                            href={`/${workspaceSlug}/projects/${activity.project}/issues/${activity.issue}`}
-                            target="_blank"
-                            rel="noopener noreferrer"
-                            className="font-medium text-custom-text-100 inline-flex items-center gap-1 hover:underline"
-                          >
-                            Issue
-                            <Icon iconName="launch" className="!text-xs" />
-                          </a>
-                        </span>
-                      )}
-                    </p>
-                    <p className="text-xs text-custom-text-200">{timeAgo(activity.created_at)}</p>
-                  </div>
+          <div className="space-y-5">
+            {userProfileActivity.results.map((activity) => (
+              <div key={activity.id} className="flex gap-3">
+                <div className="flex-shrink-0">
+                  {activity.actor_detail.avatar && activity.actor_detail.avatar !== "" ? (
+                    <img
+                      src={activity.actor_detail.avatar}
+                      alt={activity.actor_detail.first_name}
+                      height={24}
+                      width={24}
+                      className="rounded"
+                    />
+                  ) : (
+                    <div className="grid h-6 w-6 place-items-center rounded border-2 bg-gray-700 text-xs text-white">
+                      {activity.actor_detail.first_name.charAt(0)}
+                    </div>
+                  )}
                 </div>
-              ))}
-            </div>
-          ) : (
-            <ProfileEmptyState
-              title="No Data yet"
-              description="We couldn’t find data. Kindly view your inputs"
-              image={recentActivityEmptyState}
-            />
-          )
+                <div className="-mt-1 w-4/5 break-words">
+                  <p className="text-sm text-custom-text-200">
+                    <span className="font-medium text-custom-text-100">
+                      {activity.actor_detail.first_name} {activity.actor_detail.last_name}{" "}
+                    </span>
+                    {activity.field ? (
+                      activityDetails[activity.field]?.message(activity as any)
+                    ) : (
+                      <span>
+                        created this{" "}
+                        <a
+                          href={`/${activity.workspace_detail.slug}/projects/${activity.project}/issues/${activity.issue}`}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="font-medium text-custom-text-100 inline-flex items-center gap-1 hover:underline"
+                        >
+                          Issue
+                          <Icon iconName="launch" className="!text-xs" />
+                        </a>
+                      </span>
+                    )}
+                  </p>
+                  <p className="text-xs text-custom-text-200">{timeAgo(activity.created_at)}</p>
+                </div>
+              </div>
+            ))}
+          </div>
         ) : (
           <Loader className="space-y-5">
             <Loader.Item height="40px" />

apps/app/components/profile/overview/priority-distribution.tsx

@@ -1,7 +1,5 @@
 // ui
-import { BarGraph, ProfileEmptyState, Loader } from "components/ui";
-// image
-import priorityGraph from "public/empty-state/priority_graph.svg";
+import { BarGraph, Loader } from "components/ui";
 // helpers
 import { capitalizeFirstLetter } from "helpers/string.helper";
 // types
@@ -16,61 +14,51 @@ export const ProfilePriorityDistribution: React.FC<Props> = ({ userProfile }) =>
     <h3 className="text-lg font-medium">Issues by Priority</h3>
     {userProfile ? (
       <div className="border border-custom-border-100 rounded">
-        {userProfile.priority_distribution.length > 0 ? (
-          <BarGraph
-            data={userProfile.priority_distribution.map((priority) => ({
-              priority: capitalizeFirstLetter(priority.priority ?? "None"),
-              value: priority.priority_count,
-            }))}
-            height="300px"
-            indexBy="priority"
-            keys={["value"]}
-            borderRadius={4}
-            padding={0.7}
-            customYAxisTickValues={userProfile.priority_distribution.map((p) => p.priority_count)}
-            tooltip={(datum) => (
-              <div className="flex items-center gap-2 rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
-                <span
-                  className="h-3 w-3 rounded"
-                  style={{
-                    backgroundColor: datum.color,
-                  }}
-                />
-                <span className="font-medium text-custom-text-200">{datum.data.priority}:</span>
-                <span>{datum.value}</span>
-              </div>
-            )}
-            colors={(datum) => {
-              if (datum.data.priority === "Urgent") return "#991b1b";
-              else if (datum.data.priority === "High") return "#ef4444";
-              else if (datum.data.priority === "Medium") return "#f59e0b";
-              else if (datum.data.priority === "Low") return "#16a34a";
-              else return "#e5e5e5";
-            }}
-            theme={{
-              axis: {
-                domain: {
-                  line: {
-                    stroke: "transparent",
-                  },
-                },
-              },
-              grid: {
+        <BarGraph
+          data={userProfile.priority_distribution.map((priority) => ({
+            priority: capitalizeFirstLetter(priority.priority ?? "None"),
+            value: priority.priority_count,
+          }))}
+          height="300px"
+          indexBy="priority"
+          keys={["value"]}
+          borderRadius={4}
+          padding={0.7}
+          customYAxisTickValues={userProfile.priority_distribution.map((p) => p.priority_count)}
+          tooltip={(datum) => (
+            <div className="flex items-center gap-2 rounded-md border border-custom-border-200 bg-custom-background-80 p-2 text-xs">
+              <span
+                className="h-3 w-3 rounded"
+                style={{
+                  backgroundColor: datum.color,
+                }}
+              />
+              <span className="font-medium text-custom-text-200">{datum.data.priority}:</span>
+              <span>{datum.value}</span>
+            </div>
+          )}
+          colors={(datum) => {
+            if (datum.data.priority === "Urgent") return "#991b1b";
+            else if (datum.data.priority === "High") return "#ef4444";
+            else if (datum.data.priority === "Medium") return "#f59e0b";
+            else if (datum.data.priority === "Low") return "#16a34a";
+            else return "#e5e5e5";
+          }}
+          theme={{
+            axis: {
+              domain: {
                 line: {
                   stroke: "transparent",
                 },
               },
-            }}
-          />
-        ) : (
-          <div className="p-7">
-            <ProfileEmptyState
-              title="No Data yet"
-              description="Create issues to view the them by priority in the graph for better analysis."
-              image={priorityGraph}
-            />
-          </div>
-        )}
+            },
+            grid: {
+              line: {
+                stroke: "transparent",
+              },
+            },
+          }}
+        />
       </div>
     ) : (
       <div className="grid place-items-center p-7">

apps/app/components/profile/overview/state-distribution.tsx

@@ -1,7 +1,5 @@
 // ui
-import { ProfileEmptyState, PieGraph } from "components/ui";
-// image
-import stateGraph from "public/empty-state/state_graph.svg";
+import { PieGraph } from "components/ui";
 // types
 import { IUserProfileData, IUserStateDistribution } from "types";
 // constants
@@ -19,72 +17,64 @@ export const ProfileStateDistribution: React.FC<Props> = ({ stateDistribution, u
     <div className="space-y-2">
       <h3 className="text-lg font-medium">Issues by State</h3>
       <div className="border border-custom-border-100 rounded p-7">
-        {userProfile.state_distribution.length > 0 ? (
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-x-6">
-            <div>
-              <PieGraph
-                data={
-                  userProfile.state_distribution.map((group) => ({
-                    id: group.state_group,
-                    label: group.state_group,
-                    value: group.state_count,
-                    color: STATE_GROUP_COLORS[group.state_group],
-                  })) ?? []
-                }
-                height="250px"
-                innerRadius={0.6}
-                cornerRadius={5}
-                padAngle={2}
-                enableArcLabels
-                arcLabelsTextColor="#000000"
-                enableArcLinkLabels={false}
-                activeInnerRadiusOffset={5}
-                colors={(datum) => datum.data.color}
-                tooltip={(datum) => (
-                  <div className="flex items-center gap-2 rounded-md border border-custom-border-200 bg-custom-background-90 p-2 text-xs">
-                    <span className="text-custom-text-200 capitalize">
-                      {datum.datum.label} issues:
-                    </span>{" "}
-                    {datum.datum.value}
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-x-6">
+          <div>
+            <PieGraph
+              data={
+                userProfile.state_distribution.map((group) => ({
+                  id: group.state_group,
+                  label: group.state_group,
+                  value: group.state_count,
+                  color: STATE_GROUP_COLORS[group.state_group],
+                })) ?? []
+              }
+              height="250px"
+              innerRadius={0.6}
+              cornerRadius={5}
+              padAngle={2}
+              enableArcLabels
+              arcLabelsTextColor="#000000"
+              enableArcLinkLabels={false}
+              activeInnerRadiusOffset={5}
+              colors={(datum) => datum.data.color}
+              tooltip={(datum) => (
+                <div className="flex items-center gap-2 rounded-md border border-custom-border-200 bg-custom-background-90 p-2 text-xs">
+                  <span className="text-custom-text-200 capitalize">
+                    {datum.datum.label} issues:
+                  </span>{" "}
+                  {datum.datum.value}
+                </div>
+              )}
+              margin={{
+                top: 32,
+                right: 0,
+                bottom: 32,
+                left: 0,
+              }}
+            />
+          </div>
+          <div className="flex items-center">
+            <div className="space-y-4 w-full">
+              {stateDistribution.map((group) => (
+                <div
+                  key={group.state_group}
+                  className="flex items-center justify-between gap-2 text-xs"
+                >
+                  <div className="flex items-center gap-1.5">
+                    <div
+                      className="h-2.5 w-2.5 rounded-sm"
+                      style={{
+                        backgroundColor: STATE_GROUP_COLORS[group.state_group],
+                      }}
+                    />
+                    <div className="capitalize whitespace-nowrap">{group.state_group}</div>
                   </div>
-                )}
-                margin={{
-                  top: 32,
-                  right: 0,
-                  bottom: 32,
-                  left: 0,
-                }}
-              />
-            </div>
-            <div className="flex items-center">
-              <div className="space-y-4 w-full">
-                {stateDistribution.map((group) => (
-                  <div
-                    key={group.state_group}
-                    className="flex items-center justify-between gap-2 text-xs"
-                  >
-                    <div className="flex items-center gap-1.5">
-                      <div
-                        className="h-2.5 w-2.5 rounded-sm"
-                        style={{
-                          backgroundColor: STATE_GROUP_COLORS[group.state_group],
-                        }}
-                      />
-                      <div className="capitalize whitespace-nowrap">{group.state_group}</div>
-                    </div>
-                    <div>{group.state_count}</div>
-                  </div>
-                ))}
-              </div>
+                  <div>{group.state_count}</div>
+                </div>
+              ))}
             </div>
           </div>
-        ) : (
-          <ProfileEmptyState
-            title="No Data yet"
-            description="Create issues to view the them by states in the graph for better analysis."
-            image={stateGraph}
-          />
-        )}
+        </div>
       </div>
     </div>
   );

apps/app/components/profile/profile-issues-view-options.tsx

@@ -172,109 +172,106 @@ export const ProfileIssuesViewOptions: React.FC = () => {
                       <>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Group by</h4>
-                          <div className="w-28">
-                            <CustomMenu
-                              label={
-                                groupByProperty === "project"
-                                  ? "Project"
-                                  : GROUP_BY_OPTIONS.find(
-                                      (option) => option.key === groupByProperty
-                                    )?.name ?? "Select"
-                              }
-                              className="!w-full"
-                              buttonClassName="w-full"
-                            >
-                              {GROUP_BY_OPTIONS.map((option) => {
-                                if (issueView === "kanban" && option.key === null) return null;
-                                if (option.key === "state" || option.key === "created_by")
-                                  return null;
+                          <CustomMenu
+                            label={
+                              groupByProperty === "project"
+                                ? "Project"
+                                : GROUP_BY_OPTIONS.find((option) => option.key === groupByProperty)
+                                    ?.name ?? "Select"
+                            }
+                          >
+                            {GROUP_BY_OPTIONS.map((option) => {
+                              if (issueView === "kanban" && option.key === null) return null;
+                              if (option.key === "state" || option.key === "created_by")
+                                return null;
 
-                                return (
-                                  <CustomMenu.MenuItem
-                                    key={option.key}
-                                    onClick={() => setGroupByProperty(option.key)}
-                                  >
-                                    {option.name}
-                                  </CustomMenu.MenuItem>
-                                );
-                              })}
-                            </CustomMenu>
-                          </div>
+                              return (
+                                <CustomMenu.MenuItem
+                                  key={option.key}
+                                  onClick={() => setGroupByProperty(option.key)}
+                                >
+                                  {option.name}
+                                </CustomMenu.MenuItem>
+                              );
+                            })}
+                          </CustomMenu>
                         </div>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Order by</h4>
-                          <div className="w-28">
-                            <CustomMenu
-                              label={
-                                ORDER_BY_OPTIONS.find((option) => option.key === orderBy)?.name ??
-                                "Select"
-                              }
-                              className="!w-full"
-                              buttonClassName="w-full"
-                            >
-                              {ORDER_BY_OPTIONS.map((option) => {
-                                if (groupByProperty === "priority" && option.key === "priority")
-                                  return null;
-                                if (option.key === "sort_order") return null;
+                          <CustomMenu
+                            label={
+                              ORDER_BY_OPTIONS.find((option) => option.key === orderBy)?.name ??
+                              "Select"
+                            }
+                          >
+                            {ORDER_BY_OPTIONS.map((option) => {
+                              if (groupByProperty === "priority" && option.key === "priority")
+                                return null;
+                              if (option.key === "sort_order") return null;
 
-                                return (
-                                  <CustomMenu.MenuItem
-                                    key={option.key}
-                                    onClick={() => {
-                                      setOrderBy(option.key);
-                                    }}
-                                  >
-                                    {option.name}
-                                  </CustomMenu.MenuItem>
-                                );
-                              })}
-                            </CustomMenu>
-                          </div>
+                              return (
+                                <CustomMenu.MenuItem
+                                  key={option.key}
+                                  onClick={() => {
+                                    setOrderBy(option.key);
+                                  }}
+                                >
+                                  {option.name}
+                                </CustomMenu.MenuItem>
+                              );
+                            })}
+                          </CustomMenu>
                         </div>
                       </>
                     )}
                     <div className="flex items-center justify-between">
                       <h4 className="text-custom-text-200">Issue type</h4>
-                      <div className="w-28">
-                        <CustomMenu
-                          label={
-                            FILTER_ISSUE_OPTIONS.find((option) => option.key === filters?.type)
-                              ?.name ?? "Select"
-                          }
-                          className="!w-full"
-                          buttonClassName="w-full"
-                        >
-                          {FILTER_ISSUE_OPTIONS.map((option) => (
-                            <CustomMenu.MenuItem
-                              key={option.key}
-                              onClick={() =>
-                                setFilters({
-                                  type: option.key,
-                                })
-                              }
-                            >
-                              {option.name}
-                            </CustomMenu.MenuItem>
-                          ))}
-                        </CustomMenu>
-                      </div>
+                      <CustomMenu
+                        label={
+                          FILTER_ISSUE_OPTIONS.find((option) => option.key === filters?.type)
+                            ?.name ?? "Select"
+                        }
+                      >
+                        {FILTER_ISSUE_OPTIONS.map((option) => (
+                          <CustomMenu.MenuItem
+                            key={option.key}
+                            onClick={() =>
+                              setFilters({
+                                type: option.key,
+                              })
+                            }
+                          >
+                            {option.name}
+                          </CustomMenu.MenuItem>
+                        ))}
+                      </CustomMenu>
                     </div>
 
                     {issueView !== "calendar" && issueView !== "spreadsheet" && (
                       <>
                         <div className="flex items-center justify-between">
                           <h4 className="text-custom-text-200">Show empty states</h4>
-                          <div className="w-28">
-                            <ToggleSwitch value={showEmptyGroups} onChange={setShowEmptyGroups} />
-                          </div>
+                          <ToggleSwitch value={showEmptyGroups} onChange={setShowEmptyGroups} />
                         </div>
+                        {/* <div className="relative flex justify-end gap-x-3">
+                          <button type="button" onClick={() => resetFilterToDefault()}>
+                            Reset to default
+                          </button>
+                          <button
+                            type="button"
+                            className="font-medium text-custom-primary"
+                            onClick={() => setNewFilterDefaultView()}
+                          >
+                            Set as default
+                          </button>
+                        </div> */}
                       </>
                     )}
                   </div>
 
                   <div className="space-y-2 py-3">
                     <h4 className="text-sm text-custom-text-200">Display Properties</h4>
-                    <div className="flex flex-wrap items-center gap-2 text-custom-text-200">
+                    <div className="flex flex-wrap items-center gap-2">
                       {Object.keys(properties).map((key) => {
                         if (key === "estimate" && !isEstimateActive) return null;
 

apps/app/components/profile/profile-issues-view.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 
 import { useRouter } from "next/router";
 
@@ -8,7 +8,6 @@ import useSWR from "swr";
 import { DropResult } from "react-beautiful-dnd";
 // services
 import issuesService from "services/issues.service";
-import userService from "services/user.service";
 // hooks
 import useProfileIssues from "hooks/use-profile-issues";
 import useUser from "hooks/use-user";
@@ -20,7 +19,7 @@ import { orderArrayBy } from "helpers/array.helper";
 // types
 import { IIssue, IIssueFilterOptions } from "types";
 // fetch-keys
-import { USER_PROFILE_PROJECT_SEGREGATION, WORKSPACE_LABELS } from "constants/fetch-keys";
+import { WORKSPACE_LABELS } from "constants/fetch-keys";
 
 export const ProfileIssuesView = () => {
   // create issue modal
@@ -61,16 +60,6 @@ export const ProfileIssuesView = () => {
     params,
   } = useProfileIssues(workspaceSlug?.toString(), userId?.toString());
 
-  const { data: profileData } = useSWR(
-    workspaceSlug && userId
-      ? USER_PROFILE_PROJECT_SEGREGATION(workspaceSlug.toString(), userId.toString())
-      : null,
-    workspaceSlug && userId
-      ? () =>
-          userService.getUserProfileProjectsSegregation(workspaceSlug.toString(), userId.toString())
-      : null
-  );
-
   const { data: labels } = useSWR(
     workspaceSlug && (filters?.labels ?? []).length > 0
       ? WORKSPACE_LABELS(workspaceSlug.toString())
@@ -151,26 +140,10 @@ export const ProfileIssuesView = () => {
     ]
   );
 
-  const addIssueToGroup = useCallback(
-    (groupTitle: string) => {
-      setCreateIssueModal(true);
-
-      let preloadedValue: string | string[] = groupTitle;
-
-      if (groupByProperty === "labels") {
-        if (groupTitle === "None") preloadedValue = [];
-        else preloadedValue = [groupTitle];
-      }
-
-      if (groupByProperty)
-        setPreloadedData({
-          [groupByProperty]: preloadedValue,
-          actionType: "createIssue",
-        });
-      else setPreloadedData({ actionType: "createIssue" });
-    },
-    [setCreateIssueModal, setPreloadedData, groupByProperty]
-  );
+  const addIssueToGroup = useCallback((groupTitle: string) => {
+    setCreateIssueModal(true);
+    return;
+  }, []);
 
   const addIssueToDate = useCallback(
     (date: string) => {
@@ -277,13 +250,6 @@ export const ProfileIssuesView = () => {
         addIssueToGroup={addIssueToGroup}
         disableUserActions={false}
         dragDisabled={groupByProperty !== "priority"}
-        emptyState={{
-          title: router.pathname.includes("assigned")
-            ? `Issues assigned to ${profileData?.user_data.display_name} will appear here`
-            : router.pathname.includes("created")
-            ? `Issues created by ${profileData?.user_data.display_name} will appear here`
-            : `Issues subscribed by ${profileData?.user_data.display_name} will appear here`,
-        }}
         handleOnDragEnd={handleOnDragEnd}
         handleIssueAction={handleIssueAction}
         openIssuesListModal={null}

apps/app/components/profile/sidebar.tsx

@@ -86,29 +86,29 @@ export const ProfileSidebar = () => {
                 userProjectsData.user_data.cover_image ??
                 "https://images.unsplash.com/photo-1506383796573-caf02b4a79ab"
               }
-              alt={userProjectsData.user_data.display_name}
+              alt={userProjectsData.user_data.first_name}
               className="h-32 w-full object-cover"
             />
             <div className="absolute -bottom-[26px] left-5 h-[52px] w-[52px] rounded">
               {userProjectsData.user_data.avatar && userProjectsData.user_data.avatar !== "" ? (
                 <img
                   src={userProjectsData.user_data.avatar}
-                  alt={userProjectsData.user_data.display_name}
+                  alt={userProjectsData.user_data.first_name}
                   className="rounded"
                 />
               ) : (
-                <div className="bg-custom-background-90 flex justify-center items-center w-[52px] h-[52px] rounded text-custom-text-100">
-                  {userProjectsData.user_data.display_name?.[0]}
+                <div className="bg-custom-background-90 text-custom-text-100">
+                  {userProjectsData.user_data.first_name[0]}
                 </div>
               )}
             </div>
           </div>
           <div className="px-5">
             <div className="mt-[38px]">
-              <h4 className="text-lg font-semibold">{userProjectsData.user_data.display_name}</h4>
-              <h6 className="text-custom-text-200 text-sm">
-                {userProjectsData.user_data.display_name}
-              </h6>
+              <h4 className="text-lg font-semibold">
+                {userProjectsData.user_data.first_name} {userProjectsData.user_data.last_name}
+              </h4>
+              <h6 className="text-custom-text-200 text-sm">{userProjectsData.user_data.email}</h6>
             </div>
             <div className="mt-6 space-y-5">
               {userDetails.map((detail) => (

apps/app/components/project/confirm-project-member-remove.tsx

@@ -67,13 +67,13 @@ const ConfirmProjectMemberRemove: React.FC<Props> = ({ isOpen, onClose, data, ha
                         as="h3"
                         className="text-lg font-medium leading-6 text-custom-text-100"
                       >
-                        Remove {data?.display_name}?
+                        Remove {data?.email}?
                       </Dialog.Title>
                       <div className="mt-2">
                         <p className="text-sm text-custom-text-200">
                           Are you sure you want to remove member-{" "}
-                          <span className="font-bold">{data?.display_name}</span>? They will no
-                          longer have access to this project. This action cannot be undone.
+                          <span className="font-bold">{data?.email}</span>? They will no longer have
+                          access to this project. This action cannot be undone.
                         </p>
                       </div>
                     </div>

apps/app/components/project/create-project-modal.tsx

@@ -47,7 +47,7 @@ type Props = {
 
 const defaultValues: Partial<IProject> = {
   cover_image:
-    "https://images.unsplash.com/photo-1531045535792-b515d59c3d1f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=870&q=80",
+    "https://images.unsplash.com/photo-1575116464504-9e7652fddcb3?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwyODUyNTV8MHwxfHNlYXJjaHwxOHx8cGxhbmV8ZW58MHx8fHwxNjgxNDY4NTY5&ixlib=rb-4.0.3&q=80&w=1080",
   description: "",
   emoji_and_icon: getRandomEmoji(),
   identifier: "",
@@ -163,11 +163,20 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
 
   const options = workspaceMembers?.map((member) => ({
     value: member.member.id,
-    query: member.member.display_name,
+    query:
+      (member.member.first_name && member.member.first_name !== ""
+        ? member.member.first_name
+        : member.member.email) +
+        " " +
+        member.member.last_name ?? "",
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={member.member} />
-        {member.member.display_name}
+        {`${
+          member.member.first_name && member.member.first_name !== ""
+            ? member.member.first_name
+            : member.member.email
+        } ${member.member.last_name ?? ""}`}
       </div>
     ),
   }));
@@ -204,7 +213,7 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
               leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
             >
               <Dialog.Panel className="transform rounded-lg bg-custom-background-100 text-left shadow-xl transition-all p-3 w-full sm:w-3/5 lg:w-1/2 xl:w-2/5">
-                <div className="group relative h-44 w-full rounded-lg bg-custom-background-80">
+                <div className="group relative h-36 w-full rounded-lg bg-custom-background-80">
                   {watch("cover_image") !== null && (
                     <img
                       src={watch("cover_image")!}
@@ -301,7 +310,7 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
                         <TextArea
                           id="description"
                           name="description"
-                          className="text-sm !h-24"
+                          className="text-sm !h-[8rem]"
                           placeholder="Description..."
                           error={errors.description}
                           register={register}
@@ -318,7 +327,6 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
                             <CustomSelect
                               value={value}
                               onChange={onChange}
-                              buttonClassName="border-[0.5px] !px-2 shadow-md"
                               label={
                                 <div className="flex items-center gap-2 -mb-0.5 py-1">
                                   {currentNetwork ? (
@@ -361,13 +369,15 @@ export const CreateProjectModal: React.FC<Props> = ({ isOpen, setIsOpen, user })
                                 value={value}
                                 onChange={onChange}
                                 options={options}
-                                buttonClassName="!px-2 shadow-md"
                                 label={
                                   <div className="flex items-center justify-center gap-2 py-[1px]">
                                     {value ? (
                                       <>
                                         <Avatar user={selectedMember?.member} />
-                                        <span>{selectedMember?.member.display_name} </span>
+                                        <span>
+                                          {selectedMember?.member.first_name}{" "}
+                                          {selectedMember?.member.last_name}
+                                        </span>
                                         <span onClick={() => onChange(null)}>
                                           <Icon
                                             iconName="close"

apps/app/components/project/send-project-invitation-modal.tsx

@@ -82,7 +82,7 @@ const SendProjectInvitationModal: React.FC<Props> = ({ isOpen, setIsOpen, member
   });
 
   const uninvitedPeople = people?.filter((person) => {
-    const isInvited = members?.find((member) => member.display_name === person.member.display_name);
+    const isInvited = members?.find((member) => member.email === person.member.email);
     return !isInvited;
   });
 
@@ -136,11 +136,11 @@ const SendProjectInvitationModal: React.FC<Props> = ({ isOpen, setIsOpen, member
 
   const options = uninvitedPeople?.map((person) => ({
     value: person.member.id,
-    query: person.member.display_name,
+    query: person.member.email,
     content: (
       <div className="flex items-center gap-2">
         <Avatar user={person.member} />
-        {person.member.display_name}
+        {person.member.email}
       </div>
     ),
   }));
@@ -209,10 +209,7 @@ const SendProjectInvitationModal: React.FC<Props> = ({ isOpen, setIsOpen, member
                                               people?.find((p) => p.member.id === value)?.member
                                             }
                                           />
-                                          {
-                                            people?.find((p) => p.member.id === value)?.member
-                                              .display_name
-                                          }
+                                          {people?.find((p) => p.member.id === value)?.member.email}
                                         </div>
                                       ) : (
                                         <div>Select co-worker&rsquo;s email</div>

apps/app/components/project/sidebar-list.tsx

@@ -5,8 +5,6 @@ import { mutate } from "swr";
 
 // react-beautiful-dnd
 import { DragDropContext, Draggable, DropResult, Droppable } from "react-beautiful-dnd";
-// headless ui
-import { Disclosure } from "@headlessui/react";
 // hooks
 import useToast from "hooks/use-toast";
 import useTheme from "hooks/use-theme";
@@ -17,7 +15,6 @@ import { DeleteProjectModal, SingleSidebarProject } from "components/project";
 // services
 import projectService from "services/project.service";
 // icons
-import { Icon } from "components/ui";
 import { PlusIcon } from "@heroicons/react/24/outline";
 // helpers
 import { copyTextToClipboard } from "helpers/string.helper";
@@ -26,18 +23,14 @@ import { orderArrayBy } from "helpers/array.helper";
 import { IProject } from "types";
 // fetch-keys
 import { PROJECTS_LIST } from "constants/fetch-keys";
-// mobx store
-import { useMobxStore } from "lib/mobx/store-provider";
 
 export const ProjectSidebarList: FC = () => {
-  const store: any = useMobxStore();
-
   const [deleteProjectModal, setDeleteProjectModal] = useState(false);
   const [projectToDelete, setProjectToDelete] = useState<IProject | null>(null);
 
   // router
   const router = useRouter();
-  const { workspaceSlug, projectId } = router.query;
+  const { workspaceSlug } = router.query;
 
   const { user } = useUserAuth();
 
@@ -45,18 +38,15 @@ export const ProjectSidebarList: FC = () => {
   const { setToastAlert } = useToast();
 
   const { projects: allProjects } = useProjects();
-
-  const joinedProjects = allProjects?.filter((p) => p.sort_order);
   const favoriteProjects = allProjects?.filter((p) => p.is_favorite);
-  const otherProjects = allProjects?.filter((p) => p.sort_order === null);
 
-  const orderedJoinedProjects: IProject[] | undefined = joinedProjects
-    ? orderArrayBy(joinedProjects, "sort_order", "ascending")
-    : undefined;
+  const orderedAllProjects = allProjects
+    ? orderArrayBy(allProjects, "sort_order", "ascending")
+    : [];
 
-  const orderedFavProjects: IProject[] | undefined = favoriteProjects
+  const orderedFavProjects = favoriteProjects
     ? orderArrayBy(favoriteProjects, "sort_order", "ascending")
-    : undefined;
+    : [];
 
   const handleDeleteProject = (project: IProject) => {
     setProjectToDelete(project);
@@ -79,25 +69,22 @@ export const ProjectSidebarList: FC = () => {
     const { source, destination, draggableId } = result;
 
     if (!destination || !workspaceSlug) return;
-
     if (source.index === destination.index) return;
 
-    const projectsList =
-      (destination.droppableId === "joined-projects"
-        ? orderedJoinedProjects
-        : orderedFavProjects) ?? [];
+    const projectList =
+      destination.droppableId === "all-projects" ? orderedAllProjects : orderedFavProjects;
 
-    let updatedSortOrder = projectsList[source.index].sort_order;
-
-    if (destination.index === 0) updatedSortOrder = (projectsList[0].sort_order as number) - 1000;
-    else if (destination.index === projectsList.length - 1)
-      updatedSortOrder = (projectsList[projectsList.length - 1].sort_order as number) + 1000;
-    else {
-      const destinationSortingOrder = projectsList[destination.index].sort_order as number;
+    let updatedSortOrder = projectList[source.index].sort_order;
+    if (destination.index === 0) {
+      updatedSortOrder = projectList[0].sort_order - 1000;
+    } else if (destination.index === projectList.length - 1) {
+      updatedSortOrder = projectList[projectList.length - 1].sort_order + 1000;
+    } else {
+      const destinationSortingOrder = projectList[destination.index].sort_order;
       const relativeDestinationSortingOrder =
         source.index < destination.index
-          ? (projectsList[destination.index + 1].sort_order as number)
-          : (projectsList[destination.index - 1].sort_order as number);
+          ? projectList[destination.index + 1].sort_order
+          : projectList[destination.index - 1].sort_order;
 
       updatedSortOrder = Math.round(
         (destinationSortingOrder + relativeDestinationSortingOrder) / 2
@@ -134,148 +121,76 @@ export const ProjectSidebarList: FC = () => {
         data={projectToDelete}
         user={user}
       />
-      <div className="h-full overflow-y-auto px-4 space-y-3 pt-3 border-t border-custom-sidebar-border-300">
+      <div className="h-full overflow-y-auto px-4">
         <DragDropContext onDragEnd={onDragEnd}>
           <Droppable droppableId="favorite-projects">
             {(provided) => (
               <div ref={provided.innerRef} {...provided.droppableProps}>
                 {orderedFavProjects && orderedFavProjects.length > 0 && (
-                  <Disclosure as="div" className="flex flex-col space-y-2" defaultOpen={true}>
-                    {({ open }) => (
-                      <>
-                        {!store?.theme?.sidebarCollapsed && (
-                          <Disclosure.Button
-                            as="button"
-                            type="button"
-                            className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-200 text-left hover:bg-custom-sidebar-background-80 rounded w-min whitespace-nowrap"
-                          >
-                            Favorites
-                            <Icon
-                              iconName={open ? "arrow_drop_down" : "arrow_right"}
-                              className="group-hover:opacity-100 opacity-0 !text-lg"
-                            />
-                          </Disclosure.Button>
-                        )}
-                        <Disclosure.Panel as="div" className="space-y-2">
-                          {orderedFavProjects.map((project, index) => (
-                            <Draggable
-                              key={project.id}
-                              draggableId={project.id}
-                              index={index}
-                              isDragDisabled={project.sort_order === null}
-                            >
-                              {(provided, snapshot) => (
-                                <div ref={provided.innerRef} {...provided.draggableProps}>
-                                  <SingleSidebarProject
-                                    key={project.id}
-                                    project={project}
-                                    sidebarCollapse={store?.theme?.sidebarCollapsed}
-                                    provided={provided}
-                                    snapshot={snapshot}
-                                    handleDeleteProject={() => handleDeleteProject(project)}
-                                    handleCopyText={() => handleCopyText(project.id)}
-                                    shortContextMenu
-                                  />
-                                </div>
-                              )}
-                            </Draggable>
-                          ))}
-                        </Disclosure.Panel>
-                        {provided.placeholder}
-                      </>
+                  <div className="flex flex-col space-y-2 mt-5">
+                    {!sidebarCollapse && (
+                      <h5 className="text-sm font-medium text-custom-sidebar-text-200">
+                        Favorites
+                      </h5>
                     )}
-                  </Disclosure>
+                    {orderedFavProjects.map((project, index) => (
+                      <Draggable key={project.id} draggableId={project.id} index={index}>
+                        {(provided, snapshot) => (
+                          <div ref={provided.innerRef} {...provided.draggableProps}>
+                            <SingleSidebarProject
+                              key={project.id}
+                              project={project}
+                              sidebarCollapse={sidebarCollapse}
+                              provided={provided}
+                              snapshot={snapshot}
+                              handleDeleteProject={() => handleDeleteProject(project)}
+                              handleCopyText={() => handleCopyText(project.id)}
+                              shortContextMenu
+                            />
+                          </div>
+                        )}
+                      </Draggable>
+                    ))}
+                    {provided.placeholder}
+                  </div>
                 )}
               </div>
             )}
           </Droppable>
         </DragDropContext>
         <DragDropContext onDragEnd={onDragEnd}>
-          <Droppable droppableId="joined-projects">
+          <Droppable droppableId="all-projects">
             {(provided) => (
               <div ref={provided.innerRef} {...provided.droppableProps}>
-                {orderedJoinedProjects && orderedJoinedProjects.length > 0 && (
-                  <Disclosure as="div" className="flex flex-col space-y-2" defaultOpen={true}>
-                    {({ open }) => (
-                      <>
-                        {!store?.theme?.sidebarCollapsed && (
-                          <Disclosure.Button
-                            as="button"
-                            type="button"
-                            className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-200 text-left hover:bg-custom-sidebar-background-80 rounded w-min whitespace-nowrap"
-                          >
-                            Projects
-                            <Icon
-                              iconName={open ? "arrow_drop_down" : "arrow_right"}
-                              className="group-hover:opacity-100 opacity-0 !text-lg"
-                            />
-                          </Disclosure.Button>
-                        )}
-                        <Disclosure.Panel as="div" className="space-y-2">
-                          {orderedJoinedProjects.map((project, index) => (
-                            <Draggable key={project.id} draggableId={project.id} index={index}>
-                              {(provided, snapshot) => (
-                                <div ref={provided.innerRef} {...provided.draggableProps}>
-                                  <SingleSidebarProject
-                                    key={project.id}
-                                    project={project}
-                                    sidebarCollapse={store?.theme?.sidebarCollapsed}
-                                    provided={provided}
-                                    snapshot={snapshot}
-                                    handleDeleteProject={() => handleDeleteProject(project)}
-                                    handleCopyText={() => handleCopyText(project.id)}
-                                  />
-                                </div>
-                              )}
-                            </Draggable>
-                          ))}
-                        </Disclosure.Panel>
-                        {provided.placeholder}
-                      </>
+                {orderedAllProjects && orderedAllProjects.length > 0 && (
+                  <div className="flex flex-col space-y-2 mt-5">
+                    {!sidebarCollapse && (
+                      <h5 className="text-sm font-medium text-custom-sidebar-text-200">Projects</h5>
                     )}
-                  </Disclosure>
+                    {orderedAllProjects.map((project, index) => (
+                      <Draggable key={project.id} draggableId={project.id} index={index}>
+                        {(provided, snapshot) => (
+                          <div ref={provided.innerRef} {...provided.draggableProps}>
+                            <SingleSidebarProject
+                              key={project.id}
+                              project={project}
+                              sidebarCollapse={sidebarCollapse}
+                              provided={provided}
+                              snapshot={snapshot}
+                              handleDeleteProject={() => handleDeleteProject(project)}
+                              handleCopyText={() => handleCopyText(project.id)}
+                            />
+                          </div>
+                        )}
+                      </Draggable>
+                    ))}
+                    {provided.placeholder}
+                  </div>
                 )}
               </div>
             )}
           </Droppable>
         </DragDropContext>
-        {otherProjects && otherProjects.length > 0 && (
-          <Disclosure
-            as="div"
-            className="flex flex-col space-y-2"
-            defaultOpen={projectId && otherProjects.find((p) => p.id === projectId) ? true : false}
-          >
-            {({ open }) => (
-              <>
-                {!store?.theme?.sidebarCollapsed && (
-                  <Disclosure.Button
-                    as="button"
-                    type="button"
-                    className="group flex items-center gap-1 px-1.5 text-xs font-semibold text-custom-sidebar-text-200 text-left hover:bg-custom-sidebar-background-80 rounded w-min whitespace-nowrap"
-                  >
-                    Other Projects
-                    <Icon
-                      iconName={open ? "arrow_drop_down" : "arrow_right"}
-                      className="group-hover:opacity-100 opacity-0 !text-lg"
-                    />
-                  </Disclosure.Button>
-                )}
-                <Disclosure.Panel as="div" className="space-y-2">
-                  {otherProjects?.map((project, index) => (
-                    <SingleSidebarProject
-                      key={project.id}
-                      project={project}
-                      sidebarCollapse={store?.theme?.sidebarCollapsed}
-                      handleDeleteProject={() => handleDeleteProject(project)}
-                      handleCopyText={() => handleCopyText(project.id)}
-                      shortContextMenu
-                    />
-                  ))}
-                </Disclosure.Panel>
-              </>
-            )}
-          </Disclosure>
-        )}
         {allProjects && allProjects.length === 0 && (
           <button
             type="button"
@@ -288,7 +203,7 @@ export const ProjectSidebarList: FC = () => {
             }}
           >
             <PlusIcon className="h-5 w-5" />
-            {!store?.theme?.sidebarCollapsed && "Add Project"}
+            {!sidebarCollapse && "Add Project"}
           </button>
         )}
       </div>