feat: 新增核心 API 客户端、认证服务(含令牌刷新和 GitHub OAuth)、图片管理功能及相关 UI 组件和测试。
This commit is contained in:
@@ -105,7 +105,7 @@ export const ImageAttachment: React.FC<ImageAttachmentProps> = ({
|
|||||||
onClick={() => handleImageClick(index)}
|
onClick={() => handleImageClick(index)}
|
||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
src={`${import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1'}/images/${image.id}`}
|
src={`${import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1'}/images/${image.id}`}
|
||||||
alt={image.fileName}
|
alt={image.fileName}
|
||||||
className="image-attachment__thumbnail"
|
className="image-attachment__thumbnail"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -152,7 +152,7 @@ export const ImagePreview: React.FC<ImagePreviewProps> = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
const currentImage = images[currentIndex];
|
const currentImage = images[currentIndex];
|
||||||
const imageUrl = `${import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1'}/images/${currentImage.id}`;
|
const imageUrl = `${import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1'}/images/${currentImage.id}`;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -8,7 +8,7 @@ import { useEffect, useRef, useCallback } from 'react';
|
|||||||
import { getAccessToken, getRefreshToken, setTokens, clearTokens } from '../services/authService';
|
import { getAccessToken, getRefreshToken, setTokens, clearTokens } from '../services/authService';
|
||||||
import type { TokenPair } from '../services/authService';
|
import type { TokenPair } from '../services/authService';
|
||||||
|
|
||||||
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1';
|
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1';
|
||||||
|
|
||||||
// Refresh token 5 minutes before expiration
|
// Refresh token 5 minutes before expiration
|
||||||
const REFRESH_BUFFER_MS = 5 * 60 * 1000;
|
const REFRESH_BUFFER_MS = 5 * 60 * 1000;
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
* Validates: Requirements 12.3, 12.4
|
* Validates: Requirements 12.3, 12.4
|
||||||
*/
|
*/
|
||||||
|
|
||||||
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1';
|
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1';
|
||||||
|
|
||||||
// Token storage keys
|
// Token storage keys
|
||||||
const ACCESS_TOKEN_KEY = 'access_token';
|
const ACCESS_TOKEN_KEY = 'access_token';
|
||||||
|
|||||||
@@ -134,7 +134,7 @@ export function logout(): void {
|
|||||||
* Validates: Requirements 13.1
|
* Validates: Requirements 13.1
|
||||||
*/
|
*/
|
||||||
export function getGitHubLoginUrl(state?: string): string {
|
export function getGitHubLoginUrl(state?: string): string {
|
||||||
const baseUrl = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1';
|
const baseUrl = import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1';
|
||||||
const url = new URL(`${baseUrl}/auth/github`);
|
const url = new URL(`${baseUrl}/auth/github`);
|
||||||
if (state) {
|
if (state) {
|
||||||
url.searchParams.append('state', state);
|
url.searchParams.append('state', state);
|
||||||
|
|||||||
@@ -224,14 +224,14 @@ describe('imageService', () => {
|
|||||||
|
|
||||||
it('should use API base URL from environment or default', () => {
|
it('should use API base URL from environment or default', () => {
|
||||||
const url = getImageUrl(456);
|
const url = getImageUrl(456);
|
||||||
expect(url).toMatch(/^http:\/\/localhost:8080\/api\/v1\/images\/456$/);
|
expect(url).toMatch(/^http:\/\/localhost:2612\/api\/v1\/images\/456$/);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('API calls', () => {
|
describe('API calls', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
// Mock fetch
|
// Mock fetch
|
||||||
global.fetch = vi.fn();
|
globalThis.fetch = vi.fn();
|
||||||
// Mock localStorage
|
// Mock localStorage
|
||||||
Storage.prototype.getItem = vi.fn(() => 'mock-token');
|
Storage.prototype.getItem = vi.fn(() => 'mock-token');
|
||||||
});
|
});
|
||||||
@@ -254,7 +254,7 @@ describe('imageService', () => {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
(global.fetch as any).mockResolvedValueOnce({
|
(globalThis.fetch as any).mockResolvedValueOnce({
|
||||||
ok: true,
|
ok: true,
|
||||||
json: async () => mockResponse,
|
json: async () => mockResponse,
|
||||||
});
|
});
|
||||||
@@ -265,7 +265,7 @@ describe('imageService', () => {
|
|||||||
// Mock compressImage to return the file as-is (high quality)
|
// Mock compressImage to return the file as-is (high quality)
|
||||||
const result = await uploadImage(123, file, 'high');
|
const result = await uploadImage(123, file, 'high');
|
||||||
|
|
||||||
expect(global.fetch).toHaveBeenCalledWith(
|
expect(globalThis.fetch).toHaveBeenCalledWith(
|
||||||
expect.stringContaining('/transactions/123/images?compression=high'),
|
expect.stringContaining('/transactions/123/images?compression=high'),
|
||||||
expect.objectContaining({
|
expect.objectContaining({
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
@@ -288,7 +288,7 @@ describe('imageService', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('should throw error when upload fails', async () => {
|
it('should throw error when upload fails', async () => {
|
||||||
(global.fetch as any).mockResolvedValueOnce({
|
(globalThis.fetch as any).mockResolvedValueOnce({
|
||||||
ok: false,
|
ok: false,
|
||||||
status: 400,
|
status: 400,
|
||||||
json: async () => ({ error: 'Upload failed' }),
|
json: async () => ({ error: 'Upload failed' }),
|
||||||
@@ -324,14 +324,14 @@ describe('imageService', () => {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
(global.fetch as any).mockResolvedValueOnce({
|
(globalThis.fetch as any).mockResolvedValueOnce({
|
||||||
ok: true,
|
ok: true,
|
||||||
json: async () => ({ data: mockImages }),
|
json: async () => ({ data: mockImages }),
|
||||||
});
|
});
|
||||||
|
|
||||||
const result = await getTransactionImages(123);
|
const result = await getTransactionImages(123);
|
||||||
|
|
||||||
expect(global.fetch).toHaveBeenCalledWith(
|
expect(globalThis.fetch).toHaveBeenCalledWith(
|
||||||
expect.stringContaining('/transactions/123/images'),
|
expect.stringContaining('/transactions/123/images'),
|
||||||
expect.objectContaining({
|
expect.objectContaining({
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
@@ -345,7 +345,7 @@ describe('imageService', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('should throw error when fetch fails', async () => {
|
it('should throw error when fetch fails', async () => {
|
||||||
(global.fetch as any).mockResolvedValueOnce({
|
(globalThis.fetch as any).mockResolvedValueOnce({
|
||||||
ok: false,
|
ok: false,
|
||||||
status: 404,
|
status: 404,
|
||||||
json: async () => ({ error: 'Transaction not found' }),
|
json: async () => ({ error: 'Transaction not found' }),
|
||||||
@@ -357,14 +357,14 @@ describe('imageService', () => {
|
|||||||
|
|
||||||
describe('deleteImage', () => {
|
describe('deleteImage', () => {
|
||||||
it('should delete image successfully', async () => {
|
it('should delete image successfully', async () => {
|
||||||
(global.fetch as any).mockResolvedValueOnce({
|
(globalThis.fetch as any).mockResolvedValueOnce({
|
||||||
ok: true,
|
ok: true,
|
||||||
json: async () => ({}),
|
json: async () => ({}),
|
||||||
});
|
});
|
||||||
|
|
||||||
await deleteImage(123, 456);
|
await deleteImage(123, 456);
|
||||||
|
|
||||||
expect(global.fetch).toHaveBeenCalledWith(
|
expect(globalThis.fetch).toHaveBeenCalledWith(
|
||||||
expect.stringContaining('/transactions/123/images/456'),
|
expect.stringContaining('/transactions/123/images/456'),
|
||||||
expect.objectContaining({
|
expect.objectContaining({
|
||||||
method: 'DELETE',
|
method: 'DELETE',
|
||||||
@@ -376,7 +376,7 @@ describe('imageService', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
it('should throw error when delete fails', async () => {
|
it('should throw error when delete fails', async () => {
|
||||||
(global.fetch as any).mockResolvedValueOnce({
|
(globalThis.fetch as any).mockResolvedValueOnce({
|
||||||
ok: false,
|
ok: false,
|
||||||
status: 404,
|
status: 404,
|
||||||
json: async () => ({ error: 'Image not found' }),
|
json: async () => ({ error: 'Image not found' }),
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
|
|
||||||
import type { TransactionImage, UserSettings } from '../types';
|
import type { TransactionImage, UserSettings } from '../types';
|
||||||
|
|
||||||
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1';
|
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1';
|
||||||
|
|
||||||
// Token storage key
|
// Token storage key
|
||||||
const ACCESS_TOKEN_KEY = 'access_token';
|
const ACCESS_TOKEN_KEY = 'access_token';
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
import api from './api';
|
import api from './api';
|
||||||
import type { CurrencyCode } from '../types';
|
import type { CurrencyCode } from '../types';
|
||||||
|
|
||||||
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:8080/api/v1';
|
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:2612/api/v1';
|
||||||
|
|
||||||
// Report API Response Types
|
// Report API Response Types
|
||||||
export interface CurrencySummary {
|
export interface CurrencySummary {
|
||||||
|
|||||||
Reference in New Issue
Block a user