Skip to content

Commit 91bc0fe

Browse files
authored
refactor(web): use scene alias on publish scene (#1738)
1 parent c326573 commit 91bc0fe

File tree

8 files changed

+37
-24
lines changed

8 files changed

+37
-24
lines changed

web/src/app/features/Editor/Publish/PublishToolsPanel/hooks.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ export default ({
4747
storyId: undefined,
4848
type: "scene" as const,
4949
buttonTitle: t("Scene"),
50-
alias: project.alias,
50+
alias: project.scene?.alias,
5151
publishmentStatus: project.publishmentStatus,
5252
isPublished: isPublished(project.publishmentStatus)
5353
},

web/src/app/features/ProjectSettings/innerPages/PublicSettings/AliasSettings/index.tsx

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -48,24 +48,30 @@ const AliasSetting: FC<AliasSettingProps> = ({
4848
const handleOpen = useCallback(() => setOpen(true), []);
4949
const handleClose = useCallback(() => setOpen(false), []);
5050

51+
const settingItemAlias = useMemo(() => {
52+
return settingsItem?.type === "project" && "scene" in settingsItem
53+
? settingsItem.scene?.alias
54+
: settingsItem?.alias;
55+
}, [settingsItem]);
56+
5157
const publicUrl = useMemo(() => {
5258
const publishedConfig = config()?.published;
5359
if (!publishedConfig || !settingsItem) return "";
5460
const [prefix, suffix] = extractPrefixSuffix(publishedConfig);
5561

56-
const sanitizedAlias = settingsItem.alias?.replace(/^\/+|\/+$/g, "") ?? "";
62+
const sanitizedAlias = settingItemAlias?.replace(/^\/+|\/+$/g, "") ?? "";
5763
return `${prefix}${sanitizedAlias}${suffix}`;
58-
}, [settingsItem]);
64+
}, [settingItemAlias, settingsItem]);
5965

6066
const handleIconClick = useCallback(() => {
61-
if (!settingsItem?.alias) return;
67+
if (!settingItemAlias) return;
6268

6369
navigator.clipboard.writeText(publicUrl);
6470
setNotification({
6571
type: "success",
6672
text: t("Resource URL copied to clipboard")
6773
});
68-
}, [publicUrl, setNotification, settingsItem?.alias, t]);
74+
}, [publicUrl, setNotification, settingItemAlias, t]);
6975

