Skip to content

Commit f9faaf0

Browse files
chore(clerk-js,elements,shared): Move iconImageUrl util to shared package (clerk#4188)
1 parent 8ef124e commit f9faaf0

8 files changed

Lines changed: 21 additions & 23 deletions

File tree

.changeset/tricky-poems-yell.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
"@clerk/clerk-js": patch
3+
"@clerk/elements": patch
4+
"@clerk/shared": patch
5+
---
6+
7+
Internal change to move `iconImageUrl` util to `shared` package.

packages/clerk-js/src/ui/common/constants.ts

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -101,11 +101,3 @@ export const WEB3_PROVIDERS: Web3Providers = Object.freeze({
101101
export function getWeb3ProviderData(name: Web3Provider): Web3ProviderData | undefined | null {
102102
return WEB3_PROVIDERS[name];
103103
}
104-
105-
/**
106-
* Returns the URL for a static SVG image
107-
* using the new img.clerk.com service
108-
*/
109-
export function iconImageUrl(id: string): string {
110-
return `https://img.clerk.com/static/${id}.svg`;
111-
}

packages/clerk-js/src/ui/elements/IdentityPreview.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { iconImageUrl } from '@clerk/shared/constants';
12
import React from 'react';
23

34
import { Button, descriptors, Flex, Icon, Text } from '../customizables';
@@ -12,7 +13,7 @@ type IdentityPreviewProps = {
1213
} & PropsOfComponent<typeof Flex>;
1314

1415
export const IdentityPreview = (props: IdentityPreviewProps) => {
15-
const { avatarUrl = 'https://img.clerk.com/static/avatar_placeholder.jpeg', identifier, onClick, ...rest } = props;
16+
const { avatarUrl = iconImageUrl('avatar_placeholder', 'jpeg'), identifier, onClick, ...rest } = props;
1617
const refs = React.useRef({ avatarUrl, identifier: formatSafeIdentifier(identifier) });
1718

1819
const edit = onClick && (

packages/clerk-js/src/ui/hooks/useEnabledThirdPartyProviders.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1+
import { iconImageUrl } from '@clerk/shared/constants';
12
import type { OAuthProvider, OAuthStrategy, Web3Provider, Web3Strategy } from '@clerk/types';
23
// TODO: This import shouldn't be part of @clerk/types
34
import { OAUTH_PROVIDERS, WEB3_PROVIDERS } from '@clerk/types';
45

5-
import { iconImageUrl } from '../common/constants';
66
import { useEnvironment } from '../contexts/EnvironmentContext';
77
import { fromEntries } from '../utils';
88

packages/clerk-js/src/ui/hooks/useSaml.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1+
import { iconImageUrl } from '@clerk/shared/constants';
12
import type { SamlIdpSlug } from '@clerk/types';
23
import { SAML_IDPS } from '@clerk/types';
34

4-
import { iconImageUrl } from '../common/constants';
5-
65
function getSamlProviderLogoUrl(provider: SamlIdpSlug = 'saml_custom'): string {
76
return iconImageUrl(SAML_IDPS[provider]?.logo);
87
}

packages/elements/src/utils/clerk-js.ts

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,3 @@ export const fromEntries = (iterable: Iterable<any>) => {
55
return obj;
66
}, {});
77
};
8-
9-
/**
10-
* Returns the URL for a static SVG image
11-
* using the new img.clerk.com service
12-
*
13-
* Pulled from `clerk-js/src/ui/common/constants.ts`
14-
*/
15-
export function iconImageUrl(id: string): string {
16-
return `https://img.clerk.com/static/${id}.svg`;
17-
}

packages/elements/src/utils/third-party-strategies.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
// c.f. vendor/clerk-js/src/ui/hooks/useEnabledThirdPartyProviders.tsx [Modified]
22

3+
import { iconImageUrl } from '@clerk/shared/constants';
34
import type {
45
EnvironmentResource,
56
OAuthProvider,
@@ -10,7 +11,7 @@ import type {
1011
} from '@clerk/types';
1112
import { OAUTH_PROVIDERS, WEB3_PROVIDERS } from '@clerk/types'; // TODO: This import shouldn't be part of @clerk/types
1213

13-
import { fromEntries, iconImageUrl } from './clerk-js';
14+
import { fromEntries } from './clerk-js';
1415

1516
export type ThirdPartyStrategy =
1617
| {

packages/shared/src/constants.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,3 +16,11 @@ export const STAGING_ENV_SUFFIXES = ['.accountsstage.dev'];
1616
export const LOCAL_API_URL = 'https://api.lclclerk.com';
1717
export const STAGING_API_URL = 'https://api.clerkstage.dev';
1818
export const PROD_API_URL = 'https://api.clerk.com';
19+
20+
/**
21+
* Returns the URL for a static image
22+
* using the new img.clerk.com service
23+
*/
24+
export function iconImageUrl(id: string, format: 'svg' | 'jpeg' = 'svg'): string {
25+
return `https://img.clerk.com/static/${id}.${format}`;
26+
}

0 commit comments

Comments
 (0)