This repository has been archived by the owner on Sep 24, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #70 from commercelayer/update-loading-ui
Update loading UI
- Loading branch information
Showing
18 changed files
with
6,803 additions
and
4,982 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
46 changes: 26 additions & 20 deletions
46
packages/app/src/components/Details/ImportedResourceType.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,27 +1,33 @@ | ||
import { useImportDetailsContext } from '#components/Details/Provider' | ||
import { formatResourceName } from '@commercelayer/app-elements' | ||
import { | ||
formatResourceName, | ||
withSkeletonTemplate | ||
} from '@commercelayer/app-elements' | ||
import { type ListableResourceType } from '@commercelayer/sdk/lib/cjs/api' | ||
|
||
interface Props extends React.HTMLAttributes<HTMLSpanElement> {} | ||
|
||
export function ImportedResourceType(props: Props): JSX.Element | null { | ||
const { | ||
state: { data } | ||
} = useImportDetailsContext() | ||
export const ImportedResourceType = withSkeletonTemplate<Props>( | ||
// eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
({ isLoading, delayMs, ...props }) => { | ||
const { | ||
state: { data } | ||
} = useImportDetailsContext() | ||
|
||
if (data == null) { | ||
return null | ||
} | ||
if (data == null) { | ||
return null | ||
} | ||
|
||
return ( | ||
<span {...props}> | ||
{data?.resource_type != null | ||
? formatResourceName({ | ||
resource: data.resource_type as ListableResourceType, | ||
count: 'plural', | ||
format: 'title' | ||
}) | ||
: '-'} | ||
</span> | ||
) | ||
} | ||
return ( | ||
<span {...props}> | ||
{data?.resource_type != null | ||
? formatResourceName({ | ||
resource: data.resource_type as ListableResourceType, | ||
count: 'plural', | ||
format: 'title' | ||
}) | ||
: '-'} | ||
</span> | ||
) | ||
} | ||
) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import type { Resource } from '@commercelayer/sdk/lib/cjs/resource' | ||
|
||
export * from './resources/imports' | ||
|
||
export const isMockedId = (id: string): boolean => { | ||
return id.startsWith('fake-') | ||
} | ||
|
||
export const isMock = (resource: Resource): boolean => { | ||
return isMockedId(resource.id) | ||
} | ||
|
||
export const repeat = <R>(n: number, resource: () => R): R[] => { | ||
return Array(n) | ||
.fill(0) | ||
.map(() => resource()) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import type { ResourceTypeLock } from '@commercelayer/sdk/lib/cjs/api' | ||
|
||
interface GenericResource<T> { | ||
readonly type: T | ||
id: string | ||
created_at: string | ||
updated_at: string | ||
} | ||
|
||
export const makeResource = <T extends ResourceTypeLock>( | ||
type: T | ||
): GenericResource<T> => { | ||
return { | ||
type, | ||
id: `fake-${Math.random()}`, | ||
created_at: new Date().toJSON(), | ||
updated_at: new Date().toJSON() | ||
} | ||
} |
Oops, something went wrong.