Мелкие доработки

docker-compose.yml

@@ -6,12 +6,7 @@ services:
       dockerfile: ./Dockerfile
     networks:
       - Pumpkin-network
-    volumes:
-      - pumpkin-user-uploads:/usr/share/nginx/html/uploads
-volumes:
-  pumpkin-user-uploads:
 
 networks:
   Pumpkin-network:
-    external:
-      name: Pumpkin-network
+    external: true

nginx.conf

@@ -6,8 +6,8 @@ server {
 
     # MIME-типы будут правильно определены автоматически
     location /static/ {
-        root /static;
-        try_files /static /static/ =404;
+        alias /usr/share/nginx/html/static/;
+        try_files $uri $uri/ =404;
     }
 
     location ~* ^/(main\.js|runtime\.js|main\.css|.*\.ttf|sw\.js)$ {

src/api/columnsCards.ts

@@ -59,13 +59,18 @@ export const updateColumn = async (
 export const createColumn = async (
   boardId: number,
   columnData: ColumnRequest
-): Promise<BoardColumn> => {
+): Promise<BoardColumn | undefined> => {
   try {
     const response = await apiPost(`/columns/board_${boardId}`, columnData);
-    if (response.status === HTTP_STATUS_CREATED) {
-      return response.body as BoardColumn;
-    } else {
-      handleErrorResponse(response.status, response.body.text);
+    switch (response.status) {
+      case HTTP_STATUS_CREATED:
+      case HTTP_STATUS_OK:
+        showToast('Успешно создана колонка', 'success');
+        return response.body as BoardColumn;
+
+      default:
+        handleErrorResponse(response.status, response.body.text);
+        return undefined;
     }
   } catch (error) {
     console.error(error);
@@ -77,7 +82,7 @@ export const createColumn = async (
 export const createCard = async (
   boardId: number,
   data: CardRequest
-): Promise<Card> => {
+): Promise<Card | undefined> => {
   try {
     const response = await apiPost(`/cards/board_${boardId}`, data);
     switch (response.status) {
@@ -87,6 +92,7 @@ export const createCard = async (
         return decodeCard(response.body as CardResponse);
       default:
         handleErrorResponse(response.status, response.body.text);
+        return undefined;
     }
   } catch (error) {
     showToast('Произошла ошибка при создании карточки.', 'error');
@@ -98,7 +104,7 @@ export const createCard = async (
 export const updateCard = async (
   cardId: number,
   data: CardPatchRequest
-): Promise<Card> => {
+): Promise<Card | undefined> => {
   try {
     const response = await apiPatch(`/cards/card_${cardId}`, data);
     switch (response.status) {
@@ -108,6 +114,7 @@ export const updateCard = async (
         return decodeCard(response.body as CardResponse);
       default:
         handleErrorResponse(response.status, response.body.text);
+        return undefined;
     }
   } catch (error) {
     showToast('Произошла ошибка при изменении карточки.', 'error');

src/components/KanbanColumn.tsx

@@ -40,8 +40,10 @@ export const KanbanColumn = (props: KanbanColumnProps) => {
       title: newText,
       columnId: props.columnId,
     }).then((newCard) => {
-      activeBoard.columns[props.columnIndex].cards.push(newCard);
-      setIsInputOpened(false);
+      if (newCard !== undefined) {
+        activeBoard.columns[props.columnIndex].cards.push(newCard);
+        setIsInputOpened(false);
+      }
     });
   };
   useEffectRefs((refs) => {

src/components/kanbanCard.scss

@@ -1,5 +1,6 @@
 .kanban-card {
   border-radius: 8px;
+  min-height: 32px;
   background-color: white;
   padding: 4px 6px;
   display: flex;
@@ -11,35 +12,44 @@
   box-shadow: 0px 1px 1px #091e4240, 0px 0px 1px #091e424f,
     0px 1px 1px #091e4240, 0px 0px 1px #091e424f; // Позаимствовали у Trello
 }
+
 @media screen and (max-width: 800px) {
   .kanban-card {
     padding-right: 15px;
   }
 }
+
 .kanban-card__cover {
   max-width: 100%;
   max-height: 150px;
 }
+
 .kanban-card__delete-button {
   position: absolute;
-  top: 2px;
-  right: 2px;
-  width: 18px;
-  height: 18px;
-  background-color: #eee;
-  color: var(--color-negative);
-  border-radius: 2px;
+  width: 32px;
+  right: 0;
+  top: 0;
+  height: 32px;
+  border-radius: 9px;
   cursor: pointer;
-  box-shadow: -2px 2px 10px 4px rgba(40, 40, 40, 0.3);
+  transition: background-color 0.3s ease;
+  backdrop-filter: blur(10px);
+}
+
+.kanban-card__delete-button:hover {
+  background-color: rgba(0, 0, 0, 0.1);
 }
+
 @media screen and (min-width: 800px) {
   .kanban-card__delete-button {
     opacity: 0;
   }
 }
+
 .kanban-card:hover .kanban-card__delete-button {
   opacity: 100;
 }
+
 .kanban-card__title {
   user-select: none;
   cursor: text;

src/containers/KanbanBoard.tsx

@@ -33,10 +33,12 @@ const NewColumnButton = () => {
       return;
     }
     createColumn(activeBoardStore.id, { title: value }).then((newColumn) => {
-      newColumn.cards = [];
-      activeBoardStore.columns.push(newColumn);
-      setActiveBoardStore(activeBoardStore);
-      setNewColumnName('');
+      if (newColumn !== undefined) {
+        newColumn.cards = [];
+        activeBoardStore.columns.push(newColumn);
+        setActiveBoardStore(activeBoardStore);
+        setNewColumnName('');
+      }
     });
     setIsOpened(false);
   };