galadrim-feedback 0.0.1

package/src/services/feedback.ts

@@ -0,0 +1,62 @@
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import api from "./api";
+import { Feedback, FeedbackPayload } from "../types/types";
+
+export const fetchFeedbacks = async () => {
+  const response = await api.get<Feedback[]>("/feedback");
+  return response.data;
+};
+
+export const createFeedback = async (feedback: FeedbackPayload) => {
+  const response = await api.post("/feedback", feedback);
+  return response.data;
+};
+
+export const updateFeedback = async (feedback: FeedbackPayload) => {
+  const response = await api.put("/feedback", feedback);
+  return response.data;
+};
+
+export const deleteFeedback = async (feedback: Feedback) => {
+  const response = await api.delete(`/feedback/${feedback.id}`);
+  return response.data;
+};
+
+export const useFeedbacks = () => {
+  return useQuery({
+    queryKey: ["feedbacks"],
+    queryFn: fetchFeedbacks,
+  });
+};
+
+export const useCreateFeedback = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: createFeedback,
+    onSuccess: () => {
+      console.log("Feedback created");
+
+      return queryClient.invalidateQueries({ queryKey: ["feedbacks"] });
+    },
+  });
+};
+
+export const useUpdateFeedback = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: updateFeedback,
+    onSuccess: () => {
+      return queryClient.invalidateQueries({ queryKey: ["feedbacks"] });
+    },
+  });
+};
+
+export const useDeleteFeedback = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: deleteFeedback,
+    onSuccess: () => {
+      return queryClient.invalidateQueries({ queryKey: ["feedbacks"] });
+    },
+  });
+};

package/src/types/types.d.ts

@@ -0,0 +1,16 @@
+export interface FeedbackPayload {
+  x: number;
+  y: number;
+  screenWidth: number;
+  screenHeight: number;
+  elementId: string;
+  elementIndex: number;
+  comment: string;
+  path: string;
+}
+
+export interface Feedback extends FeedbackPayload {
+  id: string;
+  createdAt: Date;
+  updatedAt: Date;
+}

package/tailwind.config.js

@@ -0,0 +1,46 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
+  theme: {
+    extend: {
+      colors: {
+        gray: {
+          50: "#F2F2F2",
+          75: "#F4F5F7",
+          100: "#E2E8F0",
+          200: "#EAECF0",
+          300: "#676D78",
+          400: "#343D4B",
+          500: "#010C1E",
+          600: "#475467",
+          700: "#CBD5E1",
+          900: "#101828",
+        },
+        blue: {
+          50: "#F5FAFF",
+          100: "#EBF5FF",
+          500: "#0085FF",
+        },
+        red: {
+          100: "#FFD3E0",
+          500: "#FF2462",
+        },
+        rose: {
+          100: "#FFD3E0",
+          200: "#FFA7C0",
+        },
+        orange: {
+          50: "#FEF6EE",
+          200: "#F9DBAF",
+          700: "#B93815",
+        },
+        green: {
+          50: "#ECFDF3",
+          200: "#ABEFC6",
+          700: "#067647",
+        },
+      },
+    },
+  },
+  plugins: [],
+};

package/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "module": "ESNext",
+    "jsx": "react-jsx",
+    // Generate type definitions
+    "declaration": true,
+    "declarationDir": "dist/types",
+    "outDir": "dist",
+    "moduleResolution": "node",
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "strict": true
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "**/*.test.*"]
+}