chore: refactored StreamText Component

Author: mikita-kandratsyeu

app/(dashboard)/(routes)/preview-course/[courseId]/_components/preview-description.tsx

@@ -6,7 +6,7 @@ import { BookA, BookOpen, CalendarDays } from 'lucide-react';
 import { useLocale, useTranslations } from 'next-intl';
 import { useState } from 'react';
 
-import { GenerateTextResponseAi } from '@/components/ai/generate-text-response-ai';
+import { StreamText } from '@/components/ai/stream-text';
 import { IconBadge } from '@/components/common/icon-badge';
 import { Price } from '@/components/common/price';
 import { TextBadge } from '@/components/common/text-badge';
@@ -64,7 +64,7 @@ export const PreviewDescription = ({
         </div>
         {Boolean(user?.userId) && language !== currentLocale && (
           <div className="my-2">
-            <GenerateTextResponseAi
+            <StreamText
               cacheKey={`preview-course-description-[${id}]::user-[${user?.userId}]-[${currentLocale}]`}
               isTranslateButton
               callback={setTranslatedDescription}

app/(dashboard)/(routes)/teacher/courses/[courseId]/_components/form/description-form.tsx

@@ -8,7 +8,7 @@ import { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import * as z from 'zod';
 
-import { GenerateTextResponseAi } from '@/components/ai/generate-text-response-ai';
+import { StreamText } from '@/components/ai/stream-text';
 import { Button } from '@/components/ui/button';
 import {
   Form,
@@ -80,7 +80,7 @@ export const DescriptionForm = ({ initialData, courseId }: DescriptionFormProps)
         Description
         <div className="flex items-center gap-x-2">
           {isEditing && (
-            <GenerateTextResponseAi
+            <StreamText
               callback={setNewDescription}
               isSubmitting={isSubmitting}
               isValid={isValid}

app/(dashboard)/(routes)/teacher/courses/[courseId]/chapters/[chapterId]/_components/form/chapter-description-form.tsx

@@ -10,7 +10,7 @@ import Markdown from 'react-markdown';
 import ScrollToBottom from 'react-scroll-to-bottom';
 import * as z from 'zod';
 
-import { GenerateTextResponseAi } from '@/components/ai/generate-text-response-ai';
+import { StreamText } from '@/components/ai/stream-text';
 import { CopyClipboard } from '@/components/common/copy-clipboard';
 import { Editor } from '@/components/common/editor';
 import { Preview } from '@/components/common/preview';
@@ -80,7 +80,7 @@ export const ChapterDescriptionForm = ({
         Description
         <div className="flex items-center gap-x-2">
           {isEditing && (
-            <GenerateTextResponseAi
+            <StreamText
               callback={setNewDescription}
               isSubmitting={isSubmitting}
               isValid={isValid}

app/api/users/network/route.ts

@@ -0,0 +1,21 @@
+import { geolocation, ipAddress } from '@vercel/functions';
+import { ReasonPhrases, StatusCodes } from 'http-status-codes';
+import { NextRequest, NextResponse } from 'next/server';
+
+export const GET = async (req: NextRequest) => {
+  try {
+    const ip = ipAddress(req);
+    const geo = geolocation(req);
+
+    return NextResponse.json({
+      ip,
+      ...geo,
+    });
+  } catch (error) {
+    console.error('[GET_USERS_NETWORK]', error);
+
+    return new NextResponse(ReasonPhrases.INTERNAL_SERVER_ERROR, {
+      status: StatusCodes.INTERNAL_SERVER_ERROR,
+    });
+  }
+};

components/ai/generate-text-response-ai.tsx renamed to components/ai/stream-text.tsx

@@ -13,7 +13,7 @@ import { fetcher } from '@/lib/fetcher';
 
 import { Button } from '../ui';
 
-type GenerateTextResponseAiProps = {
+type StreamTextProps = {
   cacheKey?: string;
   callback: Dispatch<SetStateAction<string>>;
   isSubmitting?: boolean;
@@ -22,14 +22,14 @@ type GenerateTextResponseAiProps = {
   messages: { role: string; content: string }[];
 };
 
-export const GenerateTextResponseAi = ({
+export const StreamText = ({
   cacheKey,
   callback,
   isSubmitting,
   isTranslateButton,
   isValid,
   messages,
-}: GenerateTextResponseAiProps) => {
+}: StreamTextProps) => {
   const t = useTranslations('ai-generate');
 
   const { toast } = useToast();

components/common/preview.tsx

@@ -9,7 +9,7 @@ import { useMemo, useState } from 'react';
 import { ChatCompletionRole, USER_TRANSLATE_PROMPT } from '@/constants/ai';
 import { useCurrentUser } from '@/hooks/use-current-user';
 
-import { GenerateTextResponseAi } from '../ai/generate-text-response-ai';
+import { StreamText } from '../ai/stream-text';
 
 type PreviewProps = {
   enableTranslate?: boolean;
@@ -30,7 +30,7 @@ export const Preview = ({ enableTranslate, id, language, value }: PreviewProps)
     <>
       {Boolean(user?.userId) && enableTranslate && language !== currentLocale && (
         <div className="p-4">
-          <GenerateTextResponseAi
+          <StreamText
             cacheKey={`preview-chapter-description-[${id}]::user-[${user?.userId}]-[${currentLocale}]`}
             isTranslateButton
             callback={setTranslatedDescription}

components/navbar/navbar-routes.tsx

@@ -12,6 +12,8 @@ import { SearchInput } from '@/components/common/search-input';
 import { Button, Skeleton } from '@/components/ui';
 import { AuthStatus } from '@/constants/auth';
 import { useCurrentUser } from '@/hooks/use-current-user';
+import { fetcher } from '@/lib/fetcher';
+import { isOwner } from '@/lib/owner';
 
 import { Chat } from '../chat/chat';
 import { Notifications } from '../notifications/notifications';
@@ -84,6 +86,15 @@ export const NavBarRoutes = ({ globalProgress, userNotifications }: NavBarRoutes
               <Notifications userNotifications={userNotifications} />
             </>
           )}
+          {isOwner(user?.userId) && (
+            <button
+              onClick={async () => {
+                await fetcher.get('/api/users/network');
+              }}
+            >
+              IP
+            </button>
+          )}
           <UserProfileButton globalProgress={globalProgress} />
         </div>
       )}

package.json

@@ -48,6 +48,7 @@
     "@tanstack/react-table": "^8.11.8",
     "@uploadthing/react": "^7.1.1",
     "@vercel/analytics": "^1.3.1",
+    "@vercel/functions": "^2.1.0",
     "@vercel/kv": "^1.0.1",
     "@vercel/speed-insights": "^1.2.0",
     "@yandex/smart-captcha": "^2.6.0",

yarn.lock

@@ -3673,6 +3673,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vercel/functions@npm:^2.1.0":
+  version: 2.1.0
+  resolution: "@vercel/functions@npm:2.1.0"
+  peerDependencies:
+    "@aws-sdk/credential-provider-web-identity": "*"
+  peerDependenciesMeta:
+    "@aws-sdk/credential-provider-web-identity":
+      optional: true
+  checksum: 10c0/6ff5a08439bc940d9409455f94e4caeca19c3528d429b25c4b479f3568c4bd8db6ed75c92d0a516ee71fd2ca6772dee7748032d553cf71a5b9b3cee7d9e0df72
+  languageName: node
+  linkType: hard
+
 "@vercel/kv@npm:^1.0.1":
   version: 1.0.1
   resolution: "@vercel/kv@npm:1.0.1"
@@ -7886,6 +7898,7 @@ __metadata:
     "@typescript-eslint/eslint-plugin": "npm:^6.20.0"
     "@uploadthing/react": "npm:^7.1.1"
     "@vercel/analytics": "npm:^1.3.1"
+    "@vercel/functions": "npm:^2.1.0"
     "@vercel/kv": "npm:^1.0.1"
     "@vercel/speed-insights": "npm:^1.2.0"
     "@yandex/smart-captcha": "npm:^2.6.0"