Page MenuHomePhabricator
Differential D7510

[native] Introduce naive `useSelectFromGalleryAndUpdateUserAvatar` hook
ClosedPublic
Actions

Authored by atul on Apr 18 2023, 6:43 PM.
Tags
None
Referenced Files
Unknown Object (File)
Wed, Apr 9, 6:24 AM
Unknown Object (File)
Fri, Mar 28, 12:04 PM
Unknown Object (File)
Mar 6 2025, 10:06 AM
Unknown Object (File)
Feb 27 2025, 3:45 AM
Unknown Object (File)
Feb 27 2025, 3:13 AM
Unknown Object (File)
Feb 27 2025, 3:12 AM
Unknown Object (File)
Feb 25 2025, 6:24 AM
Unknown Object (File)
Feb 25 2025, 6:23 AM
View All Files
Subscribers
ginsu
tomek

Details

Reviewers
ashoat
ginsu
Commits
rCOMM3ece4b60c42e: [native] Introduce naive `useSelectFromGalleryAndUpdateUserAvatar` hook
Summary

This hook composes together the previously created image avatar-related hooks (eg useProcessSelectedMedia, useUploadProcessedMedia, etc) to

  1. Display system image picker to user so they can pick image
  2. Processes the selected image
  3. Uploads the processed image
  4. Updates the user avatar with the uploadID of the uploaded processed image

There's still work to be done in terms of displaying status/progress, handling errors (eg cleaning up temporary files), etc... but this diff gets things working "end to end." Putting it up now to unblock @ginsu's camera work.

NOTE: Reusing this hook in EditThreadAvatar for now as a placeholder to satisfy Flow/ESLint/etc. Will introduce equivalent for threads in next diff.
NOTE: Renamed useSelectAndUploadFromGallery to useSelectFromGallery after "pulling out" useProcessSelectedMedia and useUploadProcessedMedia calls. Those are now handled in the higher level useSelectFromGalleryAndUpdateUserAvatar hook (and upcoming thread avatar equivalent).

Depends on D7509

Test Plan

Able to successfully set image avatar:

Simulator Screenshot - Fresh iPhone 14 Pro - 2023-04-18 at 21.42.33.png (2×1 px, 386 KB)

Simulator Screenshot - Fresh iPhone 14 Pro - 2023-04-18 at 21.42.28.png (2×1 px, 231 KB)

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

