Merge remote-tracking branch 'refs/remotes/origin/main'

Author: Eunjin03

.github/workflows/main.yml

@@ -1,30 +1,24 @@
-name: git push into another repo to deploy to vercel
+name: Deploy Frontend
 
 on:
   push:
-    branches: [main]
+    branches: [ main ]  
 
 jobs:
-  build:
+  deploy:
     runs-on: ubuntu-latest
-    container: pandoc/latex
+
     steps:
-      - uses: actions/checkout@v2
-      - name: Install mustache (to update the date)
-        run: apk add ruby && gem install mustache
-      - name: creates output
-        run: sh ./build.sh
-      - name: Pushes to another repository
-        id: push_directory
-        uses: cpina/github-action-push-to-another-repository@main
-        env:
-          API_TOKEN_GITHUB: ${{ secrets.AUTH_TOKEN }}
+      - name: Deploy to EC2
+        uses: appleboy/[email protected]
         with:
-          source-directory: 'output'
-          destination-github-username: Eunjin03
-          destination-repository-name: client
-          user-email: ${{ secrets.OFFICIAL_ACCOUNT_EMAIL }}
-          commit-message: ${{ github.event.commits[0].message }}
-          target-branch: main
-      - name: Test get variable exported by push-to-another-repository
-        run: echo $DESTINATION_CLONED_DIRECTORY
+          host: ${{ secrets.REMOTE_IP }}
+          username: ${{ secrets.REMOTE_USER }}
+          key: ${{ secrets.REMOTE_PRIVATE_KEY }}
+          port: ${{ secrets.REMOTE_SSH_PORT }}
+          script: |
+            cd /home/ubuntu/client  # 프로젝트 디렉토리
+            git pull origin main
+            cd client
+            npm install
+            npm run build

src/api/meeting/meeting.ts

@@ -7,10 +7,10 @@ export const getMeetingId = () => {
   });
 };
 
-export const postScript = (data: any) => {
+export const postScript = (projectId: string, data: any) => {
   return Send({
     method: "post",
-    url: "conference/script",
+    url: `conference/${projectId}/script`,
     data: data
   });
 };

src/sass/helpers/_variables.sass

@@ -15,6 +15,8 @@ $gray-700: #545456
 $gray-800: #363638
 $gray-900: #161618
 
+$purple-50: #EEE8FD
+$purple-100: #D3C6FA
 $purple-400: #7C55F4
 $purple-500: #5E35F0
 $purple-600: #4F31E9

src/views/meeting/components/MindMapComponent.tsx

@@ -74,7 +74,7 @@ const MindMapComponent = ({
 
   const meetingStart = () => {
     const client = new Client({
-      brokerURL: "wss://3.39.11.168:8080/ws", // 서버 WebSocket URL q
+      brokerURL: "ws://3.39.11.168:8080/ws", // 서버 WebSocket URL q
       reconnectDelay: 5000,
       debug: (str) => {
         console.log(str);
@@ -138,7 +138,7 @@ const MindMapComponent = ({
             projectId: conferenceData.projectId,
             scription: testString,
           };
-          postScript(data).then((res: any) => {
+          postScript(conferenceData.projectId, data).then((res: any) => {
             setScriptList([]);
 
             setSummary((prev) => [
@@ -243,8 +243,6 @@ const MindMapComponent = ({
   useEffect(() => {
     setNodes(initialNodes);
     setEdges(initialEdges);
-
-    console.log(initialNodes, initialEdges);
   }, [initialNodes, initialEdges]); // 임시방편으로 만듦
 
   const onConnect = useCallback(
@@ -280,6 +278,20 @@ const MindMapComponent = ({
     [nodes, edges]
   );
 
+const ClickKeyword = (keyword: string) => {
+  const newNode: Node = {
+    id: `${Date.now()}`,
+    type: "default",
+    data: { label: keyword },
+    position: {
+      x: Math.random() * 250,
+      y: Math.random() * 250,
+    },
+  };
+
+  setNodes((nds) => [...nds, newNode]);
+};
+
   return (
     <div className="mind-map-container">
       {mode === "none" ? (
@@ -409,6 +421,7 @@ const MindMapComponent = ({
                           className="keyword"
                           id={x.id.toString()}
                           key={x.id}
+                          onClick={() => {ClickKeyword(x.value)}}
                         >
                           {x.value}
                         </button>
@@ -427,6 +440,7 @@ const MindMapComponent = ({
                           className="keyword"
                           id={x.id.toString()}
                           key={x.id}
+                          onClick={() => {ClickKeyword(x.value)}}
                         >
                           {x.value}
                         </button>

src/views/meeting/style/mind-map.sass

@@ -50,6 +50,29 @@
       max-width: 100%
       max-height: 100%
 
+      .react-flow
+        .react-flow__node
+          +padding(8px 16px)
+          border-radius: 10px
+          border: 0
+          font-size: 14px
+          font-weight: bold
+
+          .react-flow__handle
+            +size(4px, 4px)
+            background-color: $purple-100
+
+        .react-flow__node-input
+          color: $white
+          background-color: $purple-600
+
+        .react-flow__node-default
+          background-color: $purple-100
+
+        .react-flow__node-output
+          background-color: $purple-50
+
+
     .middle-bar
       +size(435px, 64px)
       +flex-box(center, center)
@@ -214,7 +237,7 @@
               color: $page-color
               background-color: #EEE8FD
               border: 1px solid $page-color
-          
+
         p
           +margin(top 5px)
           font-size: 12px