7076
const handleSubmitAlias = useCallback(
7177
(alias?: string) => {
@@ -95,9 +101,9 @@ const AliasSetting: FC<AliasSettingProps> = ({
95101
const isDisabled = useMemo(
96102
() =>
97103
(!isStory && !sceneId) ||
98-
settingsItem?.alias === `c-${sceneId}` ||
99-
settingsItem?.alias === `s-${settingsItem?.id}`,
100-
[settingsItem?.alias, settingsItem?.id, sceneId, isStory]
104+
settingItemAlias === `c-${sceneId}` ||
105+
settingItemAlias === `s-${settingsItem?.id}`,
106+
[isStory, sceneId, settingItemAlias, settingsItem?.id]
101107
);
102108

103109
return (
@@ -133,7 +139,7 @@ const AliasSetting: FC<AliasSettingProps> = ({
133139

134140
{open && (
135141
<EditPanel
136-
alias={settingsItem?.alias}
142+
alias={settingItemAlias}
137143
isStory={isStory}
138144
itemId={settingsItem?.id}
139145
publicUrl={publicUrl}

web/src/app/features/ProjectSettings/innerPages/PublicSettings/PublicSettingsDetail.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import {
1717
} from "@reearth/services/state";
1818
import { useTheme } from "@reearth/services/styled";
1919
import { styled } from "@reearth/services/theme";
20-
import { useCallback, useEffect, useMemo, useState } from "react";
20+
import { FC, useCallback, useEffect, useMemo, useState } from "react";
2121

2222
import { SettingsFields, SettingsWrapper, TitleWrapper } from "../common";
2323

@@ -55,7 +55,7 @@ type ExtensionComponentProps = (
5555
typename: string;
5656
};
5757

58-
const PublicSettingsDetail: React.FC<Props> = ({
58+
const PublicSettingsDetail: FC<Props> = ({
5959
settingsItem,
6060
sceneId,
6161
isStory,
@@ -273,7 +273,7 @@ const PublicSettingsDetail: React.FC<Props> = ({
273273
{...(settingsItem.type === "project"
274274
? {
275275
projectId: settingsItem.id,
276-
projectAlias: settingsItem.alias
276+
projectAlias: "scene" in settingsItem ? settingsItem.scene?.alias : undefined
277277
}
278278
: {
279279
storyId: settingsItem.id,

web/src/app/features/ProjectSettings/innerPages/PublicSettings/index.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,10 @@ export type SettingsProject = {
4141
basicAuthUsername: string;
4242
basicAuthPassword: string;
4343
alias: string;
44+
scene?: {
45+
id: string;
46+
alias: string;
47+
} | null;
4448
publishmentStatus: string;
4549
isArchived: boolean;
4650
enableGa: boolean;

web/src/services/gql/__gen__/gql.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,8 @@ const documents = {
5050
"\n mutation UpgradePlugin($sceneId: ID!, $pluginId: ID!, $toPluginId: ID!) {\n upgradePlugin(input: { sceneId: $sceneId, pluginId: $pluginId, toPluginId: $toPluginId }) {\n scenePlugin {\n pluginId\n propertyId\n }\n }\n }\n": types.UpgradePluginDocument,
5151
"\n mutation UploadPlugin($sceneId: ID!, $file: Upload, $url: URL) {\n uploadPlugin(input: { sceneId: $sceneId, file: $file, url: $url }) {\n plugin {\n id\n name\n version\n description\n author\n }\n scenePlugin {\n pluginId\n propertyId\n }\n }\n }\n": types.UploadPluginDocument,
5252
"\n mutation UninstallPlugin($sceneId: ID!, $pluginId: ID!) {\n uninstallPlugin(input: { sceneId: $sceneId, pluginId: $pluginId }) {\n pluginId\n }\n }\n": types.UninstallPluginDocument,
53-
"\n query GetProject($projectId: ID!) {\n node(id: $projectId, type: PROJECT) {\n id\n ... on Project {\n ...ProjectFragment\n scene {\n id\n }\n }\n }\n }\n": types.GetProjectDocument,
54-
"\n query GetProjects($workspaceId: ID!, $pagination: Pagination, $keyword: String, $sort: ProjectSort) {\n projects(workspaceId: $workspaceId, pagination: $pagination, keyword: $keyword, sort: $sort) {\n edges {\n node {\n id\n ...ProjectFragment\n scene {\n id\n }\n }\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n totalCount\n }\n }\n": types.GetProjectsDocument,
53+
"\n query GetProject($projectId: ID!) {\n node(id: $projectId, type: PROJECT) {\n id\n ... on Project {\n ...ProjectFragment\n scene {\n id\n alias\n }\n }\n }\n }\n": types.GetProjectDocument,
54+
"\n query GetProjects($workspaceId: ID!, $pagination: Pagination, $keyword: String, $sort: ProjectSort) {\n projects(workspaceId: $workspaceId, pagination: $pagination, keyword: $keyword, sort: $sort) {\n edges {\n node {\n id\n ...ProjectFragment\n scene {\n id\n alias\n }\n }\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n totalCount\n }\n }\n": types.GetProjectsDocument,
5555
"\n query CheckProjectAlias($alias: String!, $workspaceId: ID!, $projectId: ID) {\n checkProjectAlias(alias: $alias, workspaceId:$workspaceId, projectId: $projectId) {\n alias\n available\n }\n }\n": types.CheckProjectAliasDocument,
5656
"\n mutation CreateProject(\n $workspaceId: ID!\n $visualizer: Visualizer!\n $name: String!\n $description: String!\n $coreSupport: Boolean\n $visibility: String\n $projectAlias: String\n $readme: String\n $license: String\n $topics: String\n ) {\n createProject(\n input: {\n workspaceId: $workspaceId\n visualizer: $visualizer\n name: $name\n description: $description\n coreSupport: $coreSupport\n visibility: $visibility\n\t projectAlias: $projectAlias\n readme: $readme\n license: $license\n topics: $topics\n }\n ) {\n project {\n id\n name\n description\n coreSupport\n }\n }\n }\n": types.CreateProjectDocument,
5757
"\n mutation UpdateProject(\n $projectId: ID!\n $name: String\n $description: String\n $imageUrl: URL\n $publicTitle: String\n $publicDescription: String\n $publicImage: String\n $deleteImageUrl: Boolean\n $deletePublicImage: Boolean\n $enableGa: Boolean\n $trackingId: String\n $starred:Boolean\n $deleted: Boolean\n $projectAlias: String\n $visibility: String\n ) {\n updateProject(\n input: {\n projectId: $projectId\n name: $name\n description: $description\n imageUrl: $imageUrl\n publicTitle: $publicTitle\n publicDescription: $publicDescription\n publicImage: $publicImage\n deleteImageUrl: $deleteImageUrl\n deletePublicImage: $deletePublicImage\n enableGa: $enableGa\n trackingId: $trackingId\n starred: $starred\n deleted: $deleted\n projectAlias: $projectAlias\n visibility: $visibility\n }\n ) {\n project {\n id\n ...ProjectFragment\n }\n }\n }\n\n": types.UpdateProjectDocument,
@@ -67,7 +67,7 @@ const documents = {
6767
"\n mutation AddPropertyItem(\n $propertyId: ID!\n $schemaGroupId: ID!\n $lang: Lang\n ) {\n addPropertyItem(\n input: {\n propertyId: $propertyId\n schemaGroupId: $schemaGroupId\n }\n ) {\n property {\n id\n ...PropertyFragment\n }\n }\n }\n": types.AddPropertyItemDocument,
6868
"\n mutation RemovePropertyItem($propertyId: ID!, $schemaGroupId: ID!, $itemId: ID!, $lang: Lang) {\n removePropertyItem(\n input: { propertyId: $propertyId, schemaGroupId: $schemaGroupId, itemId: $itemId }\n ) {\n property {\n id\n ...PropertyFragment\n }\n }\n }\n": types.RemovePropertyItemDocument,
6969
"\n mutation MovePropertyItem(\n $propertyId: ID!\n $schemaGroupId: ID!\n $itemId: ID!\n $index: Int!\n $lang: Lang\n ) {\n movePropertyItem(\n input: {\n propertyId: $propertyId\n schemaGroupId: $schemaGroupId\n itemId: $itemId\n index: $index\n }\n ) {\n property {\n id\n ...PropertyFragment\n }\n }\n }\n": types.MovePropertyItemDocument,
70-
"\n query GetScene($sceneId: ID!, $lang: Lang) {\n node(id: $sceneId, type: SCENE) {\n id\n ... on Scene {\n workspaceId\n projectId\n property {\n id\n ...PropertyFragment\n }\n plugins {\n property {\n id\n ...PropertyFragment\n }\n plugin {\n ...PluginFragment\n }\n }\n widgets {\n id\n enabled\n extended\n pluginId\n extensionId\n property {\n id\n ...PropertyFragment\n }\n }\n widgetAlignSystem {\n ...WidgetAlignSystemFragment\n }\n stories {\n ...StoryFragment\n }\n newLayers {\n ...NLSLayerCommon\n }\n styles {\n ...NLSLayerStyle\n }\n }\n }\n }\n": types.GetSceneDocument,
70+
"\n query GetScene($sceneId: ID!, $lang: Lang) {\n node(id: $sceneId, type: SCENE) {\n id\n ... on Scene {\n workspaceId\n projectId\n alias\n property {\n id\n ...PropertyFragment\n }\n plugins {\n property {\n id\n ...PropertyFragment\n }\n plugin {\n ...PluginFragment\n }\n }\n widgets {\n id\n enabled\n extended\n pluginId\n extensionId\n property {\n id\n ...PropertyFragment\n }\n }\n widgetAlignSystem {\n ...WidgetAlignSystemFragment\n }\n stories {\n ...StoryFragment\n }\n newLayers {\n ...NLSLayerCommon\n }\n styles {\n ...NLSLayerStyle\n }\n }\n }\n }\n": types.GetSceneDocument,
7171
"\n mutation CreateScene($projectId: ID!) {\n createScene(input: { projectId: $projectId }) {\n scene {\n id\n }\n }\n }\n": types.CreateSceneDocument,
7272
"\n query CheckSceneAlias($alias: String!, $projectId: ID){\n checkSceneAlias(alias: $alias, projectId: $projectId) {\n alias\n available\n }\n }\n": types.CheckSceneAliasDocument,
7373
"\n mutation CreateStory($input: CreateStoryInput!) {\n createStory(input: $input) {\n story {\n id\n }\n }\n }\n": types.CreateStoryDocument,
@@ -264,11 +264,11 @@ export function gql(source: "\n mutation UninstallPlugin($sceneId: ID!, $plugin
264264
/**
265265
* The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
266266
*/
267-
export function gql(source: "\n query GetProject($projectId: ID!) {\n node(id: $projectId, type: PROJECT) {\n id\n ... on Project {\n ...ProjectFragment\n scene {\n id\n }\n }\n }\n }\n"): (typeof documents)["\n query GetProject($projectId: ID!) {\n node(id: $projectId, type: PROJECT) {\n id\n ... on Project {\n ...ProjectFragment\n scene {\n id\n }\n }\n }\n }\n"];
267+
export function gql(source: "\n query GetProject($projectId: ID!) {\n node(id: $projectId, type: PROJECT) {\n id\n ... on Project {\n ...ProjectFragment\n scene {\n id\n alias\n }\n }\n }\n }\n"): (typeof documents)["\n query GetProject($projectId: ID!) {\n node(id: $projectId, type: PROJECT) {\n id\n ... on Project {\n ...ProjectFragment\n scene {\n id\n alias\n }\n }\n }\n }\n"];
268268
/**
269269
* The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
270270
*/
271-
export function gql(source: "\n query GetProjects($workspaceId: ID!, $pagination: Pagination, $keyword: String, $sort: ProjectSort) {\n projects(workspaceId: $workspaceId, pagination: $pagination, keyword: $keyword, sort: $sort) {\n edges {\n node {\n id\n ...ProjectFragment\n scene {\n id\n }\n }\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n totalCount\n }\n }\n"): (typeof documents)["\n query GetProjects($workspaceId: ID!, $pagination: Pagination, $keyword: String, $sort: ProjectSort) {\n projects(workspaceId: $workspaceId, pagination: $pagination, keyword: $keyword, sort: $sort) {\n edges {\n node {\n id\n ...ProjectFragment\n scene {\n id\n }\n }\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n totalCount\n }\n }\n"];
271+
export function gql(source: "\n query GetProjects($workspaceId: ID!, $pagination: Pagination, $keyword: String, $sort: ProjectSort) {\n projects(workspaceId: $workspaceId, pagination: $pagination, keyword: $keyword, sort: $sort) {\n edges {\n node {\n id\n ...ProjectFragment\n scene {\n id\n alias\n }\n }\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n totalCount\n }\n }\n"): (typeof documents)["\n query GetProjects($workspaceId: ID!, $pagination: Pagination, $keyword: String, $sort: ProjectSort) {\n projects(workspaceId: $workspaceId, pagination: $pagination, keyword: $keyword, sort: $sort) {\n edges {\n node {\n id\n ...ProjectFragment\n scene {\n id\n alias\n }\n }\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n totalCount\n }\n }\n"];
272272
/**
273273
* The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
274274
*/
@@ -332,7 +332,7 @@ export function gql(source: "\n mutation MovePropertyItem(\n $propertyId: ID
332332
/**
333333
* The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
334334
*/
335-
export function gql(source: "\n query GetScene($sceneId: ID!, $lang: Lang) {\n node(id: $sceneId, type: SCENE) {\n id\n ... on Scene {\n workspaceId\n projectId\n property {\n id\n ...PropertyFragment\n }\n plugins {\n property {\n id\n ...PropertyFragment\n }\n plugin {\n ...PluginFragment\n }\n }\n widgets {\n id\n enabled\n extended\n pluginId\n extensionId\n property {\n id\n ...PropertyFragment\n }\n }\n widgetAlignSystem {\n ...WidgetAlignSystemFragment\n }\n stories {\n ...StoryFragment\n }\n newLayers {\n ...NLSLayerCommon\n }\n styles {\n ...NLSLayerStyle\n }\n }\n }\n }\n"): (typeof documents)["\n query GetScene($sceneId: ID!, $lang: Lang) {\n node(id: $sceneId, type: SCENE) {\n id\n ... on Scene {\n workspaceId\n projectId\n property {\n id\n ...PropertyFragment\n }\n plugins {\n property {\n id\n ...PropertyFragment\n }\n plugin {\n ...PluginFragment\n }\n }\n widgets {\n id\n enabled\n extended\n pluginId\n extensionId\n property {\n id\n ...PropertyFragment\n }\n }\n widgetAlignSystem {\n ...WidgetAlignSystemFragment\n }\n stories {\n ...StoryFragment\n }\n newLayers {\n ...NLSLayerCommon\n }\n styles {\n ...NLSLayerStyle\n }\n }\n }\n }\n"];
335+
export function gql(source: "\n query GetScene($sceneId: ID!, $lang: Lang) {\n node(id: $sceneId, type: SCENE) {\n id\n ... on Scene {\n workspaceId\n projectId\n alias\n property {\n id\n ...PropertyFragment\n }\n plugins {\n property {\n id\n ...PropertyFragment\n }\n plugin {\n ...PluginFragment\n }\n }\n widgets {\n id\n enabled\n extended\n pluginId\n extensionId\n property {\n id\n ...PropertyFragment\n }\n }\n widgetAlignSystem {\n ...WidgetAlignSystemFragment\n }\n stories {\n ...StoryFragment\n }\n newLayers {\n ...NLSLayerCommon\n }\n styles {\n ...NLSLayerStyle\n }\n }\n }\n }\n"): (typeof documents)["\n query GetScene($sceneId: ID!, $lang: Lang) {\n node(id: $sceneId, type: SCENE) {\n id\n ... on Scene {\n workspaceId\n projectId\n alias\n property {\n id\n ...PropertyFragment\n }\n plugins {\n property {\n id\n ...PropertyFragment\n }\n plugin {\n ...PluginFragment\n }\n }\n widgets {\n id\n enabled\n extended\n pluginId\n extensionId\n property {\n id\n ...PropertyFragment\n }\n }\n widgetAlignSystem {\n ...WidgetAlignSystemFragment\n }\n stories {\n ...StoryFragment\n }\n newLayers {\n ...NLSLayerCommon\n }\n styles {\n ...NLSLayerStyle\n }\n }\n }\n }\n"];
336336
/**
337337
* The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
338338
*/

0 commit comments

Comments
 (0)