atul created this revision.Apr 18 2023, 6:43 PM
Herald added a subscriber: tomek. · View Herald TranscriptApr 18 2023, 6:43 PM
atul edited the test plan for this revision. (Show Details)Apr 18 2023, 6:44 PM
atul added inline comments.
native/avatars/avatar-hooks.js
144–159 ↗(On Diff #25318)

Yes this error handling leaves plenty to be desired.. I'm actively working on it.

atul published this revision for review.Apr 18 2023, 6:44 PM
Harbormaster completed remote builds in B18487: Diff 25318.Apr 18 2023, 7:03 PM
atul added a child revision: D7511: [native] Introduce naive `useSelectFromGalleryAndUpdateThreadAvatar` hook.Apr 18 2023, 7:06 PM
ashoat accepted this revision.Apr 19 2023, 6:09 AM
ashoat added inline comments.
native/avatars/avatar-hooks.js
116 ↗(On Diff #25318)

Can we explicitly return undefined here?

275 ↗(On Diff #25318)

Does this actually get used outside of this file?

This revision is now accepted and ready to land.Apr 19 2023, 6:09 AM
atul marked an inline comment as done.Apr 19 2023, 9:16 AM
atul added inline comments.
native/avatars/avatar-hooks.js
116 ↗(On Diff #25318)

Will update

275 ↗(On Diff #25318)

No, will remove

atul updated this revision to Diff 25351.Apr 19 2023, 9:17 AM
atul marked an inline comment as done.

address feedback

This revision was landed with ongoing or failed builds.Apr 19 2023, 9:28 AM
Closed by commit rCOMM3ece4b60c42e: [native] Introduce naive `useSelectFromGalleryAndUpdateUserAvatar` hook (authored by atul). · Explain Why
This revision was automatically updated to reflect the committed changes.
atul added a commit: rCOMM3ece4b60c42e: [native] Introduce naive `useSelectFromGalleryAndUpdateUserAvatar` hook.
Harbormaster completed remote builds in B18514: Diff 25351.Apr 19 2023, 9:35 AM

Revision Contents
Changeset List

PathSize
native/
avatars/
87 lines
9 lines
9 lines

Diff 25357

View Options

native/avatars/avatar-hooks.js

use argon2::Argon2; use argon2::Argon2;
use digest::generic_array::GenericArray; use digest::generic_array::GenericArray;
use digest::Digest; use digest::Digest;
use neon::prelude::*; use neon::prelude::*;
use neon::types::buffer::TypedArray;
use opaque_ke::ciphersuite::CipherSuite; use opaque_ke::ciphersuite::CipherSuite;
use opaque_ke::errors::InternalPakeError; use opaque_ke::errors::InternalPakeError;
use opaque_ke::hash::Hash; use opaque_ke::hash::Hash;
use opaque_ke::slow_hash::SlowHash; use opaque_ke::slow_hash::SlowHash;
use opaque_ke::{ClientRegistration, RegistrationRequest}; use opaque_ke::{
ClientRegistration, ClientRegistrationFinishParameters, RegistrationRequest,
RegistrationResponse, RegistrationUpload,
};
use rand::rngs::OsRng; use rand::rngs::OsRng;
struct Cipher; struct Cipher;
impl CipherSuite for Cipher { impl CipherSuite for Cipher {
type Group = curve25519_dalek::ristretto::RistrettoPoint; type Group = curve25519_dalek::ristretto::RistrettoPoint;
type KeyExchange = opaque_ke::key_exchange::tripledh::TripleDH; type KeyExchange = opaque_ke::key_exchange::tripledh::TripleDH;
type Hash = sha2::Sha512; type Hash = sha2::Sha512;
Show All 17 Lines
struct ClientRegistrationStartResult { struct ClientRegistrationStartResult {
message: RegistrationRequest<Cipher>, message: RegistrationRequest<Cipher>,
state: ClientRegistration<Cipher>, state: ClientRegistration<Cipher>,
} }
impl Finalize for ClientRegistrationStartResult {} impl Finalize for ClientRegistrationStartResult {}
struct ClientRegistrationFinishResult {
message: RegistrationUpload<Cipher>,
}
impl Finalize for ClientRegistrationFinishResult {}
fn client_register_start( fn client_register_start(
mut cx: FunctionContext, mut cx: FunctionContext,
) -> JsResult<JsBox<ClientRegistrationStartResult>> { ) -> JsResult<JsBox<ClientRegistrationStartResult>> {
let password = cx.argument::<JsString>(0)?; let password = cx.argument::<JsString>(0)?;
let mut client_rng = OsRng; let mut client_rng = OsRng;
let client_registration_start_result = ClientRegistration::<Cipher>::start( let client_registration_start_result = ClientRegistration::<Cipher>::start(
&mut client_rng, &mut client_rng,
password.value(&mut cx).as_bytes(), password.value(&mut cx).as_bytes(),
Show All 22 Lines) -> JsResult<JsArrayBuffer> {
let client_registration_start_result = let client_registration_start_result =
cx.argument::<JsBox<ClientRegistrationStartResult>>(0)?; cx.argument::<JsBox<ClientRegistrationStartResult>>(0)?;
Ok(JsArrayBuffer::external( Ok(JsArrayBuffer::external(
&mut cx, &mut cx,
client_registration_start_result.state.serialize(), client_registration_start_result.state.serialize(),
)) ))
} }
fn client_register_finish(
mut cx: FunctionContext,
) -> JsResult<JsBox<ClientRegistrationFinishResult>> {
let client_register_state = cx.argument::<JsTypedArray<u8>>(0)?;
let server_message = cx.argument::<JsTypedArray<u8>>(1)?;
let client_register_state = ClientRegistration::<Cipher>::deserialize(
&client_register_state.as_slice(&cx),
tomekUnsubmitted
Not Done
Inline Actions

Can we avoid shadowing? I think that it reduces maintainability significantly.

tomek: Can we avoid shadowing? I think that it reduces maintainability significantly.
varunAuthorUnsubmitted
Done
Inline Actions

sure!

varun: sure!
)
.or_else(|err| cx.throw_error(err.to_string()))?;
let server_message =
RegistrationResponse::<Cipher>::deserialize(&server_message.as_slice(&cx))
.or_else(|err| cx.throw_error(err.to_string()))?;
let mut client_rng = OsRng;
let client_registration_finish_result = ClientRegistrationFinishResult {
message: client_register_state
.finish(
&mut client_rng,
server_message,
ClientRegistrationFinishParameters::Default,
)
.or_else(|err| cx.throw_error(err.to_string()))?
.message,
};
Ok(cx.boxed(client_registration_finish_result))
}
fn get_registration_finish_message_array(
mut cx: FunctionContext,
) -> JsResult<JsArrayBuffer> {
let client_registration_finish_result =
cx.argument::<JsBox<ClientRegistrationFinishResult>>(0)?;
Ok(JsArrayBuffer::external(
&mut cx,
client_registration_finish_result.message.serialize(),
))
}
#[neon::main] #[neon::main]
fn main(mut cx: ModuleContext) -> NeonResult<()> { fn main(mut cx: ModuleContext) -> NeonResult<()> {
cx.export_function("client_register_start", client_register_start)?; cx.export_function("client_register_start", client_register_start)?;
cx.export_function( cx.export_function(
"get_registration_start_message_array", "get_registration_start_message_array",
get_registration_start_message_array, get_registration_start_message_array,
)?; )?;
cx.export_function( cx.export_function(
"get_registration_start_state_array", "get_registration_start_state_array",
get_registration_start_state_array, get_registration_start_state_array,
)?; )?;
cx.export_function("client_register_finish", client_register_finish)?;
cx.export_function(
"get_registration_finish_message_array",
get_registration_finish_message_array,
)?;
Ok(()) Ok(())
} }
View Options

native/avatars/edit-thread-avatar.react.js

use argon2::Argon2; use argon2::Argon2;
use digest::generic_array::GenericArray; use digest::generic_array::GenericArray;
use digest::Digest; use digest::Digest;
use neon::prelude::*; use neon::prelude::*;
use neon::types::buffer::TypedArray;
use opaque_ke::ciphersuite::CipherSuite; use opaque_ke::ciphersuite::CipherSuite;
use opaque_ke::errors::InternalPakeError; use opaque_ke::errors::InternalPakeError;
use opaque_ke::hash::Hash; use opaque_ke::hash::Hash;
use opaque_ke::slow_hash::SlowHash; use opaque_ke::slow_hash::SlowHash;
use opaque_ke::{ClientRegistration, RegistrationRequest}; use opaque_ke::{
ClientRegistration, ClientRegistrationFinishParameters, RegistrationRequest,
RegistrationResponse, RegistrationUpload,
};
use rand::rngs::OsRng; use rand::rngs::OsRng;
struct Cipher; struct Cipher;
impl CipherSuite for Cipher { impl CipherSuite for Cipher {
type Group = curve25519_dalek::ristretto::RistrettoPoint; type Group = curve25519_dalek::ristretto::RistrettoPoint;
type KeyExchange = opaque_ke::key_exchange::tripledh::TripleDH; type KeyExchange = opaque_ke::key_exchange::tripledh::TripleDH;
type Hash = sha2::Sha512; type Hash = sha2::Sha512;
Show All 17 Lines
struct ClientRegistrationStartResult { struct ClientRegistrationStartResult {
message: RegistrationRequest<Cipher>, message: RegistrationRequest<Cipher>,
state: ClientRegistration<Cipher>, state: ClientRegistration<Cipher>,
} }
impl Finalize for ClientRegistrationStartResult {} impl Finalize for ClientRegistrationStartResult {}
struct ClientRegistrationFinishResult {
message: RegistrationUpload<Cipher>,
}
impl Finalize for ClientRegistrationFinishResult {}
fn client_register_start( fn client_register_start(
mut cx: FunctionContext, mut cx: FunctionContext,
) -> JsResult<JsBox<ClientRegistrationStartResult>> { ) -> JsResult<JsBox<ClientRegistrationStartResult>> {
let password = cx.argument::<JsString>(0)?; let password = cx.argument::<JsString>(0)?;
let mut client_rng = OsRng; let mut client_rng = OsRng;
let client_registration_start_result = ClientRegistration::<Cipher>::start( let client_registration_start_result = ClientRegistration::<Cipher>::start(
&mut client_rng, &mut client_rng,
password.value(&mut cx).as_bytes(), password.value(&mut cx).as_bytes(),
Show All 22 Lines) -> JsResult<JsArrayBuffer> {
let client_registration_start_result = let client_registration_start_result =
cx.argument::<JsBox<ClientRegistrationStartResult>>(0)?; cx.argument::<JsBox<ClientRegistrationStartResult>>(0)?;
Ok(JsArrayBuffer::external( Ok(JsArrayBuffer::external(
&mut cx, &mut cx,
client_registration_start_result.state.serialize(), client_registration_start_result.state.serialize(),
)) ))
} }
fn client_register_finish(
mut cx: FunctionContext,
) -> JsResult<JsBox<ClientRegistrationFinishResult>> {
let client_register_state = cx.argument::<JsTypedArray<u8>>(0)?;
let server_message = cx.argument::<JsTypedArray<u8>>(1)?;
let client_register_state = ClientRegistration::<Cipher>::deserialize(
&client_register_state.as_slice(&cx),
tomekUnsubmitted
Not Done
Inline Actions

Can we avoid shadowing? I think that it reduces maintainability significantly.

tomek: Can we avoid shadowing? I think that it reduces maintainability significantly.
varunAuthorUnsubmitted
Done
Inline Actions

sure!

varun: sure!
)
.or_else(|err| cx.throw_error(err.to_string()))?;
let server_message =
RegistrationResponse::<Cipher>::deserialize(&server_message.as_slice(&cx))
.or_else(|err| cx.throw_error(err.to_string()))?;
let mut client_rng = OsRng;
let client_registration_finish_result = ClientRegistrationFinishResult {
message: client_register_state
.finish(
&mut client_rng,
server_message,
ClientRegistrationFinishParameters::Default,
)
.or_else(|err| cx.throw_error(err.to_string()))?
.message,
};
Ok(cx.boxed(client_registration_finish_result))
}
fn get_registration_finish_message_array(
mut cx: FunctionContext,
) -> JsResult<JsArrayBuffer> {
let client_registration_finish_result =
cx.argument::<JsBox<ClientRegistrationFinishResult>>(0)?;
Ok(JsArrayBuffer::external(
&mut cx,
client_registration_finish_result.message.serialize(),
))
}
#[neon::main] #[neon::main]
fn main(mut cx: ModuleContext) -> NeonResult<()> { fn main(mut cx: ModuleContext) -> NeonResult<()> {
cx.export_function("client_register_start", client_register_start)?; cx.export_function("client_register_start", client_register_start)?;
cx.export_function( cx.export_function(
"get_registration_start_message_array", "get_registration_start_message_array",
get_registration_start_message_array, get_registration_start_message_array,
)?; )?;
cx.export_function( cx.export_function(
"get_registration_start_state_array", "get_registration_start_state_array",
get_registration_start_state_array, get_registration_start_state_array,
)?; )?;
cx.export_function("client_register_finish", client_register_finish)?;
cx.export_function(
"get_registration_finish_message_array",
get_registration_finish_message_array,
)?;
Ok(()) Ok(())
} }
View Options

native/avatars/edit-user-avatar.react.js

use argon2::Argon2; use argon2::Argon2;
use digest::generic_array::GenericArray; use digest::generic_array::GenericArray;
use digest::Digest; use digest::Digest;
use neon::prelude::*; use neon::prelude::*;
use neon::types::buffer::TypedArray;
use opaque_ke::ciphersuite::CipherSuite; use opaque_ke::ciphersuite::CipherSuite;
use opaque_ke::errors::InternalPakeError; use opaque_ke::errors::InternalPakeError;
use opaque_ke::hash::Hash; use opaque_ke::hash::Hash;
use opaque_ke::slow_hash::SlowHash; use opaque_ke::slow_hash::SlowHash;
use opaque_ke::{ClientRegistration, RegistrationRequest}; use opaque_ke::{
ClientRegistration, ClientRegistrationFinishParameters, RegistrationRequest,
RegistrationResponse, RegistrationUpload,
};
use rand::rngs::OsRng; use rand::rngs::OsRng;
struct Cipher; struct Cipher;
impl CipherSuite for Cipher { impl CipherSuite for Cipher {
type Group = curve25519_dalek::ristretto::RistrettoPoint; type Group = curve25519_dalek::ristretto::RistrettoPoint;
type KeyExchange = opaque_ke::key_exchange::tripledh::TripleDH; type KeyExchange = opaque_ke::key_exchange::tripledh::TripleDH;
type Hash = sha2::Sha512; type Hash = sha2::Sha512;
Show All 17 Lines
struct ClientRegistrationStartResult { struct ClientRegistrationStartResult {
message: RegistrationRequest<Cipher>, message: RegistrationRequest<Cipher>,
state: ClientRegistration<Cipher>, state: ClientRegistration<Cipher>,
} }
impl Finalize for ClientRegistrationStartResult {} impl Finalize for ClientRegistrationStartResult {}
struct ClientRegistrationFinishResult {
message: RegistrationUpload<Cipher>,
}
impl Finalize for ClientRegistrationFinishResult {}
fn client_register_start( fn client_register_start(
mut cx: FunctionContext, mut cx: FunctionContext,
) -> JsResult<JsBox<ClientRegistrationStartResult>> { ) -> JsResult<JsBox<ClientRegistrationStartResult>> {
let password = cx.argument::<JsString>(0)?; let password = cx.argument::<JsString>(0)?;
let mut client_rng = OsRng; let mut client_rng = OsRng;
let client_registration_start_result = ClientRegistration::<Cipher>::start( let client_registration_start_result = ClientRegistration::<Cipher>::start(
&mut client_rng, &mut client_rng,
password.value(&mut cx).as_bytes(), password.value(&mut cx).as_bytes(),
Show All 22 Lines) -> JsResult<JsArrayBuffer> {
let client_registration_start_result = let client_registration_start_result =
cx.argument::<JsBox<ClientRegistrationStartResult>>(0)?; cx.argument::<JsBox<ClientRegistrationStartResult>>(0)?;
Ok(JsArrayBuffer::external( Ok(JsArrayBuffer::external(
&mut cx, &mut cx,
client_registration_start_result.state.serialize(), client_registration_start_result.state.serialize(),
)) ))
} }
fn client_register_finish(
mut cx: FunctionContext,
) -> JsResult<JsBox<ClientRegistrationFinishResult>> {
let client_register_state = cx.argument::<JsTypedArray<u8>>(0)?;
let server_message = cx.argument::<JsTypedArray<u8>>(1)?;
let client_register_state = ClientRegistration::<Cipher>::deserialize(
&client_register_state.as_slice(&cx),
tomekUnsubmitted
Not Done
Inline Actions

Can we avoid shadowing? I think that it reduces maintainability significantly.

tomek: Can we avoid shadowing? I think that it reduces maintainability significantly.
varunAuthorUnsubmitted
Done
Inline Actions

sure!

varun: sure!
)
.or_else(|err| cx.throw_error(err.to_string()))?;
let server_message =
RegistrationResponse::<Cipher>::deserialize(&server_message.as_slice(&cx))
.or_else(|err| cx.throw_error(err.to_string()))?;
let mut client_rng = OsRng;
let client_registration_finish_result = ClientRegistrationFinishResult {
message: client_register_state
.finish(
&mut client_rng,
server_message,
ClientRegistrationFinishParameters::Default,
)
.or_else(|err| cx.throw_error(err.to_string()))?
.message,
};
Ok(cx.boxed(client_registration_finish_result))
}
fn get_registration_finish_message_array(
mut cx: FunctionContext,
) -> JsResult<JsArrayBuffer> {
let client_registration_finish_result =
cx.argument::<JsBox<ClientRegistrationFinishResult>>(0)?;
Ok(JsArrayBuffer::external(
&mut cx,
client_registration_finish_result.message.serialize(),
))
}
#[neon::main] #[neon::main]
fn main(mut cx: ModuleContext) -> NeonResult<()> { fn main(mut cx: ModuleContext) -> NeonResult<()> {
cx.export_function("client_register_start", client_register_start)?; cx.export_function("client_register_start", client_register_start)?;
cx.export_function( cx.export_function(
"get_registration_start_message_array", "get_registration_start_message_array",
get_registration_start_message_array, get_registration_start_message_array,
)?; )?;
cx.export_function( cx.export_function(
"get_registration_start_state_array", "get_registration_start_state_array",
get_registration_start_state_array, get_registration_start_state_array,
)?; )?;
cx.export_function("client_register_finish", client_register_finish)?;
cx.export_function(
"get_registration_finish_message_array",
get_registration_finish_message_array,
)?;
Ok(()) Ok(())
} }