Merge pull request #1127 from line/dev

release: 6.2451.72

.nvmrc

@@ -1 +1 @@
-22.11.0
+22.12.0

apps/api/package.json

@@ -95,7 +95,7 @@
     "@types/express": "^5.0.0",
     "@types/jest": "^29.5.12",
     "@types/luxon": "^3.4.2",
-    "@types/node": "22.10.1",
+    "@types/node": "22.10.2",
     "@types/nodemailer": "^6.4.15",
     "@types/passport-jwt": "*",
     "@types/supertest": "^6.0.2",

apps/web/package.json

@@ -31,11 +31,11 @@
   },
   "dependencies": {
     "@faker-js/faker": "^9.0.0",
-    "@floating-ui/react": "^0.26.12",
+    "@floating-ui/react": "^0.27.0",
     "@headlessui/react": "2.2.0",
     "@headlessui/tailwindcss": "^0.2.0",
     "@hookform/resolvers": "^3.3.4",
-    "@mui/base": "5.0.0-beta.63",
+    "@mui/base": "5.0.0-beta.66",
     "@t3-oss/env-nextjs": "^0.11.0",
     "@tanstack/react-query": "^5.31.0",
     "@tanstack/react-table": "^8.16.0",
@@ -47,7 +47,7 @@
     "axios-auth-refresh": "^3.3.6",
     "classnames": "^2.5.1",
     "clsx": "^2.1.0",
-    "cookies-next": "^4.1.1",
+    "cookies-next": "^5.0.0",
     "countries-and-timezones": "^3.6.0",
     "date-fns": "^4.0.0",
     "dayjs": "^1.11.10",
@@ -87,7 +87,7 @@
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.12",
-    "@types/node": "22.10.1",
+    "@types/node": "22.10.2",
     "@types/react": "^18.2.79",
     "@types/react-beautiful-dnd": "^13.1.8",
     "@types/react-datepicker": "^7.0.0",

apps/web/src/shared/ui/locale-select-box.ui.tsx

@@ -29,7 +29,7 @@ const LocaleSelectBox: React.FC<IProps> = () => {
   const onToggleLanguageClick = useCallback(
     async (newLocale: string) => {
       const { pathname, asPath, query } = router;
-      setCookie('NEXT_LOCALE', newLocale);
+      await setCookie('NEXT_LOCALE', newLocale);
       await router.push({ pathname, query }, asPath, { locale: newLocale });
     },
     [router],

apps/web/src/shared/utils/text-linkify.tsx

@@ -0,0 +1,44 @@
+/**
+ * Copyright 2023 LINE Corporation
+ *
+ * LINE Corporation licenses this file to you under the Apache License,
+ * version 2.0 (the "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at:
+ *
+ *   https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ */
+
+export const linkify = (text: string): React.ReactNode[] => {
+  const urlRegex =
+    /https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_+.~#?&//=]*)/g;
+
+  const parts = text.split(urlRegex);
+  const matches = text.match(urlRegex) ?? [];
+  const result: React.ReactNode[] = [];
+
+  parts.forEach((part, index) => {
+    result.push(part);
+    if (index < matches.length) {
+      result.push(
+        <a
+          key={index}
+          href={matches[index]}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="text-blue-primary underline"
+          onClick={(e) => e.stopPropagation()}
+        >
+          {matches[index]}
+        </a>,
+      );
+    }
+  });
+
+  return result;
+};

apps/web/src/widgets/feedback-table/ui/feedback-cell.tsx

@@ -17,6 +17,7 @@ import { memo } from 'react';
 import dayjs from 'dayjs';
 
 import { DATE_TIME_FORMAT, ExpandableText, ImagePreviewButton } from '@/shared';
+import { linkify } from '@/shared/utils/text-linkify';
 import type { Field } from '@/entities/field';
 
 interface IProps extends React.PropsWithChildren {
@@ -52,7 +53,7 @@ const FeedbackCell: React.FC<IProps> = memo((props) => {
       : field.format === 'images' ?
         <ImagePreviewButton urls={value as string[]} />
       : field.format === 'text' ?
-        (value as string)
+        linkify(value as string)
       : String(value)}
     </ExpandableText>
   );

apps/web/src/widgets/feedback-table/ui/feedback-detail/feedback-detail.tsx

@@ -31,6 +31,7 @@ import { useTranslation } from 'react-i18next';
 import { Icon } from '@ufb/ui';
 
 import { DATE_TIME_FORMAT, ImageSlider, useOAIQuery } from '@/shared';
+import { linkify } from '@/shared/utils/text-linkify';
 import { useFeedbackSearch } from '@/entities/feedback';
 import { isDefaultField, sortField } from '@/entities/field';
 import { IssueBadge } from '@/entities/issue';
@@ -189,7 +190,7 @@ const FeedbackDetail: React.FC<IProps> = (props) => {
                           <ImageSlider
                             urls={(feedbackData[field.key] ?? []) as string[]}
                           />
-                        : feedbackData[field.key]}
+                        : linkify(String(feedbackData[field.key] ?? ''))}
                       </FeedbackDetailCell>
                     </tr>
                   ))}

package.json

@@ -26,7 +26,7 @@
     "turbo": "^2.0.9",
     "typescript": "^5.5.4"
   },
-  "packageManager": "pnpm@9.14.4",
+  "packageManager": "pnpm@9.15.0",
   "engines": {
     "node": ">=20.11.1"
   }

packages/ufb-ui/package.json

@@ -12,7 +12,7 @@
   },
   "prettier": "@ufb/prettier-config",
   "dependencies": {
-    "@floating-ui/react": "^0.26.12",
+    "@floating-ui/react": "^0.27.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-hot-toast": "^2.4.1"