From 76cc6f76a8b3352399d86e1f561986ebfad1f071 Mon Sep 17 00:00:00 2001
From: Hailey <me@haileyok.com>
Date: Mon, 3 Jun 2024 13:10:33 -0700
Subject: [PATCH] =?UTF-8?q?[=F0=9F=8F=81=20#5]=20QR=20Code=20Sharing=20(#4?=
 =?UTF-8?q?335)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* add dep

* add some basic styling to QR codes, save to camera roll

* use correct text component

* rm unnecessary wrapper
---
 assets/logo.png                             | Bin 0 -> 10126 bytes
 package.json                                |   1 +
 src/components/StarterPack/QrCodeDialog.tsx |  99 ++++++++++++++++++++
 src/screens/StarterPack/Main/index.tsx      |  94 ++++++++++---------
 yarn.lock                                   |  34 ++++++-
 5 files changed, 183 insertions(+), 45 deletions(-)
 create mode 100644 assets/logo.png
 create mode 100644 src/components/StarterPack/QrCodeDialog.tsx

diff --git a/assets/logo.png b/assets/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..cc2d660341e380d1150b1f86735ac78d8394e87f
GIT binary patch
literal 10126
zcmXY1cRX9~_rDS(s8vOk*rU|e8d0Q1&Dwh_MNu>Mik703mfCyPXsuMOQdOgN%o?$a
zP<wB`^!xe!abK_VoSb{cbMJZ1eV>zPZB1oz(mSL80FbMyDCz<L!2$kifD+?5epH>3
z0Kj9Qs`yCXk6?4g%=1>)_|b0C7)be>gw-Z>y$mRZ+Bmk=kMI`<;OY}T#QhEwvpFF#
zPtE!mb(>%h`c8S?o=|X3vJGJrl4c?>lyIhPVG;T8B9!{;jhhp6GnWTF<_)^4gL?{D
zy+$?n8nLw9Ep$V+L!xwC4X3HoLJddir27qRL7DX|&tJ%eP$gwG<y<Qd#3&d*@%}cr
zoXI6B<!H#NN{P!I*4|C}-NO_7UT+<HF~yfd{EM4Q=GS%kao_dMF?Z~7AEj?musD{7
zdovV0_iK^In;QW5-HWP5_db(s$<Sjr#U}0cRJx~SJxkGu9J1ZuhSQ4TK(zsEQ&D!y
zdjJS+(71UzK$~oOR2WL5hs;(@hNWqwt3XUC5BPo^j)b+?^xhJj_dYeO88R`N(*RH`
z=CmPASP7Bi8UFY)A^wzV|H4t7=?;76uxysU7CL7U4v$)lX}2m#e1WJg^Qcf34LaUK
zTQjLI-nm9|2oc(bkh^T@5rH06UhDuWxBf;W*RjSUf4L|sD^9&g?$LNVbu*$y6HAs1
z*3jQNVvpuX(ceAz>T0ZFLZ>yA08}OM_K4G5JK_1vi?YMcuxz=y?biqD(Myc}Suz1T
z_Y9<g6OMYW!+u)bbgmPgb^SYzw{R<2LwdZ2dF^h)-bU<zb?u}G8p7?nG42|x^v8fa
zWnO~fAiVA3POy9x7!hj!v6wm4=_0$Z_)&@5E!^7c)6BRyMgZW;W)9uT8IFI`RghBq
z{o5A(%HV-a_W|Rh2x|z+kophVhxLj{J-PDzqFRtljq8yQ^#)Ky`!cAgjsN>xDSF0C
z2$Pc%O10uVVLhi4FS$ny98&$M&7y})W_eqE5ywnQ%-!nu0;+mk#*S$pwU7ksGsRLE
z1$XoyeCG~yuh|??csu?-wCG@_#VsaDypv^C&Mj*~gyf~c`}VjjvjqSZKFR7^8BwPZ
zrjjb*VD!My*fejo%O`Vo-70p9n|+x&aTO@E|EhKMM)p(kCtQFPGwyzyH|m)m@Z37*
z8;9D!o36>3jvQ0g(4*6A66S$S-=d-nZ=hA8`|WdBTLNG3F7w&lKvtY)DdqmsUi?Lx
z$r}(#rGEKv`s{MU?v~AL($M1UCq`O$)@HCR12bX*XUWp~lJC+!!jjZtvN_%RCrjuo
zJphemBy%nIZ2M+q;=k0Eo<R%mcL(R2La1Js@%cV+Tbl`AiOiS$b@kwy#)uF3`-XBV
zWt0;PbuD<@L$c4d{QJDBLa@Q1V4FyRF+(oO=+x`7tr<)VXw?&ltkibXG2aSh{?&7C
z6ymp>_@=_yZQ`=T?5x>Ymk<>eT-q~v?>MrtM&6SFH+G+8*2BLuOVT=sAH}x(9S6~0
zwrs4~xGItt>Xix0*=RUiU6wBM27+rUrH*Qqi_eN$wI)+Gu5RMgf_ZjQU^$MAD;w0*
z04~+6R={FuI=j`%Yx0r{Q@cSLB$2G~-G+o2ks`=AmwL4Fy<x*=6|-;qBBbpbje_Kd
z%rswnIZt~S!mM7KOS^6~YjJM<B47R^oU*^;=C?pGVqn^%l56Tg%O*+N-t%=&YdRcP
z9#wI*g$Z71tGGFRQ~l*$H7mkN5R-IfNG152$nEGGU=2=r^%VD%a+?2VIpQOmV34UC
z(x}Gs3ps*(t9CKj;;DnS#*RHh1=erK>`dzsKle)fVdNqriwxkOKk7{i`FS%?QMNSn
znP-d~=2z@Y%h^8fb|V4SI(cF{<2SUprDNsVE>l$sMz&ZmMwY$|^m$d1nC3uNdzbc2
zI;BN*ZTB_FMQZvzyH?1jKW^xFl#mj<D|B);*r-YkepINYm*+fN+VN!5%bD?AMem9P
zTVH{F%|n_FSv63nE0jEsg7ca9X@8viGN;}}%YX*aaV;y6_~@LN35Ci}>@uJ2Balmq
zv~I!(0cHE3ca2wrn(2oNxg(68BIF^}=LSumLd9uYXEkaZZw+iG98N`hoGCu|;!%RJ
zr<RHLr_Ce)Y8mp$ihAX_-l<17FEX>2$2$eRj_|WzYFe{{(84n<2Fkz-r=Fde!jLe*
z`gRj<R@O|BE^k8k3iUby5d4`bwvwuly9Aeq?W8hND5csGfM7Ag1{6Emhnbvx)wjdq
zo^9wi_=dyhBYTA%&KQ%cUOnRm@f$`o!Z=8*g~z<!33sW{@F71XPKzXj!-a1gW6K{m
z+*~n^MkvdK!!b<_!jN&%unHc~=%W&FGh1IZbw`4<xKar?i=%HSoCLYzYpZ~lV`yV~
z>v-Br7;u^bWU!BhjZ?2UYF>9INT+k)7gQ?~hW0%N(ZCbx_11By*Oz%PE&Qu;3HU8u
zEQaL3g}wDF)Z5xNTxzO7>g#Jdd~7f9bh4_{^2D8~f<tvdB!OXuMOXkk!mQ_gDaQ9P
zA$+P`;6*E`S6wl|=Nk1b8iFajPh{>yeDM9GTN`-=_wY~Y&-Ius0qa&n?g1lP-%v#9
zt)7s+cy$4U1b0GdQ-_ulJ0jma)mbminSl%ww#cfdkHbwFtD!G6i{cciS8(dIxHs!0
zS?r_lIop_I(k8y^<P`}0QyZCnslfR|X1w1vTUgo3{@?B(-HcqDidk7h>dYmid1Np$
z-bM1On#cpiUdxb&!CZ*;J=+&7OW{%h56F;Pipn{oAy?+#saWOh=PpY9R~v;8R>;~O
zOQJ?PKIDP=-^ejC7Anf)RKdeM;L=m+R7sC1Ebc0ezUAWdAP=Bs?Gs^5SwP!56T*q}
z$H-hA6>wPFRN*e|(V*PFv4}4B`aE)ijG4?MT~wZ<3_Z>~?~RQ?N`tT;ahQ#)^f&D|
z?jr@-f82#-jYI{NR1jp&{C>w1!rROvf2atLZ*%o6#AKcR5WU9Sg18Akp}1=LjDJUW
zI_12ccyzEOF3wX+KZ*Mxw(}v-#i@Y@#Um&hbmd7W54*D7x$*E1bK*)hFG@}jeXgE+
zuMFweNuIqB3%_`GozLPv&ctj=g+qI}pp3rA;<>L^m|y7)r2kY{SJyiaijbvlRcCVe
z>Ao_M4z|pgR#@$P;8zYW81N83h()jL%x)AvaCYs^Dwgzn!C%)$b`SG$Sbrs4>cYn)
zc4Rs3-G*l-d2pJ{IBpKLO?SUTRh+ujm&rkaQZoCsJHM$XME-||IPz|2@wUf9@*mm-
zM6>~&4}A&4?->md{3c9UGXjM_ZFKL>LMUr*B$c~K4!r(q?(@ZqmQQ|fY!LyG|GDYn
zND1474&{?JpG5x<g$`F>`PPEE3~`RiB`fIjfQW&i2ZSn{Bd2l2cvfqL-O(6g^(9?+
zk59|=mYp>i`Gv#%9w>{<l&VJKd%h}#_s~$>d}(?A#_xOh+*o+JBJGq{0268a8aY5D
z0G%~<^%A2S$D9%2ZO&pl_{VFxeA5@H2m}J}ciW_uk!a%T5I1D|u2F)%?a{kc#;n&$
za=9cF)s1vGbIi*qVP-lnY|H5fVPy?Nfrb=4K4g309ZK~?^F7Cx3Lkog?5-k>z%or|
zs;r><-C^94oC~J8=*T$e5NFE$^m(e!Sq7_^Yc>ouFLyT=uiW_g{U2<mzeUX~u7g6%
zod_27Rf@OVsdesPTl`Ds$j(=y^gZ5Lbnj&R{wOLyvHLW^oE@7Z^29xA`p=mb_6BmL
zfy33d!t6<_KpqK&hn_bmixf7bcYeCh`}^7BGAGpiz*WRkS7P`+_C4sc<)6WWY*s$k
zcT`W@Resb;ZH>R=@`ca5hgO)qeRGc1?_)xUy55>2<3oaA-Blw$>nWw_js_Egy$Y8e
z8wx@H8DqPV72W3I*Ov`+m!SU)JoGIrz5_?|Kob~mx3@^?>di8Zg@|F&R^x6xJ0m||
zTkr_A=jazvM9>k#192(|Ft~z(f#b%`?W6wp`C0JQf0D?}mBG>@d68)e7P5D_N*tfu
z2m?GyTykmFRT9T38`?WU%^P2~3-sY!7E<_>aycwAwT`DYzDe=WysIGxW%+NZFrKf;
z+RibRnhAH!m>T8@T|8xF+xQq573_uBxQLD5n4*W^Hy|wL@<1kxUeb-i91|*dHp!*F
z71Qg_Duq`ETI~<JC(D1<%|#1evI<Mf^xtN-)|B3fm@4F@Xr=d=l|KGR`C4kT)jK9;
zt0OGC`VWQqkIS`J^C4c=VQcoZXNrLNv%!xn>*g4;EeS~SiBlrN;o@G^FJo79&TNLR
zWIi$f-ZAki#$m~d!2IJf^ZD9LZ|D$ZpG2S)fUV*$NRj9eF()?GDF4Xx>~GxptmY(M
zODg|)``-Wb+$gYVvQuuF+7>}&=qDmR%0moo?z=#4Z<2nhw%aJLU1a*_cG7L~X+D~j
zKqejVxXHt#G1KZl_{^~uh^wh>+sqJqPg%0`vqtMv35MaCbhK6HtGK%&d5Nl4a<ILB
zZi-&|A_^|q^EK&Wf>~=R>W+5I9fAIp<*@9x+@M_MxS9vL!Gn&1giaZ1_|Qz5st8=4
zIp?2c54{3LYe(iMOm}Iz#!+wG?@d3hS0bOlmbqB^2J;!ft4IRxWi+$hxYtnR6IViz
zVVc%m4z>^(flV-}Z#x@|%mXg=HS3Aad<V;$yFl{OH&{}QSKvFk)B3o4IVh@MM9Gyc
zc`8f*H>Py7j`+Qi2YxG}v_*Q{Y+VYQ=<Hz+>}UQLx<Ksm*N3$Fu43dA6Fr9NTkryT
z$k!jkO-q87B6DN}RS{zxlSYt$#}O1R0=q@Wle*Gb*R5ZR%^q}6;}B%SmH`f>FvqTe
zbq&Ls$N$o>s#$kNAiG3N_1DHCZJAdtQOBdNqUhfSxUFL<U|QW}Z3d>JmtKs>g*l`B
zf^)?LC>+&I)wi)86knd#Y>}<&<5oeruxMm+Q-#l#BxI^!ssvMXp$>fE*(>sGoC>4B
z9TrUdhBOwBz#L7m>f6X#u!XVoo94$6EoZFKC}MVt00-0!Op-X?fv1`t6DHzz%B+bK
zq){i1`)`X~aIVAOP#WN^V(q~|Z3!Z>#i@XIizX0<aM&0=ubxe6^$_60RDU;<{A$S5
z=!N5N0%t{Ar=>gVglYEI_!Z&PjzJKNbe0H}CI9+9w#X;ft9IqbDA~cC8E@cg?wDSk
z3+y(2)0s;G%KvzSgEvnl05cM=+cD!pgorw1bAF>`u9!J7E<3sT;$**tux+NWcsU!u
znSRc1w2v5YXUJuljG-DR_DZ~iDKJdI;*A|}Q7*c`B}xe{)9eMrJ2qqMJ;-q}tF|`#
z*OOlR*h1oim2&ZW2ceRY6bF3!^^dmDAsoQjzHhVaSJSY68hw{8`~vP~FZ4-an(_y<
z8OrVTGR3F?8C}XCc*a1Qmo-&lqm{87CMg|?l0EenZ;m~o@NKoKU2PquL|TaAz0Hux
z*n0FTQ`$?DgGm^5mS`$bf-&)g5HI{}Udxn%yv}Ph_RJ9-gx$s`ZPF`?S$Vuz;n}O1
zbx43XUTN5k5mse9t13&7??8*c0SvxV{3!0Rq_uJA??Fp0#$WNha+?qW;n@FPoV6dH
zs0F_<&ZGQpbv!z%Y_$5;EroPu2VRdjykdIm-dgp+<-Sia8ew$iOCVfmdFPK~IQU`i
za^;hjAT(mt64?r#5&zYHXMy-{8N~gOuW_E25PbfXc~4E#@=h6boF#*`Bi~<9jD*=B
z1VdXp*Fo4&w&%dkG#{~MpOXKA4##8xz7Sc@eg5RHFQ}Drgd$@ROY3Sr3_AHS;4gRe
zO-R6_YZPxXNauWNlq^HAp_lvBA^}n$aB50KJg$`BN;|{N!;Kl2Uf_&UHkIn^6nW4p
zMqcByk60bYQ|mv(4H})pNA9-~SU!JOOU`$&p#hw5rc9glnb&oVmJASl*FZBTW7m+7
zi-N<S+&}Fli;4Z5rhYQRv$jwl)3KeMFPu>E0}`9=b$5^rX3K7%R-vQY)5JgR_paA0
z%Dh_DSqj5mhYhq#wyI~`$T<CE1qCRRJ`N-BJ7!W4%7BU+`!wvJU^gBDLlM{&h&|8M
z$)%S|lR+L05y*{|4l}TWPn;G-zlIg7Zx!FXJ4Xs!e_|l%jWTL=IMcY}#Ej$W-9mk@
zS*Dd7lbWv-4HO`MKyk1b4M(#OqT)Ma%8+;$oD)sHiVuI2ulry>3ELTe$(Oaxv}3%#
z?Bm>o$g$@EwHg`yPtMDXzs}5z2#(jdz4AYfgPA~`nRLyA%c<ETP9W%h`LMFj{S9Nl
z&#4K2_c@|&W-E;wL*SOiXYo8RlN?p~)!eo2!xz?2%NE=9TLAD@<ISrL#>ruyCm!@)
zR%++~;0|wmA<-t`*~g6{3=;%sUAZ&h`h9m=g{&;l>~Q?=H2@SU<=oGj39*o-ZS1&f
z3;^PZ&pz|lHO;A+E)ERxO3?s7Rd#pZ*D|m2X40ATvhmsH06<lnEQU_9b>5e3BL-Sc
zKQkF*{C16S)hPl4RgWhF48L0Dndz_LdrV^i-mbM)|G&`jNqC>7kE1hy1AqilH_L41
z{};bYSPD6^h~TTk1VHLXtv6tALD*Uae*eyNQg<l;M7iDq-PO@>o)akU$^ZaVOiJUY
zGD+)H9PnZO>z=*1wEPlF1fUL(<4}ppX)fQinRan+^=*7`A2)cw(v-;F2fvc|o56r?
zftES(QEm#tw|FwoWIhMqNqe4(oWb8!hj3Vf0q<_1M`yh`u-~rukT(C;(CM++5#95M
zfhH_{cYN>h%FhaX_&Ju1Q<Z;f<*)bLybHE(OM-!@x04b^zR!SHgpJdBcPF(VfMT(J
z{25jvM?xb)&{ghobV~$pOr+$fU+Wp`tBt(D-q7sqDBWYc+uFQR0?ZCsGlhm-*0g6u
zgOdvT#{;f81VFAW&8g&t_}+Zj*1*SUZmHJ;0MNFSK5w2(?y|#mOm-T2X#6Fli%Sqd
zA@przwP~>4KZP0w>)oPOBpCr#D0lfNWlMO&@{@=VHo5U8_F`R$>$?DO()IduW)a~(
zcD-zoYZeX%TJ<bnH!MH<j~1K7(=Yy`X)Gffmc4V$kl(=o@rr@Ox#%pU5s&Kt;+u-8
zX0uFYW*xyCNsZ34A(<oq5L}hEuR24**7uo}@4){Qy_V-+cc2ddIJMGHf$UgjHN;CY
z<h^VEGmQR*5Fvp2`uwuwWDr+G$o&gZH(>+;zPKzFfA`0Bx2RDC;$qCV%AGGw0bt^F
zf?k~!vtz2+4@2C(z50%iRo4DGfO>MPSok5SNAzXmUC_)^5@w)^db*=xG(HbmT}ksK
z*D99`&w6~{;Pe{~G*edQ?Qe6{x`lU>p1r(hRfz#dzh~Plq$c-_ff-0Jiuw@$=2aF=
zwEk$A>vAMKMd$P#zU8H&YZKZ2>wcgKQ<*$FU2v|Id+*N39)`abOAjDG2hnzuI<dWf
zV>oGW^iUrlDszS>r>p>f8YG5u(&P0z1ZX{W4Gq=;fCcsYzl1m$ar7k<1g!4Skkg1i
z;LA4is!$<~OfWD<Yaf46JIN86*28=XCp>!~IH8WdG3X%y><l%0ID0{A@i&7VW8{9m
zQHFJpVg`txmGA2DqJNhPl~>B={+=JGnM(*PcKWVG0|O4)x8BB-cFNiF=r8@H#xbUw
zCGcPga$kh|*%F@7t+ZX9o79hJK!6Nhjhk6Ci_;t!vp+{z^j`Mq*AR!0`g;IM$pv+7
zf7Gt^jBhpEPa1j<r!V%WgZNwN{8%0TAXp{Y;_>e@Uz&Lb?$$x*jw=;TrmT1*sj1>+
zWn8;X2RJGwA(~`cY=74`&3;vX{*ny?NyfK)(UfxHNf%q65?Itr9=YZGN={yXZ*cj2
zf=9HOsFl70Yh_Eae`<5wycv4kK(bBA&RxGL7n(q_Aj1Tj(W_Y4+TZAQ{W%+=zwTU`
zeX*1sIjgT_xhXs4J9k8KZgb>idrW)OuX25Dfxr#Sc$JNYHpGv4^~iQr%FTJL37yc(
z&2eSaU(afga-&b95tP_ZBeK4s{UJRM7gn-Qmi^X*e6*%EdYjff4IkK{zi&{kWY?cw
z_c^t#dJaAu`u;#jJTP1WLozLF_~7l#oh<rm!&Ukm_d(yk`&cibjB^Kr74(i(Tf`py
zvWvlsk7p{{k#7-Q@)f1q_s|EGGuhu|l8rv!1aQ+SwibNS5_y5#tsp|UV4ClB;L1;5
z`{)<(0OX;MNKgc-iwPuS<9ez&IM6S48v-@Zfsx&tQxk{VPCm3C40vizTd^FtzjehN
zIFI-+pu`*KvLP@QXbL^}WnszBvFy7Nf1a%!0p=}r<<*-sJN<=7nV`l|H~L631ug)5
zYML{{7axas7noT<GB>RnhY$7SnOaTJ?m`qknuI#67_e^xPsL#i)gmBnB+%<H>3oF!
z`8XHiX!us{ovz$1c_u_4w|)7R5qdR5tuDw9dVta&t2fh~qXBRU776r+jeegri5{_H
zWRxFJSX<M)--{C4y5hjd81z3$Ip25--ieeI3EWgBY|4Qm2dh3&w1x^!JkQ_15w=D0
zk_q9y@ynzr4(cOEg#&Z^A|Q;nJ_d!!QsI9=LXRF%<7CQRB}Xcup1^Ltzblk5KnuHz
zo_@;b>3eYlxQVDbjz(-hx{3*5)eFAMBnN(%9WB!}(08&$je|YSVFCo7aO(M%jyEaf
z`l6P-0b}{nls%oe`j*;Y!hl|TgN7FYjAVfI`{)nrU5g|$J1^KVX7UCU0As$X8*SL^
z%M0V}H^XivJp|Ua8=vbqX<RzIt71a5Qo#rgTi!z!`=-58>wEe*@&>LWv%R+P(-r_Q
z&DHv&cNE2SVh=qawjY_D)ky*){u;k@i{d&aZxB36;PL@*Q5G*lbL2*j2^rZi68HwI
zx?Y;tE;-QnLA`jcs<MRv)XaU{n!cU_0&vQulq82|6AG1Vp%qr{EldD$La74!V+bd{
zH)zEnH(rUegP`)(5*Mux3aoiS!9;CLK#+V1{)7;ElnO@0Ll2)hzA?*nYGdsqXq9uy
zdEC%Zf~oYN{GiK13bb0?@0mg54tlKiNu?75Hrh_#{XSWeF@b_R-+BogvVZ`nlFic%
zSC8BQqK!PW6!atkz}BsVRcxq6A$-4tbh!8c(BX;Z*RK%1Puxw92mvbY{X5xmIoxvn
zVr%%%t9}Aj?sd(c^R?$jxQz@jLJ^Ohw8SwE>YKI%K>Je(xol>&`~-7PJe~sb4OHxt
zXG3*qR5j9R19)S}2~m>Er9RC(MtK?QL4*3M8(CmPpPF}_U;Y3m+nNC`J?{#jYSsy;
zJX9rWEFX~aq5yW$4kI~fzc0cI4f6Ex;_#d0!-<m$AJH)2<_C;r0Q}zs0(h7G=^Ib9
z%D=8U1Z79Nry8vH@2F3C9AP;Og#gh#%RUW4Bq|)3q!u9nrC7SnMKC1PfW}e)!o6G9
zZ-OUfu1K?%eelJgcWW2Yn82BgFIe{+PYv1WLv#Or;U*%GxGN<VDo4-yobPPOS!WwR
zYYF(xc@{{Zn_TMl2OZ0`q|44Z@R0s#i{XPK(qJRhhqQHU3#viY#Gr_xusm~1wVj>v
zAOWE~g**+|g18Z>q`!gFEK(qg^4(qnhCPoRQm!vVq^Vh-y?2nuhE<q&D!1A9Zqmyk
z9o$WPlzYC!ay_laTLl%a_jsN!Yt?MTeR#XC0DB>*$cS^5XL?toRWQORXC%<19I8rG
zHEOg=7a(GUvn3cl^chO+ove{|7=B+dxNENfKh6WI@@l1osFnW)6*?(KFlQ%_!br@%
zU_(x&s&i~7Vb6#4KrqDJgYGi3B4Z!OqGB$%T4(Z1^QaVl6VPG9gw@~bu=Q>{Dle{(
zcbJ4lLBl8%l`1K{8jO8bHQ-c<Q5lQH`YbA1X=B^gIijR=Bz(&Fg8VJ4MT{NuK7HM=
zHr?K;cb_myvF~4hIU#@0&Nf|aO{Ldpw<Y?m1m-$#5Ajso#Pxd5*=e%@Jai&G`&3J{
zeQ#+`YvCnbp^Yw+-JA*-KM9I-+>%AyB;9{_nxe>eBzPPR@M@nKJ$G98?1BhqXDPYm
zn|trF3C}d+&kF6aBz*@G2vu!=T8UwBi$39%x)-8L^W0IK^hg6WQOf<cU?EBx^N}Ge
z?xeQHZr~jQC+nU@)I&@uhPwIba=(*zFjB!@lHp~&QZ|VW<ZPppR~|+^^0D02u)O?C
zMlvz3B&%-MeAfho#vZzX+RM5p_m{uZI}B4-pP*T<5UWb0yHk#%f8pr47+QgL)n^Vj
z8&1Gk&g|5mYhFqBKaW!=l<f>n;5b9%z`FC+5kWOWX<t6W69*Wr+dG&yV}q`-YJX&r
zWfbj?b6mWRg3{K>-2;11Q1my`UZ+0J4gE9gpjg~*U;npwI4G8XzCh3r{qTcgt{4f~
z`{%U`Tk!NHsw4p(-q)P(xqNNQO5jw{g6Rttwi%@FRd9QG;h-4<-2HRbpkRKMVWvn)
zJp9O_QB@QT8{p(`&&$B8^=o0J@UZIiw1Cq#DtIx0Ql821*9{7PAj$i?f4Ue}2x^wp
zUcKMNW-KFdT)!fjEd(`??{}xaS&r!t@8UX)Bd2D_Z-`talTVtrHBx=Kho80$)$kxB
zx$)rm?G08r!Rs$9gwQVQ!4$S4BRtN4K{ci3Z4JHt(1h_O2EEl1#Y{3PT64eBY+Qsg
zwk3?})cQX+{0Bi^=0RR;rNL|p)Rb9=KMj1g184EUe(WsZo){E?L(o~9(T1yrjkJwQ
zNfg_MVk-79qatVG{#Gxw%ey4%aEwLLK+LV6l@aS3{np$keen|C71WyK>mE<$VRpbm
zr-z^paoUH5h2pfX@Be_C1AY`PK$shoPLJ#DGDv0l4l7HIRt*zgJ)`T!k9(t%s{z@n
zewlc5(;^$O*bgyPiuWer`0x9XFB!b^3_15~%8)0VdX_D_FnmE=I)bPt&n^&{WleV#
ze4J2^lrVPs{t}TR(NED&Hl~PTi_j*}E3);YIZl78PI$)TJDyzRd!u`Q{Q_hFCpIc$
zDd&A%kI1$9IV?>~tGle86qonm>~6S3OK?GNaP&oekeloVDTXmvmnrt8DO>&$44hjY
zOu~2YO!V-Tusd-usfRGJ0sPDWGuFZs)}lBjRmx0)i4pEH95@=*BEl)1MpYawLl0>2
zD6TC89zeY}q1M4@b<oPJqkh6&3x^(fm)TOUf{@%B>Ri}RX}6%E&#Jq22ijFP!&+WT
z)7c!4Nae)2YUJ1JKkeaC#`T2<?*~8+?wAv`og$HWqm{N3G@k~*dPN0f>yV@Vzib%i
z^qH&yOSUPy6lzK?x}2JnPj-0*D-Y@<wO#zj6?5Hk|6vT6BP-%wPYJWShN)sXzKwjI
z9y4{De*|&0f1vmQKkm^}(~Rkwq`b-Yy5HKFT28J}F=DoTwa>?_=0^C+Q`z;RlHuwk
zuhU<)B_yC`0{C1tZPSO_9*J6q*PY|H?o`7z<=ofQ#0Ucvwv^OMo5JDZc9lV~p;qsR
zrCbJJS_K8oQlMZmJllx5NIMwA8c9yQBEX8N`@@V%k1^MdY<?n;HI#%+i%TaRNUwW^
zaC_vfIs8PFeY9GGiDp6E;K8rmZ>^%@ecPVn-(Z9R>QL`bhL2~UbsDuVm0mH?vG<vE
zN*yFG<7*55=N9z!UDUJWte7s7VRVU9Mw~NrpF%sYE>;cp`&MQzUGl6*yzn+OY?eSC
zmV(4O4E%k%1``YSk2Ln&rs~};MO$ogl<iCLH}kv|-o8y65Lq&sm~3x!4rfWLO1<0m
z4MG^u1wB+uTBlauln`;}Rt@*pf*vr}Lp+POw9`1-2Ao3kHHpX?!o-TM4BmmH3AQL~
zW+{&_fgi4o;+346A|>hCo&Fuh(D9!C5H+h|tk)(3Z9shLC9}*ih`WTx*3PpXx=(-y
z7fm<3xAfvE&sP{d=E{d7;ESGuIentigAudTIIuhAfmVgCL(T)bjSLCVX|2`!2>vf2
zFRZ5P2ZL^J<Wcg6ip$(r*V7_ez^7bC;*i24+ta}j8nmak6_sE%<W+$@OR7JJNjH!1
z1^dW`c2(A38ae1|p8T?533NYCCohm4KWDLTUXKtq5ahgn^(9J=^^vIh-{pcu>s3Wz
zNze?(w_Ktk_f=<-eM1pJsk<~ZY;x|MSQh?<z;N3a1ibxZ3^ucHdJ1Gq<UIDXCiRLX
z8%D-fA>S`E_$Q}8{PW9S-VOycW5>z6RkJmfPjV)l_Ndjjm<zzO3I_XwdAVK>uVn1z
z`mP)fbmzH1GhVJ*I%^Ue<$);SZCKtGxile8*|7McGofh}%WP0v8Nz*=!bTPv=N-`6
zax`)2*@g|&#}VY2GC*x)C7I8`3)L*QKr+IoV$D1pmv6XEvUgstkjpn4@mE8l5R~tv
zD`f>J8ImSN?x4OUUOx<WWIh%moT>KJ2)b`G@bGA!3P)huXzq|2vMhpD^VSkYt92~3
zyom6p32e`paHqzFWjskitM3H96xYDZ$Z3Xt=@W0^)l2gF`p}UufD@~0SIoQvs-u;@
zd_&?MX07jeucU{gt-4mFo~KY|)_$9#b475=gS+q5!qq3)GHDG1mlAlKPo!`>gf<`?
zJKH#{Rch{(e=6XIY;_B#I8wnwn<XXJ&m`x|yVfKjpW8m$YoJq*RbA1DcqV0Ra*5>x
zg}+UVdPs>ELsDc#4x!aVfuowtQ*~Zf!T@&M>+kKJwxHXs_ic~6Kdwi01>S)kwAYJ$
z<G5t+riV+@WG;8w^_3k)s=7*3|50Vf&^&O?Y|2sW7+{z#<f`3Ne8=+^p_OTtuD=}e
zLCEJ@y^ZE*x!%KZHbS_)V0o%WF#QD?vyiJXTfS|U{a=;u$$c&y)n|lkm}*2-?=GQ~
zxUh33dW3dcRb^wz{J`uqH48)e(w`8XTn1n24a}eMyr?*dM%PZLQI+d$^_N{e@zIFV
zduvMqg4LS8ZYtT9DZ!Q(b&5(C-BHdE3{(q(9>=Jer*%oO#od7-T|U7n?D&rQ2*2sh
zrPIrrHT(J}J+omhUES(<k&Z|GI0f$lvj&Mkn(0AX^S^VOj0R~vQuj0`ZiU4e*3*9<
z*1vDk@K=7e<>bW`yQ5Vr_lk~`h>#15VvSe#pV)Om+4|kvm3)5ZMweanfi6w7+|sTm
zLd;8!G+}WA4a)(4_g`}L!KAf<eZ1(X?jGM3dQz40yG=%HA*(^6>|y6n!!_mb$E({C
U`^y*j|JebmN}7rl^42f^4?+A_Y5)KL

literal 0
HcmV?d00001

diff --git a/package.json b/package.json
index c107ea56e4..158b870186 100644
--- a/package.json
+++ b/package.json
@@ -177,6 +177,7 @@
     "react-native-pager-view": "6.2.3",
     "react-native-picker-select": "^9.1.3",
     "react-native-progress": "bluesky-social/react-native-progress",
+    "react-native-qrcode-styled": "^0.3.1",
     "react-native-reanimated": "^3.11.0",
     "react-native-root-siblings": "^4.1.1",
     "react-native-safe-area-context": "4.10.1",
diff --git a/src/components/StarterPack/QrCodeDialog.tsx b/src/components/StarterPack/QrCodeDialog.tsx
new file mode 100644
index 0000000000..d31ef33cb8
--- /dev/null
+++ b/src/components/StarterPack/QrCodeDialog.tsx
@@ -0,0 +1,99 @@
+import React from 'react'
+import {View} from 'react-native'
+import QRCode from 'react-native-qrcode-styled'
+import * as FS from 'expo-file-system'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {nanoid} from 'nanoid/non-secure'
+
+import {saveImageToMediaLibrary} from 'lib/media/manip'
+import * as Toast from '#/view/com/util/Toast'
+import {useTheme} from '#/alf'
+import {atoms as a} from '#/alf'
+import {Button, ButtonText} from '#/components/Button'
+import * as Dialog from '#/components/Dialog'
+import {DialogControlProps} from '#/components/Dialog'
+import {Text} from '#/components/Typography'
+
+export function QrCodeDialog({
+  control,
+  url,
+}: {
+  control: DialogControlProps
+  url: string
+}) {
+  const {_} = useLingui()
+  const t = useTheme()
+
+  // No types for this
+  // See https://github.com/tokkozhin/react-native-qrcode-styled/blob/main/example/src/examples/DownloadQR.tsx for usage
+  const qrCodeRef = React.useRef<any>()
+
+  const onSavePress = () => {
+    qrCodeRef.current?.toDataURL(async (base64Code: string) => {
+      const filename = `${FS.cacheDirectory}/${nanoid(12)}.png`
+      await FS.writeAsStringAsync(filename, base64Code, {
+        encoding: FS.EncodingType.Base64,
+      })
+
+      await saveImageToMediaLibrary({uri: filename})
+      Toast.show(_(msg`QR code saved to your camera roll!`))
+    })
+  }
+
+  return (
+    <Dialog.Outer control={control}>
+      <Dialog.Handle />
+      <Dialog.ScrollableInner
+        label={_(msg`Create a QR code for a starter pack`)}>
+        <View style={[a.flex_1, a.align_center, a.gap_3xl]}>
+          <Text style={[a.font_bold, a.text_xl, a.text_center]}>
+            Share this starter pack with friends!
+          </Text>
+          <View style={[t.atoms.bg_contrast_25, a.rounded_md]}>
+            <QRCode
+              data={url}
+              style={[{height: 200, width: 200}]}
+              pieceSize={8}
+              padding={20}
+              // pieceLiquidRadius={2}
+              pieceBorderRadius={4.5}
+              outerEyesOptions={{
+                topLeft: {
+                  borderRadius: [12, 12, 0, 12],
+                  color: t.palette.primary_500,
+                },
+                topRight: {
+                  borderRadius: [12, 12, 12, 0],
+                  color: t.palette.primary_500,
+                },
+                bottomLeft: {
+                  borderRadius: [12, 0, 12, 12],
+                  color: t.palette.primary_500,
+                },
+              }}
+              innerEyesOptions={{borderRadius: 3}}
+              logo={{
+                href: require('../../../assets/logo.png'),
+                scale: 1.2,
+                padding: 2,
+                hidePieces: true,
+              }}
+              ref={qrCodeRef}
+            />
+          </View>
+          <Button
+            label={_(msg`Save QR code`)}
+            variant="solid"
+            color="primary"
+            size="medium"
+            onPress={onSavePress}>
+            <ButtonText>
+              <Trans>Save QR code</Trans>
+            </ButtonText>
+          </Button>
+        </View>
+      </Dialog.ScrollableInner>
+    </Dialog.Outer>
+  )
+}
diff --git a/src/screens/StarterPack/Main/index.tsx b/src/screens/StarterPack/Main/index.tsx
index d4bf8b8274..48d1572eac 100644
--- a/src/screens/StarterPack/Main/index.tsx
+++ b/src/screens/StarterPack/Main/index.tsx
@@ -1,22 +1,25 @@
 import React from 'react'
-import {Text, View} from 'react-native'
+import {View} from 'react-native'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {NativeStackScreenProps} from '@react-navigation/native-stack'
 
 import {CommonNavigatorParams} from 'lib/routes/types'
+import {shareUrl} from 'lib/sharing'
 import {isWeb} from 'platform/detection'
 import {PagerWithHeader} from 'view/com/pager/PagerWithHeader'
 import {ProfileSubpageHeader} from 'view/com/profile/ProfileSubpageHeader'
-import {EventStopper} from 'view/com/util/EventStopper'
 import {CenteredView} from 'view/com/util/Views'
 import {FeedsList} from '#/screens/StarterPack/Main/FeedsList'
 import {ProfilesList} from '#/screens/StarterPack/Main/ProfilesList'
 import {atoms as a} from '#/alf'
 import {Button, ButtonText} from '#/components/Button'
+import {useDialogControl} from '#/components/Dialog'
 import {ArrowOutOfBox_Stroke2_Corner0_Rounded as ArrowOutOfBox} from '#/components/icons/ArrowOutOfBox'
 import {QrCode_Stroke2_Corner0_Rounded as QrCode} from '#/components/icons/QrCode'
 import * as Menu from '#/components/Menu'
+import {QrCodeDialog} from '#/components/StarterPack/QrCodeDialog'
+import {Text} from '#/components/Typography'
 
 /**
  * TEMPORARY CONTENT, DO NOT TRANSLATE
@@ -140,6 +143,7 @@ function StarterPackScreenInner() {
 
 function Header({isOwn}: {isOwn: boolean}) {
   const {_} = useLingui()
+  const qrCodeDialogControl = useDialogControl()
 
   return (
     <>
@@ -152,48 +156,48 @@ function Header({isOwn}: {isOwn: boolean}) {
         creator={undefined}
         avatarType="starter-pack">
         <View style={[a.flex_row, a.gap_sm]}>
-          <EventStopper onKeyDown={false}>
-            <Menu.Root>
-              <Menu.Trigger label={_(msg`Repost or quote post`)}>
-                {({props}) => {
-                  return (
-                    <Button
-                      label={_(msg`Share`)}
-                      variant="solid"
-                      color="primary"
-                      size="small"
-                      {...props}>
-                      <ButtonText>
-                        <Trans>Share</Trans>
-                      </ButtonText>
-                    </Button>
-                  )
-                }}
-              </Menu.Trigger>
-              <Menu.Outer style={{minWidth: 170}}>
-                <Menu.Group>
-                  <Menu.Item
-                    label={_(msg`Share link`)}
-                    testID="shareStarterPackLinkBtn"
-                    onPress={() => {}}>
-                    <Menu.ItemText>
-                      <Trans>Share link</Trans>
-                    </Menu.ItemText>
-                    <Menu.ItemIcon icon={ArrowOutOfBox} position="right" />
-                  </Menu.Item>
-                  <Menu.Item
-                    label={_(msg`Create QR code`)}
-                    testID="createQRCodeBtn"
-                    onPress={() => {}}>
-                    <Menu.ItemText>
-                      <Trans>Create QR code</Trans>
-                    </Menu.ItemText>
-                    <Menu.ItemIcon icon={QrCode} position="right" />
-                  </Menu.Item>
-                </Menu.Group>
-              </Menu.Outer>
-            </Menu.Root>
-          </EventStopper>
+          <Menu.Root>
+            <Menu.Trigger label={_(msg`Repost or quote post`)}>
+              {({props}) => {
+                return (
+                  <Button
+                    label={_(msg`Share`)}
+                    variant="solid"
+                    color="primary"
+                    size="small"
+                    {...props}>
+                    <ButtonText>
+                      <Trans>Share</Trans>
+                    </ButtonText>
+                  </Button>
+                )
+              }}
+            </Menu.Trigger>
+            <Menu.Outer style={{minWidth: 170}}>
+              <Menu.Group>
+                <Menu.Item
+                  label={_(msg`Share link`)}
+                  testID="shareStarterPackLinkBtn"
+                  onPress={() => {
+                    shareUrl('https://bsky.app')
+                  }}>
+                  <Menu.ItemText>
+                    <Trans>Share link</Trans>
+                  </Menu.ItemText>
+                  <Menu.ItemIcon icon={ArrowOutOfBox} position="right" />
+                </Menu.Item>
+                <Menu.Item
+                  label={_(msg`Create QR code`)}
+                  testID="createQRCodeBtn"
+                  onPress={qrCodeDialogControl.open}>
+                  <Menu.ItemText>
+                    <Trans>Create QR code</Trans>
+                  </Menu.ItemText>
+                  <Menu.ItemIcon icon={QrCode} position="right" />
+                </Menu.Item>
+              </Menu.Group>
+            </Menu.Outer>
+          </Menu.Root>
           {isOwn && (
             <Button
               label={_(msg`Edit`)}
@@ -214,6 +218,8 @@ function Header({isOwn}: {isOwn: boolean}) {
           started with the science community on Bluesky!
         </Text>
       </View>
+
+      <QrCodeDialog control={qrCodeDialogControl} url="https://bsky.app" />
     </>
   )
 }
diff --git a/yarn.lock b/yarn.lock
index ae18bfbec6..84b45442e7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11021,6 +11021,11 @@ diff@^4.0.1:
   resolved "https://registry.yarnpkg.com/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d"
   integrity sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==
 
+dijkstrajs@^1.0.1:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/dijkstrajs/-/dijkstrajs-1.0.3.tgz#4c8dbdea1f0f6478bff94d9c49c784d623e4fc23"
+  integrity sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==
+
 dir-glob@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f"
@@ -11286,6 +11291,11 @@ emojis-list@^3.0.0:
   resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
   integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==
 
+encode-utf8@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/encode-utf8/-/encode-utf8-1.0.3.tgz#f30fdd31da07fb596f281beb2f6b027851994cda"
+  integrity sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==
+
 encodeurl@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
@@ -17676,6 +17686,11 @@ pngjs@^3.3.0:
   resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-3.4.0.tgz#99ca7d725965fb655814eaf65f38f12bbdbf555f"
   integrity sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w==
 
+pngjs@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-5.0.0.tgz#e79dd2b215767fd9c04561c01236df960bce7fbb"
+  integrity sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==
+
 pofile@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/pofile/-/pofile-1.1.4.tgz#eab7e29f5017589b2a61b2259dff608c0cad76a2"
@@ -18632,6 +18647,16 @@ qrcode-terminal@0.11.0:
   resolved "https://registry.yarnpkg.com/qrcode-terminal/-/qrcode-terminal-0.11.0.tgz#ffc6c28a2fc0bfb47052b47e23f4f446a5fbdb9e"
   integrity sha512-Uu7ii+FQy4Qf82G4xu7ShHhjhGahEpCWc3x8UavY3CTcWV+ufmmCtwkr7ZKsX42jdL0kr1B5FKUeqJvAn51jzQ==
 
+qrcode@^1.5.1:
+  version "1.5.3"
+  resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.5.3.tgz#03afa80912c0dccf12bc93f615a535aad1066170"
+  integrity sha512-puyri6ApkEHYiVl4CFzo1tDkAZ+ATcnbJrJ6RiBM1Fhctdn/ix9MTE3hRph33omisEbC/2fcfemsseiKgBPKZg==
+  dependencies:
+    dijkstrajs "^1.0.1"
+    encode-utf8 "^1.0.3"
+    pngjs "^5.0.0"
+    yargs "^15.3.1"
+
 qs@6.11.0:
   version "6.11.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.11.0.tgz#fd0d963446f7a65e1367e01abd85429453f0c37a"
@@ -18927,6 +18952,13 @@ react-native-progress@bluesky-social/react-native-progress:
   dependencies:
     prop-types "^15.7.2"
 
+react-native-qrcode-styled@^0.3.1:
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/react-native-qrcode-styled/-/react-native-qrcode-styled-0.3.1.tgz#be6a0fab173511b0d3d8d71588771c2230982dbf"
+  integrity sha512-Q4EqbIFV0rpCYcdmWY51+H8Vrc0fvP01hPkiSqPEmjjxhm6mqyAuTMdNHNEddLXZzCVQCJujvj6IrHjdAhKjnA==
+  dependencies:
+    qrcode "^1.5.1"
+
 react-native-reanimated@^3.11.0:
   version "3.11.0"
   resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-3.11.0.tgz#d4265d4e0232623f5958ed60e1686ca884fc3452"
@@ -22480,7 +22512,7 @@ yargs-parser@^21.1.1:
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-21.1.1.tgz#9096bceebf990d21bb31fa9516e0ede294a77d35"
   integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==
 
-yargs@^15.1.0:
+yargs@^15.1.0, yargs@^15.3.1:
   version "15.4.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-15.4.1.tgz#0d87a16de01aee9d8bec2bfbf74f67851730f4f8"
   integrity sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==