diff --git a/packages/frontend/.storybook/fakes.ts b/packages/frontend/.storybook/fakes.ts
index 3f305275ef..c900c77d54 100644
--- a/packages/frontend/.storybook/fakes.ts
+++ b/packages/frontend/.storybook/fakes.ts
@@ -4,7 +4,7 @@
  */
 
 import type { entities } from 'misskey-js'
-import { imageDataUrl, text } from "./fake-utils.js";
+import { date, imageDataUrl, text } from "./fake-utils.js";
 
 export function abuseUserReport() {
 	return {
@@ -235,6 +235,8 @@ export function role(params: {
 }, seed?: string): entities.Role {
 	const prefix = params.displayOrder ? params.displayOrder.toString().padStart(3, '0') + '-' : '';
 	const genId = text(36, seed);
+	const createdAt = params.createdAt ?? date({}, seed).toISOString();
+	const updatedAt = params.updatedAt ?? date({}, seed).toISOString();
 
 	return {
 		id: params.id ?? genId,
@@ -245,8 +247,8 @@ export function role(params: {
 		isModerator: params.isModerator ?? false,
 		isAdministrator: params.isAdministrator ?? false,
 		displayOrder: params.displayOrder ?? 0,
-		createdAt: params.createdAt ?? new Date().toISOString(),
-		updatedAt: params.updatedAt ?? new Date().toISOString(),
+		createdAt: createdAt,
+		updatedAt: updatedAt,
 		target: params.target ?? 'manual',
 		isPublic: params.isPublic ?? true,
 		isExplorable: params.isExplorable ?? true,
@@ -278,9 +280,10 @@ export function emoji(params?: {
 	roleIdsThatCanBeUsedThisEmojiAsReaction?: {id:string, name:string}[],
 	updatedAt?: string,
 }, seed?: string): entities.EmojiDetailedAdmin {
-	const _seed = seed ?? params?.id ?? "DEFAULT_SEED";
-	const id = params?.id ?? new Date().getTime().toString() + text(5, _seed);
+	const _seed = seed ?? (params?.id ?? "DEFAULT_SEED");
+	const id = params?.id ?? text(32, _seed);
 	const name = params?.name ?? text(8, _seed);
+	const updatedAt = params?.updatedAt ?? date({}, _seed).toISOString();
 
 	const image = imageDataUrl({}, _seed)
 
@@ -298,6 +301,6 @@ export function emoji(params?: {
 		isSensitive: params?.isSensitive ?? false,
 		localOnly: params?.localOnly ?? false,
 		roleIdsThatCanBeUsedThisEmojiAsReaction: params?.roleIdsThatCanBeUsedThisEmojiAsReaction ?? [],
-		updatedAt: params?.updatedAt ?? new Date().toISOString(),
+		updatedAt: updatedAt,
 	}
 }
diff --git a/packages/frontend/src/components/MkRoleSelectDialog.stories.impl.ts b/packages/frontend/src/components/MkRoleSelectDialog.stories.impl.ts
index f193233285..411d62edf9 100644
--- a/packages/frontend/src/components/MkRoleSelectDialog.stories.impl.ts
+++ b/packages/frontend/src/components/MkRoleSelectDialog.stories.impl.ts
@@ -11,10 +11,10 @@ import { commonHandlers } from '../../.storybook/mocks.js';
 import MkRoleSelectDialog from '@/components/MkRoleSelectDialog.vue';
 
 const roles = [
-	role({ displayOrder: 1 }), role({ displayOrder: 1 }), role({ displayOrder: 1 }), role({ displayOrder: 1 }),
-	role({ displayOrder: 2 }), role({ displayOrder: 2 }), role({ displayOrder: 3 }), role({ displayOrder: 3 }),
-	role({ displayOrder: 4 }), role({ displayOrder: 5 }), role({ displayOrder: 6 }), role({ displayOrder: 7 }),
-	role({ displayOrder: 999, name: 'privateRole', isPublic: false }),
+	role({ displayOrder: 1 }, '1'), role({ displayOrder: 1 }, '1'), role({ displayOrder: 1 }, '1'), role({ displayOrder: 1 }, '1'),
+	role({ displayOrder: 2 }, '2'), role({ displayOrder: 2 }, '2'), role({ displayOrder: 3 }, '3'), role({ displayOrder: 3 }, '3'),
+	role({ displayOrder: 4 }, '4'), role({ displayOrder: 5 }, '5'), role({ displayOrder: 6 }, '6'), role({ displayOrder: 7 }, '7'),
+	role({ displayOrder: 999, name: 'privateRole', isPublic: false }, '999'),
 ];
 
 export const Default = {