Feat/video anaylsis

[sedanah-m]

Feature sample for analyzing videos: https://firebase.google.com/docs/ai-logic/analyze-video?api=dev

[gemini-code-assist]

Code Review

This pull request introduces a new Video Analysis feature, refactors the Text Generation feature to support system instructions and streaming, and cleans up the Chat feature. Feedback on these changes includes adding the new Video Analysis feature to the sidebar navigation and registering it in the router, fixing a typo in the folder name (video-anaylsis), correcting an inconsistent model name (gemini-3.7-flash vs gemini-3.5-flash), and implementing client-side file size validation to prevent performance issues when uploading large videos.

[gemini-code-assist]

The new Video Analysis feature is missing from the sidebar navigation items. Add it to NAV_ITEMS so users can navigate to it.

Suggested change

	{ path: '/image-generation', label: 'Image Generation' },
	];
	{ path: '/image-generation', label: 'Image Generation' },
	{ path: '/video-analysis', label: 'Video Analysis' },
	];

[gemini-code-assist]

The new VideoAnalysis feature is not registered in the router. To make it accessible, please:

1. Import VideoAnalysis from ./features/video-analysis at the top of the file.
2. Add the route { path: 'video-analysis', element: <VideoAnalysis /> } to the router children.
3. Add case 'video-analysis': return <VideoAnalysis />; to the renderContent switch-case for isolated features.

[gemini-code-assist]

Inconsistent model name used here (gemini-3.7-flash). Everywhere else in the codebase (including analyzeVideo in this file and text-generation/service.ts), gemini-3.5-flash is used. Please update this to maintain consistency and ensure the correct model is called.

Suggested change

	const model = getAiModel('gemini-3.7-flash');
	const model = getAiModel('gemini-3.5-flash');

[gemini-code-assist]

There is a typo in the folder name video-anaylsis (should be video-analysis). Please rename the folder and update any import paths accordingly to maintain clean code and avoid confusion.

[gemini-code-assist]

Since the UI notes that inline payloads are recommended to be under 20MB, it is highly recommended to enforce this limit on the client side. Reading extremely large video files into memory as Base64 can crash the browser tab or cause severe performance issues.

  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    const file = e.target.files?.[0] || null;
    if (file && file.size > 20 * 1024 * 1024) {
      setError('File size exceeds the 20MB limit for inline payloads.');
      setSelectedFile(null);
      if (fileInputRef.current) {
        fileInputRef.current.value = '';
      }
      return;
    }
    setSelectedFile(file);
    setError(null);
  };