status-im
/
status-web
mirror of https://github.com/status-im/status-web.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

[website] Revert URL verification (#412) 

* revert status-js

* revert website
This commit is contained in:
Felicio Mununga 2023-06-06 14:10:11 +02:00 committed by GitHub
parent 36538591ce
commit 8ec5bf3bc5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
18 changed files with 155 additions and 393 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
apps/website/src/components/error-page.tsx
View File

@ -21,17 +21,6 @@ export const ErrorPage = (props: Props) => {
</div>
)
// todo!: design review, not in designs
case ERROR_CODES.UNVERIFIED_CONTENT:
return (
<div className="flex h-full w-full flex-col items-center justify-center gap-8 bg-white text-center">
<div className="h-[160px] w-[160px] rounded-full bg-[#ffd455]" />
<Text size={27} weight="semibold">
Unverified content.
</Text>
</div>
)
case ERROR_CODES.INTERNAL_SERVER_ERROR:
default:
return (

93
apps/website/src/components/preview-page.tsx
View File

@ -43,25 +43,25 @@ type Type = 'community' | 'channel' | 'profile'
type PreviewPageProps = {
type: Type
unverifiedEncodedData?: string | null
encodedData?: string | null
index?: boolean
} & (
| {
type: 'community'
unverifiedDecodedData?: ReturnType<typeof decodeCommunityURLData> | null
decodedData?: ReturnType<typeof decodeCommunityURLData> | null
}
| {
type: 'channel'
unverifiedDecodedData?: ReturnType<typeof decodeChannelURLData> | null
decodedData?: ReturnType<typeof decodeChannelURLData> | null
channelUuid?: string
}
| {
type: 'profile'
unverifiedDecodedData?: ReturnType<typeof decodeUserURLData> | null
decodedData?: ReturnType<typeof decodeUserURLData> | null
}
)
export type VerifiedData =
export type Data =
| {
type: 'community'
info: CommunityInfo
@ -93,26 +93,26 @@ const JOIN_BUTTON_LABEL: Record<Type, string> = {
}
export function PreviewPage(props: PreviewPageProps) {
const { type, unverifiedDecodedData, unverifiedEncodedData } = props
const { type, decodedData, encodedData } = props
const { asPath } = useRouter()
const toast = useToast()
// todo: default og image, not dynamic
// const ogImageUrl = getOgImageUrl(props.unverifiedDecodedData)
// const ogImageUrl = getOgImageUrl(props.decodedData)
// todo?: pass meta, info as component
// todo?: pass image, color as props
const {
publicKey,
channelUuid: urlChannelUuid,
verifiedURLData,
data: urlData,
errorCode: urlErrorCode,
} = useURLData(type, unverifiedDecodedData, unverifiedEncodedData)
} = useURLData(type, decodedData, encodedData)
const {
data: verifiedWakuData,
data: wakuData,
isLoading,
status,
refetch,
@ -120,7 +120,7 @@ export function PreviewPage(props: PreviewPageProps) {
refetchOnWindowFocus: false,
queryKey: [type],
enabled: !!publicKey,
queryFn: async function ({ queryKey }): Promise<VerifiedData | null> {
queryFn: async function ({ queryKey }): Promise<Data | null> {
const client = await getRequestClient()
switch (queryKey[0]) {
@ -173,36 +173,35 @@ export function PreviewPage(props: PreviewPageProps) {
return
}
if (verifiedURLData) {
if (urlData) {
toast.custom('Information just updated', <InfoIcon size={20} />)
}
},
})
const loading = status === 'loading' || isLoading
const verifiedData: VerifiedData | undefined =
verifiedWakuData ?? verifiedURLData
const data: Data | undefined = wakuData ?? urlData
const { avatarURL, bannerURL } = useMemo(() => {
if (!verifiedData) {
if (!data) {
return {}
}
const avatarURL = getAvatarURL(verifiedData)
const bannerURL = getBannerURL(verifiedData)
const avatarURL = getAvatarURL(data)
const bannerURL = getBannerURL(data)
return { avatarURL, bannerURL }
}, [verifiedData])
}, [data])
if (urlErrorCode) {
return <ErrorPage errorCode={urlErrorCode} />
}
if (!loading && !verifiedData) {
if (!loading && !data) {
return <ErrorPage errorCode={ERROR_CODES.NOT_FOUND} />
}
if ((loading && !verifiedData) || !verifiedData || !publicKey) {
if ((loading && !data) || !data || !publicKey) {
return (
<>
<div className="h-full xl:grid xl:grid-cols-[560px,auto]">
@ -317,7 +316,7 @@ export function PreviewPage(props: PreviewPageProps) {
{/* todo: theme; based on user system settings */}
{/* todo: (system or both?) install banner */}
<div
style={!bannerURL ? getGradientStyles(verifiedData) : undefined}
style={!bannerURL ? getGradientStyles(data) : undefined}
className="relative h-full bg-gradient-to-b from-[var(--gradient-color)] to-[#fff] to-20% xl:grid xl:grid-cols-[560px,auto]"
>
<div className="absolute left-0 right-0 top-0 xl:hidden">
@ -336,54 +335,54 @@ export function PreviewPage(props: PreviewPageProps) {
{/* HERO */}
<div className="mb-[32px] xl:mb-[35px]">
<div className="mb-2 xl:mb-4">
{verifiedData.type === 'community' && (
{data.type === 'community' && (
<Avatar
type="community"
name={verifiedData.info.displayName}
name={data.info.displayName}
src={avatarURL}
size={80}
/>
)}
{verifiedData.type === 'channel' && (
{data.type === 'channel' && (
<Avatar
type="channel"
name={verifiedData.info.displayName}
emoji={verifiedData.info.emoji}
name={data.info.displayName}
emoji={data.info.emoji}
size={80}
// fixme: use `verifiedData.info.color` (e.g. #000000 format)
// fixme: use `data.info.color` (e.g. #000000 format)
backgroundColor="$neutral-100"
/>
)}
{verifiedData.type === 'profile' && (
{data.type === 'profile' && (
<Avatar
type="user"
name={verifiedData.info.displayName}
name={data.info.displayName}
src={avatarURL}
size={80}
colorHash={verifiedData.info.colorHash}
colorHash={data.info.colorHash}
/>
)}
</div>
<h1 className="mb-3 text-[40px] font-semibold leading-[44px] xl:text-[64px] xl:leading-[68px]">
{verifiedData.type === 'channel' && '#'}
{verifiedData.info.displayName}
{data.type === 'channel' && '#'}
{data.info.displayName}
</h1>
<p className="mb-4 text-[15px] text-neutral-100 xl:text-[19px]">
{verifiedData.info.description}
{data.info.description}
</p>
{verifiedData.type === 'community' && (
{data.type === 'community' && (
<>
<div className="mb-4 flex items-center gap-1">
<MembersIcon size={20} color="$neutral-50" />
<Text size={15}>
{formatNumber(verifiedData.info.membersCount)}
{formatNumber(data.info.membersCount)}
</Text>
</div>
{verifiedData.info.tags?.length > 0 && (
{data.info.tags?.length > 0 && (
<div className="flex flex-wrap gap-[6px] xl:gap-[11px]">
{verifiedData.info.tags.map(tag => (
{data.info.tags.map(tag => (
<Tag
key={tag.emoji + tag.text}
size={32}
@ -395,7 +394,7 @@ export function PreviewPage(props: PreviewPageProps) {
)}
</>
)}
{verifiedData.type === 'channel' && (
{data.type === 'channel' && (
<div className="flex items-center gap-1">
<Text size={13} color="$neutral-40">
Channel in
@ -403,18 +402,18 @@ export function PreviewPage(props: PreviewPageProps) {
<ContextTag
type="community"
community={{
name: verifiedData.info.community.displayName,
name: data.info.community.displayName,
src: getAvatarURL({
type: 'community',
info: verifiedData.info.community as CommunityInfo,
info: data.info.community as CommunityInfo,
}),
}}
/>
</div>
)}
{verifiedData.type === 'profile' && (
{data.type === 'profile' && (
<p className="text-[16px] tracking-[.2em]">
{verifiedData.info.emojiHash}
{data.info.emojiHash}
</p>
)}
</div>
@ -497,9 +496,7 @@ export function PreviewPage(props: PreviewPageProps) {
!bannerURL
? {
backgroundColor:
'color' in verifiedData.info
? verifiedData.info.color
: neutral[100],
'color' in data.info ? data.info.color : neutral[100],
}
: undefined
}
@ -527,14 +524,14 @@ const formatNumber = (n: number) => {
return formatter.format(n)
}
const getGradientStyles = (data: VerifiedData): CSSProperties => {
const getGradientStyles = (data: Data): CSSProperties => {
return {
// @ts-expect-error CSSProperties do not handle inline CSS variables
'--gradient-color': 'color' in data.info ? data.info.color : neutral[100],
}
}
const getAvatarURL = (data: VerifiedData): string | undefined => {
const getAvatarURL = (data: Data): string | undefined => {
let avatar: Uint8Array | undefined
switch (data.type) {
case 'community':
@ -560,7 +557,7 @@ const getAvatarURL = (data: VerifiedData): string | undefined => {
return url
}
const getBannerURL = (data: VerifiedData): string | undefined => {
const getBannerURL = (data: Data): string | undefined => {
let banner: Uint8Array | undefined
switch (data.type) {
case 'community':

1
apps/website/src/consts/error-codes.ts
View File

@ -1,6 +1,5 @@
export const ERROR_CODES = {
NOT_FOUND: 404,
INTERNAL_SERVER_ERROR: 500,
UNVERIFIED_CONTENT: 600,
INVALID_PUBLIC_KEY: 601,
}

72
apps/website/src/hooks/use-url-data.ts
View File

@ -7,13 +7,12 @@ import {
indicesToTags,
publicKeyToColorHash,
publicKeyToEmojiHash,
verifyEncodedURLData,
recoverPublicKeyFromEncodedURLData,
} from '@status-im/js'
import { decodeVerificationURLHash } from '@status-im/js/encode-url-hash'
import { ERROR_CODES } from '@/consts/error-codes'
import type { VerifiedData } from '@/components/preview-page'
import type { Data } from '@/components/preview-page'
import type { ChannelInfo, CommunityInfo, UserInfo } from '@status-im/js'
import type {
decodeChannelURLData,
@ -23,17 +22,17 @@ import type {
export const useURLData = (
type: 'community' | 'channel' | 'profile',
unverifiedDecodedData:
decodedData:
| ReturnType<typeof decodeCommunityURLData>
| ReturnType<typeof decodeChannelURLData>
| ReturnType<typeof decodeUserURLData>
| undefined
| null,
unverifiedEncodedData: string | undefined | null
encodedData: string | undefined | null
) => {
const [publicKey, setPublicKey] = useState<string>()
const [channelUuid, setChannelUuid] = useState<string>()
const [info, setInfo] = useState<VerifiedData>()
const [data, setData] = useState<Data>()
const [error, setError] = useState<keyof typeof ERROR_CODES>()
const compressPublicKey = type !== 'profile'
@ -46,9 +45,10 @@ export const useURLData = (
// return
// }
if (!unverifiedDecodedData || !unverifiedEncodedData) {
const hash = window.location.hash.replace('#', '')
// use provided public key
if (!decodedData || !encodedData) {
if (!hash) {
setError('NOT_FOUND')
@ -61,37 +61,39 @@ export const useURLData = (
})
setPublicKey(publicKey)
return
} catch (error) {
console.error(error)
setError('INVALID_PUBLIC_KEY')
}
return
}
const hash = window.location.hash.replace('#', '')
const { signature, publicKey } = decodeVerificationURLHash(hash)
if (!signature || !publicKey) {
setError('UNVERIFIED_CONTENT')
return
}
if (!verifyEncodedURLData(unverifiedEncodedData, hash)) {
setError('UNVERIFIED_CONTENT')
return
}
const deserializedPublicKey = deserializePublicKey(publicKey, {
// recover public key
let deserializedPublicKey
try {
const recoveredPublicKey = recoverPublicKeyFromEncodedURLData(
encodedData,
hash
)
deserializedPublicKey = deserializePublicKey(recoveredPublicKey, {
compress: compressPublicKey,
})
const verifiedDecodedData = unverifiedDecodedData
setPublicKey(deserializedPublicKey)
} catch (error) {
console.error(error)
setError('INVALID_PUBLIC_KEY')
return
}
// map data
switch (type) {
case 'community': {
const data = verifiedDecodedData as Required<
const data = decodedData as Required<
ReturnType<typeof decodeCommunityURLData>
>
const info: CommunityInfo = {
@ -102,12 +104,12 @@ export const useURLData = (
tags: indicesToTags(data.tagIndices),
}
setInfo({ type: 'community', info })
setData({ type: 'community', info })
break
return
}
case 'channel': {
const data = verifiedDecodedData as Required<
const data = decodedData as Required<
ReturnType<typeof decodeChannelURLData>
>
const info: Omit<ChannelInfo, 'community'> & {
@ -120,13 +122,13 @@ export const useURLData = (
community: { displayName: data.community.displayName },
}
setInfo({ type: 'channel', info })
setData({ type: 'channel', info })
setChannelUuid(data.uuid)
break
return
}
case 'profile': {
const data = verifiedDecodedData as Required<
const data = decodedData as Required<
ReturnType<typeof decodeUserURLData>
>
const info: UserInfo = {
@ -136,13 +138,11 @@ export const useURLData = (
emojiHash: publicKeyToEmojiHash(deserializedPublicKey),
}
setInfo({ type: 'profile', info })
setData({ type: 'profile', info })
break
return
}
}
setPublicKey(deserializedPublicKey)
} catch (error) {
console.error(error)
setError('INTERNAL_SERVER_ERROR')
@ -152,7 +152,7 @@ export const useURLData = (
return {
publicKey,
channelUuid,
verifiedURLData: info,
data,
errorCode: error ? ERROR_CODES[error] : undefined,
}
}

4
apps/website/src/pages/c/[slug].tsx
View File

@ -15,8 +15,8 @@ export default function CommunityPreviewPage(
return (
<PreviewPage
type="community"
unverifiedDecodedData={props.unverifiedDecodedData}
unverifiedEncodedData={props.uverifiedEncodedData}
decodedData={props.decodedData}
encodedData={props.encodedData}
/>
)
}

4
apps/website/src/pages/cc/[slug].tsx
View File

@ -13,8 +13,8 @@ export default function ChannelPreviewPage(
return (
<PreviewPage
type="channel"
unverifiedDecodedData={props.unverifiedDecodedData}
unverifiedEncodedData={props.uverifiedEncodedData}
decodedData={props.decodedData}
encodedData={props.encodedData}
channelUuid={props.channelUuid}
/>
)

4
apps/website/src/pages/u/[slug].tsx
View File

@ -13,8 +13,8 @@ export default function UserPreviewPage(
return (
<PreviewPage
type="profile"
unverifiedDecodedData={props.unverifiedDecodedData}
unverifiedEncodedData={props.uverifiedEncodedData}
decodedData={props.decodedData}
encodedData={props.encodedData}
/>
)
}

24
apps/website/src/server/ssr.ts
View File

@ -13,17 +13,13 @@ type DecodeType =
export type ServerSideProps<T = ReturnType<DecodeType>> = {
/**
* For verifying on client without decoding or re-encoding.
*
* Verification in general is done on encoded data, so it is not
* decoded, decompressed and deserialized unnecessarily if not to be
* displayed or othwerwise needed.
* For verifying on client without re-encoding.
*/
uverifiedEncodedData: string | null
encodedData: string | null
/**
* For instaneous preview even if the data is not verified yet.
* For instaneous preview of the content.
*/
unverifiedDecodedData: T | null
decodedData: T | null
channelUuid?: string
}
@ -46,8 +42,8 @@ export function createGetServerSideProps(decodeURLData: DecodeType) {
if (channelUuid) {
const props: ServerSideProps = {
channelUuid: channelUuid[0],
uverifiedEncodedData: null,
unverifiedDecodedData: null,
encodedData: null,
decodedData: null,
}
return { props }
@ -57,8 +53,8 @@ export function createGetServerSideProps(decodeURLData: DecodeType) {
if (!encodedData) {
const props: ServerSideProps = {
uverifiedEncodedData: null,
unverifiedDecodedData: null,
encodedData: null,
decodedData: null,
}
return { props }
@ -66,8 +62,8 @@ export function createGetServerSideProps(decodeURLData: DecodeType) {
const decodedData = decodeURLData(encodedData)
const props: ServerSideProps = {
uverifiedEncodedData: encodedData,
unverifiedDecodedData: decodedData || null,
encodedData,
decodedData: decodedData || null,
}
// fixme: set Cache-Control

2
packages/status-js/src/index.ts
View File

@ -22,4 +22,4 @@ export { createRequestClient } from './request-client/request-client'
export { deserializePublicKey } from './utils/deserialize-public-key'
export { publicKeyToColorHash } from './utils/public-key-to-color-hash'
export { publicKeyToEmojiHash } from './utils/public-key-to-emoji-hash'
export { verifyEncodedURLData } from './utils/sign-url-data'
export { recoverPublicKeyFromEncodedURLData } from './utils/sign-url-data'

10
packages/status-js/src/protos/url.proto
View File

@ -23,21 +23,11 @@ message User {
string color = 3;
}
message Verification {
string signature = 1;
string public_key = 2;
}
message URLData {
// Community, Channel, or User
bytes content = 1;
}
message URLHash {
// Verification
bytes content = 1;
}
message URLParams {
string encoded_url_data = 1;
// Signature of encoded URL data

106
packages/status-js/src/protos/url_pb.ts
View File

@ -267,61 +267,6 @@ export class User extends Message<User> {
}
}
/**
* @generated from message Verification
*/
export class Verification extends Message<Verification> {
/**
* @generated from field: string signature = 1;
*/
signature = ''
/**
* @generated from field: string public_key = 2;
*/
publicKey = ''
constructor(data?: PartialMessage<Verification>) {
super()
proto3.util.initPartial(data, this)
}
static readonly runtime = proto3
static readonly typeName = 'Verification'
static readonly fields: FieldList = proto3.util.newFieldList(() => [
{ no: 1, name: 'signature', kind: 'scalar', T: 9 /* ScalarType.STRING */ },
{ no: 2, name: 'public_key', kind: 'scalar', T: 9 /* ScalarType.STRING */ },
])
static fromBinary(
bytes: Uint8Array,
options?: Partial<BinaryReadOptions>
): Verification {
return new Verification().fromBinary(bytes, options)
}
static fromJson(
jsonValue: JsonValue,
options?: Partial<JsonReadOptions>
): Verification {
return new Verification().fromJson(jsonValue, options)
}
static fromJsonString(
jsonString: string,
options?: Partial<JsonReadOptions>
): Verification {
return new Verification().fromJsonString(jsonString, options)
}
static equals(
a: Verification | PlainMessage<Verification> | undefined,
b: Verification | PlainMessage<Verification> | undefined
): boolean {
return proto3.util.equals(Verification, a, b)
}
}
/**
* @generated from message URLData
*/
@ -373,57 +318,6 @@ export class URLData extends Message<URLData> {
}
}
/**
* @generated from message URLHash
*/
export class URLHash extends Message<URLHash> {
/**
* Verification
*
* @generated from field: bytes content = 1;
*/
content = new Uint8Array(0)
constructor(data?: PartialMessage<URLHash>) {
super()
proto3.util.initPartial(data, this)
}
static readonly runtime = proto3
static readonly typeName = 'URLHash'
static readonly fields: FieldList = proto3.util.newFieldList(() => [
{ no: 1, name: 'content', kind: 'scalar', T: 12 /* ScalarType.BYTES */ },
])
static fromBinary(
bytes: Uint8Array,
options?: Partial<BinaryReadOptions>
): URLHash {
return new URLHash().fromBinary(bytes, options)
}
static fromJson(
jsonValue: JsonValue,
options?: Partial<JsonReadOptions>
): URLHash {
return new URLHash().fromJson(jsonValue, options)
}
static fromJsonString(
jsonString: string,
options?: Partial<JsonReadOptions>
): URLHash {
return new URLHash().fromJsonString(jsonString, options)
}
static equals(
a: URLHash | PlainMessage<URLHash> | undefined,
b: URLHash | PlainMessage<URLHash> | undefined
): boolean {
return proto3.util.equals(URLHash, a, b)
}
}
/**
* @generated from message URLParams
*/

6
packages/status-js/src/utils/create-url.test.ts
View File

@ -66,7 +66,7 @@ describe('Create URLs', () => {
)
).toString()
).toBe(
'https://status.app/c/iyKACkQKB0Rvb2RsZXMSJ0NvbG9yaW5nIHRoZSB3b3JsZCB3aXRoIGpveSDigKIg4bSXIOKAohiYohsiByMxMzFEMkYqAwEhMwM=#Co0BClhRbk8yaHc1dFZBRS1NRDVpOE1xNHNfb0dXZDByUkZtbE9iZ1JVTlFYdFVOd1AxaXhGdzkxNFk0LUJRcEYwOEtPcXBhVUxDaDdVQ3RsV1ItTzBZUDhNd0E9EjF6UTNzaFlTSHA3R29pWGFhdUpNbkRjandVMnlOamR6cFhMb3NBV2FwUFM0Q0Z4YzEx'
'https://status.app/c/iyKACkQKB0Rvb2RsZXMSJ0NvbG9yaW5nIHRoZSB3b3JsZCB3aXRoIGpveSDigKIg4bSXIOKAohiYohsiByMxMzFEMkYqAwEhMwM=#QnO2hw5tVAE-MD5i8Mq4s_oGWd0rRFmlObgRUNQXtUNwP1ixFw914Y4-BQpF08KOqpaULCh7UCtlWR-O0YP8MwA='
)
})
@ -122,7 +122,7 @@ describe('Create URLs', () => {
)
).toString()
).toBe(
'https://status.app/cc/G54AAKwObLdpiGjXnckYzRcOSq0QQAS_CURGfqVU42ceGHCObstUIknTTZDOKF3E8y2MSicncpO7fTskXnoACiPKeejvjtLTGWNxUhlT7fyQS7Jrr33UVHluxv_PLjV2ePGw5GQ33innzeK34pInIgUGs5RjdQifMVmURalxxQKwiuoY5zwIjixWWRHqjHM=#Co0BClg3YWVCLU02cElidnBTVkdNNFRlSmtLV1B5YTRZUkFIYnE0YW1MMGNIbFNCcFJLbjdfbHlSNGt4RURvMmhDNGtvcVBXWWVfYWsyUjljU1ZLU2lWX25OQUE9EjF6UTNzaFlTSHA3R29pWGFhdUpNbkRjandVMnlOamR6cFhMb3NBV2FwUFM0Q0Z4YzEx'
'https://status.app/cc/G54AAKwObLdpiGjXnckYzRcOSq0QQAS_CURGfqVU42ceGHCObstUIknTTZDOKF3E8y2MSicncpO7fTskXnoACiPKeejvjtLTGWNxUhlT7fyQS7Jrr33UVHluxv_PLjV2ePGw5GQ33innzeK34pInIgUGs5RjdQifMVmURalxxQKwiuoY5zwIjixWWRHqjHM=#7aeB-M6pIbvpSVGM4TeJkKWPya4YRAHbq4amL0cHlSBpRKn7_lyR4kxEDo2hC4koqPWYe_ak2R9cSVKSiV_nNAA='
)
})
@ -159,7 +159,7 @@ describe('Create URLs', () => {
)
).toString()
).toBe(
'https://status.app/u/G10A4B0JdgwyRww90WXtnP1oNH1ZLQNM0yX0Ja9YyAMjrqSZIYINOHCbFhrnKRAcPGStPxCMJDSZlGCKzmZrJcimHY8BbcXlORrElv_BbQEegnMDPx1g9C5VVNl0fE4y#Co0BClhMYlFVZEpESENLb2k4RHpvWXlYODlicEtyVGpWVjNTaHFIM0U2NGJEaWZKQjJHa2VkdExCZlZLQTAyUmJVZlgwNzRwYjlpM293R3dSZFM2eF9udHhyUUE9EjF6UTNzaHdRUGhSdURKU2pWR1ZCblRqQ2RnWHk1aTlXUWFlVlBkR0pENnlUYXJKUVNq'
'https://status.app/u/G10A4B0JdgwyRww90WXtnP1oNH1ZLQNM0yX0Ja9YyAMjrqSZIYINOHCbFhrnKRAcPGStPxCMJDSZlGCKzmZrJcimHY8BbcXlORrElv_BbQEegnMDPx1g9C5VVNl0fE4y#LbQUdJDHCKoi8DzoYyX89bpKrTjVV3ShqH3E64bDifJB2GkedtLBfVKA02RbUfX074pb9i3owGwRdS6x_ntxrQA='
)
})
})

18
packages/status-js/src/utils/create-url.ts
View File

@ -19,14 +19,12 @@ export async function createCommunityURLWithData(
communityPrivateKey: Uint8Array | string
): Promise<URL> {
const encodedURLData = encodeCommunityURLData(communityData)
const encodedVerificationURLHash = await signEncodedURLData(
const encodedSignature = await signEncodedURLData(
encodedURLData,
communityPrivateKey
)
return new URL(
`${BASE_URL}/c/${encodedURLData}#${encodedVerificationURLHash}`
)
return new URL(`${BASE_URL}/c/${encodedURLData}#${encodedSignature}`)
}
export function createChannelURLWithChatKey(
@ -41,14 +39,12 @@ export async function createChannelURLWithData(
communityPrivateKey: Uint8Array | string
): Promise<URL> {
const encodedURLData = encodeChannelURLData(channelData)
const encodedVerificationURLHash = await signEncodedURLData(
const encodedSignature = await signEncodedURLData(
encodedURLData,
communityPrivateKey
)
return new URL(
`${BASE_URL}/cc/${encodedURLData}#${encodedVerificationURLHash}`
)
return new URL(`${BASE_URL}/cc/${encodedURLData}#${encodedSignature}`)
}
export function createUserURLWithENS(ensName: string): URL {
@ -64,12 +60,10 @@ export async function createUserURLWithData(
userPrivateKey: Uint8Array | string
): Promise<URL> {
const encodedURLData = encodeUserURLData(userData)
const encodedVerificationURLHash = await signEncodedURLData(
const encodedSignature = await signEncodedURLData(
encodedURLData,
userPrivateKey
)
return new URL(
`${BASE_URL}/u/${encodedURLData}#${encodedVerificationURLHash}`
)
return new URL(`${BASE_URL}/u/${encodedURLData}#${encodedSignature}`)
}

24
packages/status-js/src/utils/encode-url-hash.test.ts
View File

@ -1,24 +0,0 @@
import { describe, expect, test } from 'vitest'
import {
decodeVerificationURLHash,
encodeVerificationURLHash,
} from './encode-url-hash'
describe('Encode URL hash', () => {
test('should encode and decode verification hash', () => {
const data = {
signature:
'k-n7d-9Pcx6ht87F4riP5xAw1v7S-e1HGMRaeaO068Q3IF1Jo8xOyeMT9Yr3Wv349Z2CdBzylw8M83CgQhcMogA=', // not generated by the pk
publicKey: 'zQ3shUHp2rAM1yqBYeo6LhFbtrozG5mZeA6cRoGohsudtsieT',
}
const encodedHash = encodeVerificationURLHash(data)
const decodedHash = decodeVerificationURLHash(encodedHash)
expect(encodedHash).toBe(
'Co0BClhrLW43ZC05UGN4Nmh0ODdGNHJpUDV4QXcxdjdTLWUxSEdNUmFlYU8wNjhRM0lGMUpvOHhPeWVNVDlZcjNXdjM0OVoyQ2RCenlsdzhNODNDZ1FoY01vZ0E9EjF6UTNzaFVIcDJyQU0xeXFCWWVvNkxoRmJ0cm96RzVtWmVBNmNSb0dvaHN1ZHRzaWVU'
)
expect(decodedHash).toEqual(data)
})
})

41
packages/status-js/src/utils/encode-url-hash.ts
View File

@ -1,41 +0,0 @@
import { base64url } from '@scure/base'
import { URLHash, Verification } from '../protos/url_pb'
import type { PlainMessage } from '@bufbuild/protobuf'
export type EncodedVerificationURLHash = string & {
_: 'EncodedVerificationURLHash'
}
export function encodeVerificationURLHash(
data: PlainMessage<Verification>
): EncodedVerificationURLHash {
return encodeURLHash(
new Verification(data).toBinary()
) as EncodedVerificationURLHash
}
export function decodeVerificationURLHash(
data: string
): PlainMessage<Verification> {
const deserialized = decodeURLHash(data)
return Verification.fromBinary(
deserialized.content
).toJson() as PlainMessage<Verification>
}
function encodeURLHash(data: Uint8Array): string {
const serialized = new URLHash({ content: data }).toBinary()
const encoded = base64url.encode(serialized)
return encoded
}
function decodeURLHash(data: string): URLHash {
const decoded = base64url.decode(data)
const deserialized = URLHash.fromBinary(decoded)
return deserialized
}

81
packages/status-js/src/utils/sign-url-data.test.ts
View File

@ -1,7 +1,9 @@
import { expect, test } from 'vitest'
import { encodeVerificationURLHash } from './encode-url-hash'
import { signEncodedURLData, verifyEncodedURLData } from './sign-url-data'
import {
recoverPublicKeyFromEncodedURLData,
signEncodedURLData,
} from './sign-url-data'
import type { EncodedURLData } from './encode-url-data'
@ -13,50 +15,41 @@ const publicKey =
'0x04f9134866f2bd8f45f2bc7893c95a6b989378c370088c9a1a5a53eda2ebb8a1e8386921592b6bd56fc3573f03c46df3396cc42e2993cdc001855c858865d768a7'
const encodedURLData =
'G74AgK0ObFNmYT-WC_Jcc9KfSjHXAQo9THKEEbgPaJoItceMES-bUxr2Tj9efv447rRefBIUg9CEsSFyjBOFTRdZ9PH2wUOW8hVNYqIje3BC96mZ8uFogqM6k7gCCJnMHy4ulsmsgHTdeh5dAzTNNuG8m9XB8oVeildTCKlRhINnTZh4kAl5sP8SzBB4V2_I41a8PKl3mcS0z_eF5gA=' as EncodedURLData
test('should verify URL data and correspoinding signature', async () => {
const encodedVerificationURLHash = await signEncodedURLData(
encodedURLData,
privateKey
)
expect(verifyEncodedURLData(encodedURLData, encodedVerificationURLHash)).toBe(
true
)
})
test('should not verify URL data and random signature', async () => {
const randomSignature =
'OyOgY6Zta8S7U4l5Bv_9E_7snALhixwvjxORVAVJ-YJk-tMSGgstOy5XEEQx25TQJIAtpWf8eHnEmV8V-GmouQA='
const encodedVerificationURLHash = encodeVerificationURLHash({
signature: randomSignature,
publicKey,
})
expect(verifyEncodedURLData(encodedURLData, encodedVerificationURLHash)).toBe(
false
)
// see https://github.com/paulmillr/noble-secp256k1/issues/43#issuecomment-1020214968
// expect(verifyEncodedURLData(randomSignature, encodedURLData)).toBe(false)
})
test('should not verify random URL data and random signature', async () => {
const randomEncodedURLData =
'CyeACk0KHkxvcmVtIGlwc3VtIGRvbG9yIHNpdCBlZ2VzdGFzLhIYV2UgZG8gbm90IHN1cHBvcnQgQWxpY2UuGMCEPSIHIzQzNjBERioEAQIDBAM=' as EncodedURLData
const randomSignature =
const encodedSignature =
'k-n7d-9Pcx6ht87F4riP5xAw1v7S-e1HGMRaeaO068Q3IF1Jo8xOyeMT9Yr3Wv349Z2CdBzylw8M83CgQhcMogA='
const encodedVerificationURLHash = encodeVerificationURLHash({
signature: randomSignature,
publicKey,
})
test('should sign URL data', async () => {
expect(await signEncodedURLData(encodedURLData, privateKey)).toBe(
encodedSignature
)
})
test('should recover original public key from URL data', async () => {
expect(
await recoverPublicKeyFromEncodedURLData(encodedURLData, encodedSignature)
).toBe(publicKey)
})
test('should not recover original public key from same URL data but changed signature', async () => {
const changedEncodedSignature =
'OyOgY6Zta8S7U4l5Bv_9E_7snALhixwvjxORVAVJ-YJk-tMSGgstOy5XEEQx25TQJIAtpWf8eHnEmV8V-GmouQA='
expect(
verifyEncodedURLData(randomEncodedURLData, encodedVerificationURLHash)
).toBe(false)
// see https://github.com/paulmillr/noble-secp256k1/issues/43#issuecomment-1020214968
// expect(verifyEncodedURLData(randomSignature, randomEncodedURLData)).toBe(
// false
// )
await recoverPublicKeyFromEncodedURLData(
encodedURLData,
changedEncodedSignature
)
).not.toBe(publicKey)
})
test('should not recover original public key from same signature but changed URL data', async () => {
const changedEncodedURLData =
'CyeACk0KHkxvcmVtIGlwc3VtIGRvbG9yIHNpdCBlZ2VzdGFzLhIYV2UgZG8gbm90IHN1cHBvcnQgQWxpY2UuGMCEPSIHIzQzNjBERioEAQIDBAM=' as EncodedURLData
expect(
await recoverPublicKeyFromEncodedURLData(
changedEncodedURLData,
encodedSignature
)
).not.toBe(publicKey)
})

47
packages/status-js/src/utils/sign-url-data.ts
View File

@ -1,51 +1,30 @@
import { base64url } from '@scure/base'
import { getPublicKey } from 'ethereum-cryptography/secp256k1'
import { bytesToHex } from 'ethereum-cryptography/utils'
import { toHex, utf8ToBytes as toBytes } from 'ethereum-cryptography/utils'
import { deserializePublicKey } from './deserialize-public-key'
import {
decodeVerificationURLHash,
encodeVerificationURLHash,
} from './encode-url-hash'
import { serializePublicKey } from './serialize-public-key'
import { signData, verifySignedData } from './sign-data'
import { recoverPublicKey } from './recover-public-key'
import { signData } from './sign-data'
import type { EncodedURLData } from './encode-url-data'
import type { EncodedVerificationURLHash } from './encode-url-hash'
export async function signEncodedURLData(
encodedURLData: EncodedURLData,
privateKey: Uint8Array | string
): Promise<EncodedVerificationURLHash> {
): Promise<string> {
const signature = await signData(encodedURLData, privateKey)
const encodedSignature = base64url.encode(signature)
const serializedPublicKey = serializePublicKey(
`0x${bytesToHex(getPublicKey(privateKey))}`
)
return encodeVerificationURLHash({
signature: encodedSignature,
publicKey: serializedPublicKey,
})
return encodedSignature
}
export function verifyEncodedURLData(
export function recoverPublicKeyFromEncodedURLData(
encodedURLData: string,
encodedVerificationURLHash: string
): boolean {
const { signature, publicKey } = decodeVerificationURLHash(
encodedVerificationURLHash
)
const decodedSignature = base64url.decode(signature)
const deserializedPublicKey = deserializePublicKey(publicKey, {
compress: false,
})
return verifySignedData(
encodedSignature: string
): string {
const decodedSignature = base64url.decode(encodedSignature)
const recoveredPublicKey = recoverPublicKey(
decodedSignature,
encodedURLData,
deserializedPublicKey
toBytes(encodedURLData)
)
return `0x${toHex(recoveredPublicKey)}`
}

6
packages/status-js/vite.config.ts
View File

@ -26,11 +26,7 @@ export default defineConfig(({ mode }) => {
build: {
target: 'es2020',
lib: {
entry: [
'./src/index.ts',
'./src/utils/encode-url-data.ts',
'./src/utils/encode-url-hash.ts',
],
entry: ['./src/index.ts', './src/utils/encode-url-data.ts'],
fileName: (format, entryName) => {
if (!['es'].includes(format)) {
throw new Error(`Unexpected format: ${format}`)