@firecms/media_manager 3.1.0 → 3.2.0-canary.4c3b8f2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.es.js +682 -221
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +682 -221
- package/dist/index.umd.js.map +1 -1
- package/dist/locales/de.d.ts +45 -0
- package/dist/locales/en.d.ts +45 -0
- package/dist/locales/es.d.ts +45 -0
- package/dist/locales/fr.d.ts +45 -0
- package/dist/locales/hi.d.ts +45 -0
- package/dist/locales/it.d.ts +45 -0
- package/dist/locales/pt.d.ts +45 -0
- package/package.json +5 -5
- package/src/components/MediaAssetDetails.tsx +25 -25
- package/src/components/MediaLibraryCard.tsx +5 -2
- package/src/components/MediaLibraryView.tsx +13 -11
- package/src/components/MediaUploadDialog.tsx +13 -11
- package/src/locales/de.ts +45 -0
- package/src/locales/en.ts +45 -0
- package/src/locales/es.ts +45 -0
- package/src/locales/fr.ts +45 -0
- package/src/locales/hi.ts +45 -0
- package/src/locales/it.ts +45 -0
- package/src/locales/pt.ts +45 -0
- package/src/useMediaManagerPlugin.tsx +22 -5
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsDe: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsEn: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsEs: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsFr: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsHi: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsIt: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export declare const mediaManagerTranslationsPt: {
|
|
2
|
+
media_library: string;
|
|
3
|
+
media_library_description: string;
|
|
4
|
+
media_search_assets: string;
|
|
5
|
+
media_grid_view: string;
|
|
6
|
+
media_list_view: string;
|
|
7
|
+
media_refresh: string;
|
|
8
|
+
media_upload: string;
|
|
9
|
+
media_error_loading: string;
|
|
10
|
+
media_try_again: string;
|
|
11
|
+
media_no_assets: string;
|
|
12
|
+
media_upload_first_file: string;
|
|
13
|
+
media_asset_updated: string;
|
|
14
|
+
media_error_updating: string;
|
|
15
|
+
media_asset_deleted: string;
|
|
16
|
+
media_error_deleting: string;
|
|
17
|
+
media_error_getting_url: string;
|
|
18
|
+
media_preview_not_available: string;
|
|
19
|
+
media_dimensions: string;
|
|
20
|
+
media_size: string;
|
|
21
|
+
media_type: string;
|
|
22
|
+
media_created: string;
|
|
23
|
+
media_file_name: string;
|
|
24
|
+
media_title: string;
|
|
25
|
+
media_alt_text: string;
|
|
26
|
+
media_recommended_seo: string;
|
|
27
|
+
media_caption: string;
|
|
28
|
+
media_tags: string;
|
|
29
|
+
media_add_tag: string;
|
|
30
|
+
media_add: string;
|
|
31
|
+
media_save_changes: string;
|
|
32
|
+
media_delete_asset: string;
|
|
33
|
+
media_delete_confirmation: string;
|
|
34
|
+
media_file_too_large: string;
|
|
35
|
+
media_file_type_not_allowed: string;
|
|
36
|
+
media_upload_failed: string;
|
|
37
|
+
media_upload_files: string;
|
|
38
|
+
media_drop_files: string;
|
|
39
|
+
media_max_file_size: string;
|
|
40
|
+
media_selected_files_count: string;
|
|
41
|
+
media_remove: string;
|
|
42
|
+
media_uploading: string;
|
|
43
|
+
media_manage_description: string;
|
|
44
|
+
media_assets_count: string;
|
|
45
|
+
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@firecms/media_manager",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "3.
|
|
4
|
+
"version": "3.2.0-canary.4c3b8f2",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -27,9 +27,9 @@
|
|
|
27
27
|
"types": "./dist/index.d.ts",
|
|
28
28
|
"source": "src/index.ts",
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@firecms/core": "
|
|
31
|
-
"@firecms/formex": "
|
|
32
|
-
"@firecms/ui": "
|
|
30
|
+
"@firecms/core": "3.2.0-canary.4c3b8f2",
|
|
31
|
+
"@firecms/formex": "3.2.0-canary.4c3b8f2",
|
|
32
|
+
"@firecms/ui": "3.2.0-canary.4c3b8f2"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": ">=18.3.1 || >=19.0.0",
|
|
@@ -54,5 +54,5 @@
|
|
|
54
54
|
"dist",
|
|
55
55
|
"src"
|
|
56
56
|
],
|
|
57
|
-
"gitHead": "
|
|
57
|
+
"gitHead": "b86dabf4d939a8db1d84f4581c8cc3cfcccf0891"
|
|
58
58
|
}
|
|
@@ -15,7 +15,7 @@ import {
|
|
|
15
15
|
DialogActions,
|
|
16
16
|
DialogContent
|
|
17
17
|
} from "@firecms/ui";
|
|
18
|
-
import { useSnackbarController, useStorageSource } from "@firecms/core";
|
|
18
|
+
import { useSnackbarController, useStorageSource, useTranslation } from "@firecms/core";
|
|
19
19
|
import { MediaAsset } from "../types";
|
|
20
20
|
|
|
21
21
|
export interface MediaAssetDetailsProps {
|
|
@@ -40,6 +40,7 @@ export function MediaAssetDetails({
|
|
|
40
40
|
const [deleting, setDeleting] = useState(false);
|
|
41
41
|
const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
|
|
42
42
|
const [tagInput, setTagInput] = useState("");
|
|
43
|
+
const { t } = useTranslation();
|
|
43
44
|
|
|
44
45
|
const { values, setFieldValue, dirty } = useCreateFormex<Partial<MediaAsset>>({
|
|
45
46
|
initialValues: {
|
|
@@ -56,12 +57,12 @@ export function MediaAssetDetails({
|
|
|
56
57
|
await onUpdate(asset.id, values);
|
|
57
58
|
snackbarController.open({
|
|
58
59
|
type: "success",
|
|
59
|
-
message: "
|
|
60
|
+
message: t("media_asset_updated")
|
|
60
61
|
});
|
|
61
62
|
} catch (error) {
|
|
62
63
|
snackbarController.open({
|
|
63
64
|
type: "error",
|
|
64
|
-
message:
|
|
65
|
+
message: t("media_error_updating", { message: error instanceof Error ? error.message : String(error) })
|
|
65
66
|
});
|
|
66
67
|
} finally {
|
|
67
68
|
setSaving(false);
|
|
@@ -74,13 +75,13 @@ export function MediaAssetDetails({
|
|
|
74
75
|
await onDelete(asset.id);
|
|
75
76
|
snackbarController.open({
|
|
76
77
|
type: "success",
|
|
77
|
-
message: "
|
|
78
|
+
message: t("media_asset_deleted")
|
|
78
79
|
});
|
|
79
80
|
onClose();
|
|
80
81
|
} catch (error) {
|
|
81
82
|
snackbarController.open({
|
|
82
83
|
type: "error",
|
|
83
|
-
message:
|
|
84
|
+
message: t("media_error_deleting", { message: error instanceof Error ? error.message : String(error) })
|
|
84
85
|
});
|
|
85
86
|
} finally {
|
|
86
87
|
setDeleting(false);
|
|
@@ -97,7 +98,7 @@ export function MediaAssetDetails({
|
|
|
97
98
|
} catch (error) {
|
|
98
99
|
snackbarController.open({
|
|
99
100
|
type: "error",
|
|
100
|
-
message: "
|
|
101
|
+
message: t("media_error_getting_url")
|
|
101
102
|
});
|
|
102
103
|
}
|
|
103
104
|
}, [asset, storageSource, snackbarController]);
|
|
@@ -178,7 +179,7 @@ export function MediaAssetDetails({
|
|
|
178
179
|
/>
|
|
179
180
|
) : (
|
|
180
181
|
<div className="text-surface-accent-400">
|
|
181
|
-
|
|
182
|
+
{t("media_preview_not_available")}
|
|
182
183
|
</div>
|
|
183
184
|
)}
|
|
184
185
|
</div>
|
|
@@ -190,7 +191,7 @@ export function MediaAssetDetails({
|
|
|
190
191
|
{asset.dimensions && (
|
|
191
192
|
<div>
|
|
192
193
|
<Typography variant="caption" className="text-surface-accent-500">
|
|
193
|
-
|
|
194
|
+
{t("media_dimensions")}
|
|
194
195
|
</Typography>
|
|
195
196
|
<Typography variant="body2">
|
|
196
197
|
{asset.dimensions.width} × {asset.dimensions.height} px
|
|
@@ -199,7 +200,7 @@ export function MediaAssetDetails({
|
|
|
199
200
|
)}
|
|
200
201
|
<div>
|
|
201
202
|
<Typography variant="caption" className="text-surface-accent-500">
|
|
202
|
-
|
|
203
|
+
{t("media_size")}
|
|
203
204
|
</Typography>
|
|
204
205
|
<Typography variant="body2">
|
|
205
206
|
{formatSize(asset.size)}
|
|
@@ -207,7 +208,7 @@ export function MediaAssetDetails({
|
|
|
207
208
|
</div>
|
|
208
209
|
<div>
|
|
209
210
|
<Typography variant="caption" className="text-surface-accent-500">
|
|
210
|
-
|
|
211
|
+
{t("media_type")}
|
|
211
212
|
</Typography>
|
|
212
213
|
<Typography variant="body2">
|
|
213
214
|
{asset.mimeType}
|
|
@@ -215,7 +216,7 @@ export function MediaAssetDetails({
|
|
|
215
216
|
</div>
|
|
216
217
|
<div>
|
|
217
218
|
<Typography variant="caption" className="text-surface-accent-500">
|
|
218
|
-
|
|
219
|
+
{t("media_created")}
|
|
219
220
|
</Typography>
|
|
220
221
|
<Typography variant="body2">
|
|
221
222
|
{formatDate(asset.createdAt)}
|
|
@@ -227,14 +228,14 @@ export function MediaAssetDetails({
|
|
|
227
228
|
|
|
228
229
|
{/* Editable Fields */}
|
|
229
230
|
<TextField
|
|
230
|
-
label="
|
|
231
|
+
label={t("media_file_name")}
|
|
231
232
|
value={asset.fileName}
|
|
232
233
|
disabled
|
|
233
234
|
size="small"
|
|
234
235
|
/>
|
|
235
236
|
|
|
236
237
|
<TextField
|
|
237
|
-
label="
|
|
238
|
+
label={t("media_title")}
|
|
238
239
|
value={values.title ?? ""}
|
|
239
240
|
onChange={(e) => setFieldValue("title", e.target.value)}
|
|
240
241
|
size="small"
|
|
@@ -242,18 +243,18 @@ export function MediaAssetDetails({
|
|
|
242
243
|
|
|
243
244
|
<div>
|
|
244
245
|
<TextField
|
|
245
|
-
label="
|
|
246
|
+
label={t("media_alt_text")}
|
|
246
247
|
value={values.altText ?? ""}
|
|
247
248
|
onChange={(e) => setFieldValue("altText", e.target.value)}
|
|
248
249
|
size="small"
|
|
249
250
|
/>
|
|
250
251
|
<Typography variant="caption" className="text-surface-accent-500 mt-1">
|
|
251
|
-
|
|
252
|
+
{t("media_recommended_seo")}
|
|
252
253
|
</Typography>
|
|
253
254
|
</div>
|
|
254
255
|
|
|
255
256
|
<TextField
|
|
256
|
-
label="
|
|
257
|
+
label={t("media_caption")}
|
|
257
258
|
value={values.caption ?? ""}
|
|
258
259
|
onChange={(e) => setFieldValue("caption", e.target.value)}
|
|
259
260
|
size="small"
|
|
@@ -263,7 +264,7 @@ export function MediaAssetDetails({
|
|
|
263
264
|
{/* Tags */}
|
|
264
265
|
<div>
|
|
265
266
|
<Typography variant="caption" className="text-surface-accent-500 mb-1 block">
|
|
266
|
-
|
|
267
|
+
{t("media_tags")}
|
|
267
268
|
</Typography>
|
|
268
269
|
<div className="flex flex-wrap gap-1 mb-2">
|
|
269
270
|
{values.tags?.map((tag: string) => (
|
|
@@ -279,7 +280,7 @@ export function MediaAssetDetails({
|
|
|
279
280
|
</div>
|
|
280
281
|
<div className="flex gap-2">
|
|
281
282
|
<TextField
|
|
282
|
-
placeholder="
|
|
283
|
+
placeholder={t("media_add_tag")}
|
|
283
284
|
value={tagInput}
|
|
284
285
|
onChange={(e) => setTagInput(e.target.value)}
|
|
285
286
|
size="small"
|
|
@@ -297,7 +298,7 @@ export function MediaAssetDetails({
|
|
|
297
298
|
onClick={handleAddTag}
|
|
298
299
|
disabled={!tagInput.trim()}
|
|
299
300
|
>
|
|
300
|
-
|
|
301
|
+
{t("media_add")}
|
|
301
302
|
</Button>
|
|
302
303
|
</div>
|
|
303
304
|
</div>
|
|
@@ -311,7 +312,7 @@ export function MediaAssetDetails({
|
|
|
311
312
|
disabled={!dirty || saving}
|
|
312
313
|
className="w-full"
|
|
313
314
|
>
|
|
314
|
-
{saving ? <CircularProgress size="small" /> : "
|
|
315
|
+
{saving ? <CircularProgress size="small" /> : t("media_save_changes")}
|
|
315
316
|
</Button>
|
|
316
317
|
</div>
|
|
317
318
|
</div>
|
|
@@ -323,11 +324,10 @@ export function MediaAssetDetails({
|
|
|
323
324
|
>
|
|
324
325
|
<DialogContent>
|
|
325
326
|
<Typography variant="subtitle1" className="font-medium mb-2">
|
|
326
|
-
|
|
327
|
+
{t("media_delete_asset")}
|
|
327
328
|
</Typography>
|
|
328
329
|
<Typography className="text-surface-accent-600 dark:text-surface-accent-400">
|
|
329
|
-
|
|
330
|
-
This action cannot be undone.
|
|
330
|
+
{t("media_delete_confirmation", { name: asset.title || asset.fileName })}
|
|
331
331
|
</Typography>
|
|
332
332
|
</DialogContent>
|
|
333
333
|
<DialogActions>
|
|
@@ -336,7 +336,7 @@ export function MediaAssetDetails({
|
|
|
336
336
|
onClick={() => setDeleteDialogOpen(false)}
|
|
337
337
|
disabled={deleting}
|
|
338
338
|
>
|
|
339
|
-
|
|
339
|
+
{t("cancel")}
|
|
340
340
|
</Button>
|
|
341
341
|
<Button
|
|
342
342
|
variant="filled"
|
|
@@ -344,7 +344,7 @@ export function MediaAssetDetails({
|
|
|
344
344
|
onClick={handleDelete}
|
|
345
345
|
disabled={deleting}
|
|
346
346
|
>
|
|
347
|
-
{deleting ? <CircularProgress size="small" /> : "
|
|
347
|
+
{deleting ? <CircularProgress size="small" /> : t("delete")}
|
|
348
348
|
</Button>
|
|
349
349
|
</DialogActions>
|
|
350
350
|
</Dialog>
|
|
@@ -6,6 +6,7 @@ import {
|
|
|
6
6
|
cls,
|
|
7
7
|
ImageIcon
|
|
8
8
|
} from "@firecms/ui";
|
|
9
|
+
import { useTranslation } from "@firecms/core";
|
|
9
10
|
|
|
10
11
|
export interface MediaLibraryCardProps {
|
|
11
12
|
group?: string;
|
|
@@ -16,6 +17,8 @@ export interface MediaLibraryCardProps {
|
|
|
16
17
|
* Card component displayed on the home page that links to the Media Library.
|
|
17
18
|
*/
|
|
18
19
|
export function MediaLibraryCard({ group }: MediaLibraryCardProps) {
|
|
20
|
+
const { t } = useTranslation();
|
|
21
|
+
|
|
19
22
|
// Only render in the "Media" group
|
|
20
23
|
if (group !== "Media") return null;
|
|
21
24
|
|
|
@@ -39,13 +42,13 @@ export function MediaLibraryCard({ group }: MediaLibraryCardProps) {
|
|
|
39
42
|
</div>
|
|
40
43
|
<div className="flex-1">
|
|
41
44
|
<Typography variant="subtitle2" className="font-medium">
|
|
42
|
-
|
|
45
|
+
{t("media_library")}
|
|
43
46
|
</Typography>
|
|
44
47
|
<Typography
|
|
45
48
|
variant="caption"
|
|
46
49
|
className="text-surface-accent-600 dark:text-surface-accent-400"
|
|
47
50
|
>
|
|
48
|
-
|
|
51
|
+
{t("media_library_description")}
|
|
49
52
|
</Typography>
|
|
50
53
|
</div>
|
|
51
54
|
</div>
|