Merge pull request #101 from cabcookie/staging

Staging

api/useActivity.ts

@@ -3,6 +3,7 @@ import {
   EditorJsonContent,
   transformNotesVersion,
 } from "@/components/ui-elements/notes-writer/NotesWriter";
+import { useToast } from "@/components/ui/use-toast";
 import { SelectionSet, generateClient } from "aws-amplify/data";
 import useSWR from "swr";
 import { handleApiErrors } from "./globals";
@@ -75,6 +76,7 @@ const useActivity = (activityId?: string) => {
     isLoading: loadingActivity,
     mutate: mutateActivity,
   } = useSWR(`/api/activities/${activityId}`, fetchActivity(activityId));
+  const { toast } = useToast();
 
   const updateDate = async (date: Date) => {
     if (!activity) return;
@@ -109,12 +111,31 @@ const useActivity = (activityId?: string) => {
     return data?.id;
   };
 
+  const addProjectToActivity = async (projectId: string | null) => {
+    if (!activity) return;
+    if (!projectId) return;
+    const updated: Activity = {
+      ...activity,
+      projectIds: [...activity.projectIds, projectId],
+    };
+    mutateActivity(updated, false);
+    const { data, errors } = await client.models.ProjectActivity.create({
+      activityId: activity.id,
+      projectsId: projectId,
+    });
+    if (errors) handleApiErrors(errors, "Error adding project to current note");
+    if (data) toast({ title: "Added note to another project" });
+    mutateActivity(updated);
+    return data?.id;
+  };
+
   return {
     activity,
     loadingActivity,
     errorActivity,
     updateNotes,
     updateDate,
+    addProjectToActivity,
   };
 };
 

components/activities/activity.tsx

@@ -1,12 +1,22 @@
 import useActivity from "@/api/useActivity";
+import { ExternalLink, LinkIcon } from "lucide-react";
+import Link from "next/link";
 import { FC, useEffect, useState } from "react";
 import NotesWriter, {
   SerializerOutput,
 } from "../ui-elements/notes-writer/NotesWriter";
 import SavedState from "../ui-elements/project-notes-form/saved-state";
 import DateSelector from "../ui-elements/selectors/date-selector";
+import ProjectSelector from "../ui-elements/selectors/project-selector";
 import MeetingName from "../ui-elements/tokens/meeting-name";
 import ProjectName from "../ui-elements/tokens/project-name";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "../ui/tooltip";
+import { useToast } from "../ui/use-toast";
 import { debouncedUpdateNotes, debounedUpdateDate } from "./activity-helper";
 import ActivityMetaData from "./activity-meta-data";
 
@@ -16,6 +26,7 @@ type ActivityComponentProps = {
   showProjects?: boolean;
   showMeeting?: boolean;
   autoFocus?: boolean;
+  allowAddingProjects?: boolean;
 };
 
 const ActivityComponent: FC<ActivityComponentProps> = ({
@@ -24,10 +35,13 @@ const ActivityComponent: FC<ActivityComponentProps> = ({
   showMeeting,
   showProjects,
   autoFocus,
+  allowAddingProjects,
 }) => {
-  const { activity, updateNotes, updateDate } = useActivity(activityId);
+  const { activity, updateNotes, updateDate, addProjectToActivity } =
+    useActivity(activityId);
   const [dateSaved, setDateSaved] = useState(true);
   const [date, setDate] = useState(activity?.finishedOn || new Date());
+  const { toast } = useToast();
 
   useEffect(() => {
     setDate(activity?.finishedOn || new Date());
@@ -49,32 +63,74 @@ const ActivityComponent: FC<ActivityComponentProps> = ({
     });
   };
 
+  const handleCopyToClipBoard = async () => {
+    if (!activity) return;
+    try {
+      const domain = window.location.origin;
+      const activityLink = `${domain}/activities/${activity.id}`;
+
+      await navigator.clipboard.writeText(activityLink);
+      toast({ title: "Activity link copied to clipboard" });
+    } catch (error) {
+      toast({
+        title: "Error copying Activity link to clipboard",
+        variant: "destructive",
+        description: JSON.stringify(error),
+      });
+    }
+  };
+
   return (
-    <div className="pb-8">
+    <div className="pb-8 space-y-4">
       {showDates && (
-        <div>
+        <div className="flex flex-row gap-2">
           <DateSelector
             date={date}
             setDate={handleDateUpdate}
             selectHours
             bold
           />
+          <TooltipProvider>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <LinkIcon
+                  className="mt-2 text-muted-foreground hover:text-primary"
+                  onClick={handleCopyToClipBoard}
+                />
+              </TooltipTrigger>
+              <TooltipContent>
+                <p>Copy link of the note to clipboard</p>
+              </TooltipContent>
+            </Tooltip>
+          </TooltipProvider>
+
+          <Link href={`/activities/${activityId}`}>
+            <ExternalLink className="mt-2 text-muted-foreground hover:text-primary" />
+          </Link>
+
           <SavedState saved={dateSaved} />
         </div>
       )}
 
       {showProjects && (
         <div>
-          On:
+          <strong>On:</strong>
           {activity?.projectIds.map((id) => (
             <ProjectName key={id} projectId={id} />
           ))}
+          {allowAddingProjects && (
+            <ProjectSelector
+              value=""
+              onChange={addProjectToActivity}
+              placeholder="Add project to activity…"
+            />
+          )}
         </div>
       )}
 
       {showMeeting && activity?.meetingId && (
         <div>
-          At:
+          <strong>At:</strong>
           <MeetingName meetingId={activity.meetingId} />
         </div>
       )}

components/ui/tooltip.tsx

@@ -0,0 +1,28 @@
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const TooltipProvider = TooltipPrimitive.Provider;
+
+const Tooltip = TooltipPrimitive.Root;
+
+const TooltipTrigger = TooltipPrimitive.Trigger;
+
+const TooltipContent = React.forwardRef<
+  React.ElementRef<typeof TooltipPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
+>(({ className, sideOffset = 4, ...props }, ref) => (
+  <TooltipPrimitive.Content
+    ref={ref}
+    sideOffset={sideOffset}
+    className={cn(
+      "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    )}
+    {...props}
+  />
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

docs/releases/next.md

@@ -1,3 +1,4 @@
-# Accordion-Breite optimiert (Version :VERSION)
+# Notizen Seite eingeführt (Version :VERSION)
 
-Wenn ein Accordion zu viel Text im Untertitel hatte, wurde es breiter, als der Screen. Das ist jetzt behoben.
+Notizen können nun auf einer eigenen Seite geöffnet werden. Dort können sie dann auch noch einmal für ein weiteres Projekt verlinkt werden.
+Für Aktivitäten kann man nun den Link in die Zwischenablage kopieren und somit in anderen Notizen darauf verlinken.