Subscribe
Share
Share
Embed
Each week Adam & Ste focus on a specific feature, idea or prototype in Hardcover and iterate on it together or with guests.
Adam (00:01.058)
Hey, hey, stay, how's it going?
Ste (00:03.445)
Adam, pretty good, pretty good. Having a very busy week. I had some friends over last week, so it's been very, very intense. And yeah, this week taking it a bit easy, but yeah, lots of work. How about you?
Adam (00:24.471)
Mostly just working on hardcover stuff and preparing for our house purchase. yeah, your friends that were in town, were they staying with you or were they like staying nearby or?
Ste (00:37.345)
Yeah, they came from London and they had their parents come from Italy. So they met in Paris and they were staying at us, their parents like somewhere close by. So yeah, it was like every night, know, the usual entertainment. And we ended up visiting like lot of places together as well.
And that was like pretty fun. Yeah, found plenty of stuff found the Japanese store Close by and let me see. Here we go Okay, okay Okay, yeah, I got like I think what what is my smallest toy in my collection let me fetch that as well
Adam (01:15.433)
No.
Very cute.
Ste (01:25.611)
So everyone can see it. this is like, this is like, I, I'm, I was trying to go like really, really like as small as possible. So here we go. No, wait, let me turn it around. So this is a good luck cat. Look at this. It's a ceramics good luck cat. Yeah. Smallest one I could find. Yeah. Really proud of this. Let me put it here. So yeah.
Adam (01:40.386)
Yeah.
Adam (01:50.274)
Very, very tiny.
Ste (01:54.392)
Yeah, and apart from that, so, you know, going out drinking the usual. Yeah. And how about you? So the house is going through.
Adam (02:02.584)
Hopefully, we're, like next week is potentially when we will be closing on it. So if things go well, then by the end of next week, we'll be homeowners, which is scary to think. But yeah, it's an older house from 1898, but still in great shape. So it's not like a, we're not gonna have to do a lot of fixing up of stuff, just like minor.
Ste (02:04.053)
Okay.
Adam (02:32.032)
minor stuff. But yeah, we're still like working out the details, but I'm optimistic. Yeah. And right now, let me share my screen for a second. We had like some of the first snow of the year.
Ste (02:33.859)
that's good.
Ste (02:40.181)
Okay, that's good. Yeah.
Adam (02:54.422)
So let me see if I can zoom in.
Ste (02:57.562)
here are the mountains, is that your view?
Adam (02:59.822)
Yeah, this is the view from our our porch. Our deck or balcony balcony. Yeah. It's like it's.
Ste (03:03.637)
why?
Ste (03:07.863)
Wow, look at that. I never saw that. This is like what Salt Lake is like, Salt Lake City.
Adam (03:15.254)
Yeah, cause this is like facing east. And so since this is a panoramic, like this is east and then by here, this is like Northeast and then up here is like North. So it's like kind of wrap around like a, is like the corner, but yeah, over here is where.
Ste (03:19.863)
Mm, thank you.
Ste (03:32.725)
Yeah, those are some serious mountains and some serious snow.
Adam (03:37.804)
Yeah, over here where like the ski resorts are like closer to like down in these valleys.
Ste (03:44.459)
Nice.
Adam (03:46.03)
Yeah, so that's been neat. It's finally starting to get like on the cold side, like zero degrees Celsius, 30 degrees Fahrenheit most days.
Ste (04:00.042)
That's exciting, I'm guessing, first of all, like...
Adam (04:02.688)
Yeah, but still no snow on the ground in the city itself, because the city is a little bit warmer than the mountains. But, I have a feeling within the next couple of weeks, we're, we'll, we'll see some snow on the ground.
Ste (04:07.939)
Hmm.
Ste (04:14.987)
Yeah, it's crazy. Last week we had like a huge snow flurry in Paris. So it snowed all day long. It was the first day my friends came in and it was like literally it even like got on the ground and you couldn't walk because there was like so much snow and there's like jumbo size snowflakes. put some short video on blue sky of how it was like snowing from my apartment and that was like the beginning of it. It got like even more like
powerful than that so that was like pretty unusual I think it didn't snow like that here for in the past like five or six years but especially in November so yeah we had our own bit of snow that was fun I took Jonah like we took him out in the park and he was he was that interested in the snow
Maybe it's not his thing, but yeah, it was really fun to witness that. like, yeah, a rare event here.
Adam (05:16.536)
Did it stick around very long or did it kind of melt?
Ste (05:21.309)
No, next day it was like spring and we had 17 degrees Celsius on Sunday so it was like sunny and bright spring all over again. That went pretty fast.
Adam (05:35.693)
yeah, like 62 Fahrenheit. Yeah, that's nice and warm.
Ste (05:38.448)
Yeah, yeah, proper like spring, spring vibes.
Yeah, nice. And we've been busy on the hardcover side as well.
Adam (05:52.374)
Yeah, yeah, I finally started moving. Like I've been making my way through all the different pages under like slash at username on the app. like for instance, like everything that's like, this is slash Adam, but everything here and past it. So all these tabs.
And how we finally added like your like mini header. So it's like, you know, when you're on all these pages, it's like the mini version of the header. And then when you're on the main page, it's like the big header.
Ste (06:34.221)
Here we go.
Ste (06:39.661)
There you go, the big one. Nice.
Adam (06:45.23)
Yeah. The one thing I'm wondering is about like color. What is it like visibility of the text on these backgrounds, which could be anything. I know we're doing like some overlay of like a black that gives us at least some degree. Do think that'll be plenty to have a good contrast?
Ste (07:07.754)
Mm-hmm.
Ste (07:12.969)
Well, yeah, that's not the best contrast for the description. was even thinking like we could, so one option would be to keep the mini header and to actually like have that data under at, at Adam. So that would be like your profile info. And it would have more space as well. Over there, the layout was kind of, yeah. So you basically have like that, that tab and
under at Adam, you'd have your bio, your links, and everything. So that's one option. But we could also do some SVG magic in the background. I know Letterboxd does these faded covers as well. And I think there's
Maybe it has the name and the profile picture definitely over the... We can check. I'd be actually curious to see how they handle it. On mobile, it's a bit better, but yeah, I don't know. Would you be up for moving the info under the tab, or do you feel like it's more natural up there?
Adam (08:36.024)
think it's more natural up there. Like I was thinking about how like blue sky handles theirs. And it's like, you know, they kind of just do a profile image and, it's, this is much less of like a big poster image and more of a, just like, you know, it's very, very segregated. There's no text on it. So we're trying to do something much more visual here, but.
Ste (08:45.953)
Hmm. Yes.
Ste (08:59.052)
Yeah.
Ste (09:03.627)
Yeah, we could do something similar to that and have that break even more sudden because now we're doing a pretty smooth gradient. I'm thinking the gradient could be more compressed. You'd see less of the cover image, but I think there are ways to go around that.
Maybe even move the info further down because you're on desktop and you you're going to scroll either way. So I don't mind it being like leather box again has like that's huge. think it takes up like half of the screen at least on desktop for profiles that have it's almost like rectangular, like squareish rectangular. So ours is like really long, but yeah.
Adam (09:55.354)
we kind of solve it on mobile where it's like, you know, this text is already beyond the fade and same with on like tablet size. It's kind of just a little bit above the fade, but yeah, it's only when it's on desktop. So yeah, we could just move it all down a little bit.
Ste (09:58.347)
Mm-hmm.
Yep.
Ste (10:08.383)
Mm-hmm. Yeah. Once is... Yeah, yeah, exactly. Once it's done, I can come in and do some fine tuning and small tweaks to it. Maybe even rearrange some of the data because now it's really wide. So maybe we can split stuff into columns and have other things in there maybe.
Adam (10:35.532)
Another option is doing like something like this behind it.
Ste (10:39.401)
yeah, that could also work. mean, it takes like a little bit from the... Actually it doesn't because yeah, that could also work and it would be like consistent with the list page as well.
Adam (10:56.63)
Yeah, if it like went, it would kind of have to go all the way around this entire part.
Ste (11:03.295)
Yeah, we could try that. I mean, let's do some like tweaks and see what looks better. I think just like trial and error at this point will get us to the right solution. It's looking great. I mean, the mini header is very good.
Adam (11:24.301)
Yeah.
Adam (11:30.198)
Yeah. And go ahead.
Ste (11:31.991)
We can also like
Yeah, animate it and maybe have that transition. I'm not sure how. Yeah.
Adam (11:39.872)
Yeah, was thinking that like you can use framer motion and give like this image like an ID and then you give this image an ID and then it can like transition between them. Like I think like we could do that with the name and the name would like move with those two things and even the flare if we wanted to.
Ste (11:47.437)
Mm-hmm.
So yeah.
Mm-hmm.
Ste (12:06.999)
Yeah, that would be nice.
Adam (12:11.756)
Yeah, think that would be fun. I was originally playing with that idea, like whenever you're on, like in the early days of hardcover, whenever you're clicking on a book and it goes to that book page, like moving this image and having it move over to the...
Ste (12:27.86)
over there.
Ste (12:34.753)
That'd be nice. I think now they made some CSS transitions that even without framework motion, they could work like that. I'm not sure how they work with React. I've seen some like raw, like CSS and JavaScript layouts that use that. And I'm not sure it's support by all browsers, but maybe you can try again with framework motion.
It supports like different going from one page to the other because this does this change the URL? No, it doesn't. Right.
Adam (13:16.651)
It will, yeah.
Ste (13:18.608)
it will. Yeah. Yeah. Here we go. But it should be able to do that transition, right?
Adam (13:25.1)
Yeah, yeah, I think so. Yeah, it's the new transition API. I've seen some videos about it, but I haven't tried working with it or checked out it's like, what is it? CanIUse.com. I don't know what it's called though. It's not transition. It's like, view transitions. This is probably it.
Ste (13:30.241)
Yeah.
Ste (13:49.036)
here we go, Limited availability.
Adam (13:53.244)
So it's in 74 % of browsers right now. yeah, maybe, yeah, Firefox for Android is not on it. Neither is IE. Like, or no, that's.
Ste (13:57.501)
Okay. Yeah. Firefox. Wow. I, okay. We can ignore that.
Adam (14:07.338)
is no it's in edge though that's okay but it's not in firefox yeah not in firefox's
Ste (14:11.007)
Okay. Yeah. Yeah. Firefox is like, I think we have like a few issues with Firefox right now as well. But I think framework motion might like do the trick.
Adam (14:19.878)
yeah.
Adam (14:26.744)
I think so. Yeah. And I think the other one I've been working on is like we did some improvements on goals. So this is kind of the forum as it stands today.
Ste (14:40.311)
Yeah.
Ste (14:47.074)
Yeah.
Adam (14:47.458)
So you can select read, listen to, or both. And then these options from here down are new. So you can set the type of book it is. So like book or graphic novel or collection, short story, the gender of the author, whether you want to filter for BIPOC authors or not, and whether you want to filter for
Ste (14:50.476)
I mean...
Adam (15:16.438)
LGBTQIA plus authors or not.
Ste (15:20.119)
Yeah, that's great. Those options are great. They've been appreciated on our Discord, rightly so. This is looking great. mean, once the inertia branch is in, I'll just go and maybe style some of the, just move stuff around, do like tweaks on the fields. Else it's looking great.
Adam (15:43.822)
See
Adam (15:49.198)
I think the other one is like, you can say hours. And yeah, everything else is pretty much the same, pretty much all the way across all of the profile stuff. No real notable feature changes other than this goal one.
Ste (16:07.199)
Nice. Yeah, the goals were like due for an update. It's good that you took the occasion right now to add those options.
Adam (16:22.232)
Yeah, it was nice to get that in.
Ste (16:25.996)
Yeah, how was it like compared to our current setup? mean, what influenced it being easier or harder?
Adam (16:37.792)
I think one of the big things is that, when you're looking at the goal itself, all of this data is kind of in a JSON object that's attached to the goal object that contains kind of like the filters you want to apply to the goal. And,
Now those same filters are able to be fed in to the letter books list here. So the same filters that we have here are ones that we'll be able to have as filters on any letter box or letter list of books. So that's kind of the initial setup for it. Although, you know, there's not the UI components to actually like add those filters here, but behind the scenes,
whenever we have a list of books, we'll be able to filter them in the same way.
Ste (17:36.179)
nice. Well, the UI is the easy part, I guess, so we can always add that in. Nice. That's perfect. Yeah. we can do so much with that. I mean, yeah, this opens up like filtering has been mentioned by lots of readers in the Discord. So it's going to be nice to be able to finally use that to its fullest extent.
Adam (18:04.8)
Yeah, and as part of this, moved like all all places where there's like a list of books somewhere, well, pretty much all places, not everywhere, like not trending. But pretty much everywhere there's a list of books, it'll use this letter books section, which kind of gives more flexibility. And I think this is going to be really helpful later because like if you're looking at say,
like a comic book series, and we're gonna have like a bulk edit mode. So you would be able to look at a comic book series, select all, and then change all of them to be like book type graphic novel. You won't have to go into each one. It'll be like part of the bulk edit option here in the series page.
Ste (18:48.557)
Yeah.
Ste (18:54.892)
That's gonna be nice.
Adam (18:57.72)
Yeah, I think the thing most curious to talk about today is stats.
Ste (19:04.055)
Here we go. Woohoo. wow. This is actually working.
Adam (19:05.166)
Starting to come together. Yep. I've only done two here.
Ste (19:15.873)
Wow, okay, that's already like... look at that! Hey, the books are loading!
Adam (19:21.656)
Yep.
Ste (19:23.756)
Here we go.
Wow 320k pages read
Adam (19:33.996)
Yeah. And this definitely made me realize how many books I haven't marked correctly as like audio. So. Yeah.
Ste (19:42.392)
yeah, right. You definitely like listen to more books like just by us talking together I can like figure.
Adam (19:47.278)
You
Adam (19:51.198)
Yeah, so this will be a good incentive for me to go back and correctly label most things. And I changed this from minutes listened to hours listened.
Ste (20:00.848)
yeah, did I have minutes? Yeah, that didn't make any sense.
Adam (20:04.248)
And I know we were talking about adding like one other one here, but I had forgotten what it was. I know we talked about it in the last live, so you could probably listen.
Ste (20:09.475)
I looked at the live and I couldn't find it. just went through every moment. I think we edited it in or talked about it, but it must have been like, yeah, I have to see the transcript though. Maybe I'll put the transcript in chat GPT and just ask it where it is or just read through it. Yeah, we had another one, but yeah, I couldn't remember why this.
Adam (20:29.166)
you
Ste (20:37.417)
If we have any listeners who can't remember, we have the recording though.
Adam (20:45.358)
See ya.
Ste (20:45.481)
Wow, it's so nice to see this with all the covers.
Adam (20:50.252)
And I think if you change this to like 2020, it does some of it. Like it didn't change books read, cause I realized that one I'm fetching from a different place, but all the rest of it, or except librarian edits, but all the rest of it except librarian edits and books.
Ste (20:59.209)
works as well well that was the hard part yeah
Adam (21:16.878)
Maybe inspired, except those three. So yeah, it's at least passing all these, it's passing the date range into the Ruby side to do these calculations.
Ste (21:16.931)
Those are minor details.
Ste (21:30.957)
Nice.
Adam (21:34.498)
Yeah. I haven't tried custom yet, so let's see. So from.
Ste (21:35.651)
Well, here we go.
Ste (21:41.547)
Yeah, I'm not sure how that works. mean, I think we're supposed to change the calendar, component as well. So it doesn't say started or ended today, but.
Adam (21:43.19)
June 1st to...
Adam (21:49.219)
Huh?
Adam (21:53.605)
yeah. But yeah, that's, that seemed to work. It seems like things I've been reading in the last couple of months.
Ste (22:01.962)
Okay.
Adam (22:04.856)
Yeah, it's a lot more to do, but I was wondering when I was getting these books for here, I was wondering, like, so I think what I'm doing right now is I am getting all the books that you've read during this period. I'm sorting them by your rating. So it's the highest rated ones first. And then
I am filtering down for ones that have a book cover. And then I'm getting the first hundred of those and shuffling them. like putting them in no specific order. So it's, it's your top, it's random ratings from your top hundred books sorted by rating. So if you have more than a hundred books that are five stars, it's only going to find
Ste (22:42.046)
Nice.
Adam (23:05.326)
the top hundred and show. was thinking like, you know, have the load more part and I didn't want to send over what could be like 20,000 book objects here. Just so that there's some limit. So I think it sends like a hundred total.
Ste (23:20.173)
Yeah.
Yeah, that looks, I mean, that looks good. That's like just like a snippet. So I don't know if people would be interested to view like 1000 books. mean, a hundred. It always, it looks like really nice to see them like laid out like this. And the use cases will probably be like monthly. So monthly or like past three months or like.
Adam (23:35.629)
You
Ste (23:53.079)
the past year. So I'm guessing, you know, 100 books per year is like, don't know how close it would be to the hardcover average, but it seems like what some like really prolific readers might have more than a hundred per year. Yeah. And for all time.
I know if it's worth showing more than that. If we put like a... If we fetch more, can we fetch like after you load the first 100?
Adam (24:31.312)
I'm trying to do this in a way where there's not additional data loaded. Everything's kind of sent down on the initial pass. But if we have to...
Ste (24:39.523)
Well, I think then 100 is, it's a visual thing more than anything.
Adam (24:44.662)
Yeah, and we could say how many are in a row here? Three, six, nine.
Ste (24:50.541)
I think it's 20 or 20.
Adam (24:57.038)
22, yeah, 22 per row. So maybe instead of 100, we just do like.
Ste (24:58.467)
22. Okay.
Adam (25:03.694)
22 times 5.
Ste (25:07.114)
yeah 110
Adam (25:11.042)
Yeah.
Ste (25:12.095)
Is it? Is it? Yeah, it should be.
Adam (25:17.675)
I turned to caching off too. I had it cached, which meant everything was loading really, really fast. Now it's actually hitting the database.
Ste (25:26.145)
Nice.
Adam (25:28.61)
Yeah, yeah, and maybe how many should we show initially? Like 22 would be one row, so we could just show.
Ste (25:39.597)
Yeah.
Ste (25:43.395)
Yeah, I initially had them like 22 by 22, so if you hit like the button...
Adam (25:47.811)
Yeah.
Ste (25:51.613)
nice. Yeah. It's great when they just line up like that.
Adam (25:52.588)
It's pretty satisfying.
Adam (26:00.027)
Yeah. It feels like, yeah, it, it looks, it looks really cool now.
Ste (26:07.553)
Yeah, yeah, I love that canvas.
Adam (26:09.654)
And I'm sure like, yeah, and it resizes nicely.
Ste (26:15.925)
Nice.
Adam (26:20.654)
Yeah, I haven't done this top percent part, but I think we said that'll only show up if we're looking at your all time part, and then it'll just hide it otherwise.
Ste (26:29.687)
Mm-hmm.
Yeah, would be like impossible to calculate, probably.
Adam (26:37.685)
Yeah, that would be a, especially if we're calculating like dozens of those for a date range, then it's like might as well like go make a lunch while the page loads.
Ste (26:44.365)
Yeah.
Ste (26:50.841)
Yeah, exactly.
Adam (26:55.816)
Sweet. Well, let's see. So we only can really talk about these two because they're the only ones I've really done so far.
Ste (27:06.517)
Yeah, well, these are looking great. I'll try to think about what we added as the eighth thing just to make it nice and even. And...
Ste (27:20.917)
The total books read looks great. How is it if you turn on monthly? I think like I made it, I made the covers adapt. So for instance, if you read like two books last month, it should be like, okay. So we'd get, yeah, here we go. Perfect. Nice.
Adam (27:34.382)
you
Adam (27:38.592)
Yeah, I liked that it scaled the covers accordingly. Like if you have fewer than, yeah, it's like if you have fewer than 20, fewer than five, fewer than 10, fewer than 20, it's like all these different breakpoints.
Ste (27:55.093)
No, that's good. How was the code by the way? was it like, I thought it was like pretty messy in parts, but I don't know how did it end up being.
Adam (28:06.636)
So far for these, it's been easy enough to work with. I think there are, I'm still just getting into it, but yeah, I think one part that's been really nice is that if I share my.
Ste (28:10.615)
Okay.
Adam (28:29.099)
screen here.
Ste (28:32.695)
Now here we go.
Adam (28:33.998)
Like one part that's been really nice is, so this is the overall page that has like all of the different, each one of these is like a different component. And so this summary one, there's this like use page is basically like getting data that was passed in by inertia.
Adam (29:01.504)
And so what the controller is basically like creating the stats object that contains all the stats for the entire interface. And then like within that stats object.
Adam (29:22.63)
there is going to be like a sub one for every component. like summary is an object that just contains the data for the summary section. And then like a books read is a object that just contains data for the books read component. And so the idea is that
Ste (29:35.424)
Wow.
Adam (29:47.916)
Later on, when we do the dashboard, we'll be able to reuse these same serializers and just pass this object in and then just pass that object in.
Ste (30:00.76)
That's neat. Because that's coming up. mean, the good part is that if we do stats dashboard is going to be like way easier, I guess.
Adam (30:03.028)
And yeah, but.
Adam (30:15.754)
Yeah, yeah, I think so. And, and yeah, there's a there's like a stats.
Adam (30:30.126)
Yeah, it's like the serializer. it's like, you know, every, so every one of these will just pass it into another object that contains like, so like, this is the books read serializer, which just has the books read and.
Ste (30:43.785)
Okay, that's like a Ruby way of like going through the objects, like the data.
Adam (30:51.788)
Yeah, and this I can fix to be length. so now this should change to like five.
Ste (31:01.217)
How much easier is to use like this Ruby workflow versus what's workflow we had with Next.js?
Adam (31:02.968)
Yeah.
Adam (31:10.186)
Man, it's so much nicer.
Adam (31:16.482)
Yeah, like I.
Adam (31:23.007)
Yeah, just like me, this little change and like, there you go. We fixed that thing that we just had.
Ste (31:29.491)
here we go.
Adam (31:30.73)
And all because we were able to just like change this function definition and yeah. then it serializes it down and we don't have to do basically anything in the JavaScript side. The JavaScript side is just presenting the data that Ruby organizes for us.
Ste (31:51.501)
So it was like way more comfortable. Yeah. Everybody's like talking about, especially like code refactors in the past few years, I feel like they've been getting like a lot of hits. Everyone says, okay, don't do a refactor. If you're doing a refactor, you're like spending time away from like building like real stuff, but like the ease of developing things. That's like the most important thing for.
the people building it. So yeah, I'm really glad you considered this to be like a good move, like working with it because like that's the most important thing. I plus I don't think we'd be able to pull this off with Next.js maybe at all or with like huge headaches probably.
Adam (32:41.25)
Yeah, I think one part that makes it really organized on the rail side is so we have this like.
Adam (32:56.91)
we have this stats service object that basically gets all the parameters. like, you know, we're getting stats for this user. These are the user privacy settings that the person viewing it should be able to access. So like, for instance, if you're viewing your own profile, you'll be able to see anything that's public, private, or followers only. If a...
follower of yours, if someone you follow is viewing it, this will contain like public and followers only, or if a guest or someone you're not following is viewing it, it'll just contain public. So this allows us to create this stat service and still limit what stats are shown to the ones that the user wants the person that's viewing it to be able to see. And then this object can then do, you know,
a ton of stuff, but it can do it all and it can cache it. So for instance, like some of these fields might use the same derived data, like, you know, pages read involves getting every book you've read, limiting it, filtering that down to ones that are of type book or ebook, and then summing the pages.
but that step of getting all the books you've read and filtering it down to ones that are of type book, like that'll be useful here. And so like, or, know, something else will be useful here. So doing all those calculations in this Ruby object means we'll be able to reuse those stats farther down. And I have a feeling as this goes farther and farther, we'll have to create fewer and fewer new methods to access that data. So.
I'm optimistic about it not taking too long and it'll get less long as things go on. In other words, not harder.
Ste (34:58.581)
Yeah, that's always a good way of things ending up. Yeah, this is great.
Adam (35:08.728)
Yeah, you've done such a great job on this. I'm excited about so much of this.
Ste (35:13.539)
Yeah, it's like a really thorough like pay stats, that's page we've added. I don't think we've shown that we've added some stats for like the countries we've got a map in further down and we also got like the series progress. This one we might have been over, but yeah, I think it paid off. mean, we've been talking about tests for what I think like three months now.
that's like a lot and not a lot thinking, you know, we'll be able to pull off this with like the code migration and everything. think, would you say like, this is the most complex part like of what we're doing with like calculating data on the side, maybe apart from lists or.
Adam (35:45.506)
Yeah.
Adam (36:08.962)
Yeah, yeah. It's going to be the most data intensive part, other than match percentage as a concept. But that part's kind of handled by a library anyways. So this one will be all custom.
Ste (36:23.009)
Yeah. Yeah. And let's be crazy that, you know, it's not using any chart libraries, not using, I'll be like curious to hear like when you get to the chart parts, like how easy it is to make sense of, well, what basically Claude did, because it's like mostly Claude, I just like tried to like walk you through.
Adam (36:39.726)
You
Ste (36:46.859)
like what I wanted in as much detail as I could. So I'm wondering, you know, for the actual visual parts, how easy it would be to edit them. But at the same time, it's exciting because we've had headaches with editing charts from the libraries, and it's way easier to... Apparently, it's way easier to do them from scratch now, so way more like...
Adam (36:54.638)
So yeah.
Adam (37:14.978)
Wow, yeah.
Adam (37:19.244)
Yeah, I'm definitely going to have to do a lot of code reading to wrap my head around what Claude did for some of these.
Ste (37:29.443)
Yeah. Well, I think it's like putting comments for most of them. So that's good. But yeah, for some, maybe not. Sometimes I ask it to do like stuff like when we had a tool tip. Apparently the tool tip didn't work in an SVG. So.
it either had to recreate the tool tip in some other way inside the SVG, or I just told it to approximate where that tool tip trigger would have to end up and overlay it over the SVG. So I'm curious if it did something. yeah, and this is a tool tip. This is actually like ShadCN. I added an extra tool tip. For these, I added some extra components where I thought it was...
where I couldn't figure out how to use our own components because they were tied to some data and they didn't do what I wanted. So I just grabbed some primitives. These are actual, like, ShadCN components that use Radix primitives. So...
Ste (38:49.483)
Yeah, they just use the library. They use our class names. So there might be, if you think some of them are extra, you can just delete them. But I think I have the simple select because I didn't know how to use our more complex select.
Adam (39:11.775)
Yeah.
Ste (39:12.219)
and the tool tip and a couple of others. So you might see some word components in there. It's a ShadCN. I should have sent you the link and this heads up before, probably. So it does not clog, fortunately.
Adam (39:25.442)
Nah.
Adam (39:28.943)
It works. And I don't think I even need to pass these in.
Ste (39:37.891)
Yeah, that was just like a way that I managed to have it to pass the period so that changes, but it might just work as a placeholder. Yeah, it can just as well work like that.
Adam (39:52.771)
Yeah.
I a curiosity. I haven't tried messing with the size parameter yet.
Ste (40:00.257)
So the size is like, XL is like, it uses like a four column grid. So XL is like the full four columns. MD is like two columns and SM is small, which is like just one column. So I'm using small for the, I think it's just for four stats, the ones that are really small, like further down in the page. Most of them are like full width.
It's actually the width. So this is like one column, MD is two columns. Yeah.
Adam (40:34.881)
I see. Cool.
Ste (40:37.795)
So I think it's similar to what approach we had on the dashboard, like the sizes, the different sizes. They just vary the, well, for the dashboard, this is different because they vary the rows and the columns.
Adam (40:58.668)
Yeah, yeah, that sounds good. yeah, call span one, two, three, four, Easy enough.
Ste (41:03.5)
Yeah, here we go.
Adam (41:07.148)
Yeah, I see how that'll be useful for like, yeah, these.
Ste (41:11.808)
Yeah, we have some side-by-side ones, and the only small ones are further down. And I don't think we're going to... Once you get to those, I think there was the average waiting time one, which we couldn't... I mean, we have to find a replacement for that.
Adam (41:18.138)
nice.
Adam (41:31.79)
Mm.
Adam (41:36.128)
Yeah, the one chart I'm kind of interested in bringing over, which isn't on here, is the genre and mood steam chart, which is a... Like doing that without Nevo, I'm a little bit concerned about.
Ste (41:59.967)
Yeah, we'll see if it doesn't work out. mean, we can just use Nevo. I've structured it.
Ste (42:11.341)
We could also bring these in. don't think there's like, if there's a good way of bringing these in, I was going to tell you that we can just merge them in because they're pretty interesting.
Adam (42:32.046)
For what? For you merge these two charts in?
Ste (42:36.107)
Yeah, the squiggly charts, yeah, with Nevo.
Adam (42:37.773)
Yeah.
Adam (42:41.27)
Yeah, I'm gonna try to see if we can do it without Nevo first and then if not, fall back on it. Because right now I've, I think I removed Nevo from even the projects dependencies.
Ste (42:47.103)
Yeah.
Ste (42:58.563)
No, okay. so you clean that up as well. Nice.
Adam (43:02.51)
Let's see, package. Yeah, it's completely gone right now.
But I added all the D &D kit and all the RADX ones that you had in here.
Ste (43:18.421)
Nice. Yeah, they might be useful for some stuff. mean, that list they're like clean and for sheds. Yeah. And you don't have to use a library. can just like, so it's not like creating any new dependencies. It's just like Radix stuff.
Adam (43:34.711)
Yeah, it's easy enough.
Adam (43:41.103)
One thing I was thinking as I was looking at this too was one other section that we could have, or it could be just maybe this eighth one over here, is on the user profile, we do some things about the user, like how long they've been around, their flair, librarian or not.
These three things are kind of clout based things that I could see being interesting to show off.
Ste (44:18.051)
Yeah, of course. We could do maybe a social slash user section where it could be days since they joined or maybe days since we have years in the...
Adam (44:35.458)
Yeah, we could.
Adam (44:41.26)
Yeah.
Ste (44:42.433)
We have years here, maybe, yeah, we do days on this stat. Days since they've been a librarian, if they are a librarian with this work, or maybe overkill.
Adam (45:02.51)
Yeah, I don't think we store that. And, but, there's also just like user ID, which is sometimes a fun thing. Like people have been sharing that on mastodon lately to like demonstrate how long they've been on mastodon. Like I have a, or someone saying like, I have a six user user ID. So I'm one of the first million people to join or things like that.
Ste (45:06.466)
Yeah.
Ste (45:26.229)
okay. so you mean like, yeah, yeah. actual like how, what number user are you? Like, are you like the 50th hardcover user, the 2000th hardcover user, this, right? Yeah, yeah, yeah. Let's write this down. I mean, I'm writing this down so I don't have to scour them in the, okay. Yeah. You take a note.
Adam (45:41.356)
Right.
Ste (45:53.776)
So yeah, user ID, they since they joined, maybe can we like calculate some social stats? I was thinking like number of users who have viewed your profile, readers who have viewed your profile or I mean, profile views basically, but I don't think, do we store that?
Adam (46:17.568)
We don't store that. was, I was considering making that like a supporter feature though. like there are a lot of, I think that's big in like the, like the dating app space. And I think that was a thing on, well, LinkedIn obviously, has like ability to see who viewed your profile. And then you could turn that as tick tock does it too. You could turn that option off if you want to be anonymous or you could.
Ste (46:19.427)
Hmm.
Ste (46:29.143)
Mm-hmm.
Ste (46:33.794)
Mm-hmm.
Adam (46:45.464)
have it on if you want to allow people to see it.
Ste (46:49.187)
If that works, yeah, for sure. I mean, it sounds like a cool feature. I would want to see who has viewed my profile. Definitely. It was maybe in, do I remember that right? That it was like in early Facebook, it was it like a thing? I mean, besides the poke.
Adam (47:12.549)
I don't remember that on Facebook, but maybe it was.
Ste (47:15.919)
Yeah, it might have been. I don't know. But yeah, it could be nice to show it as a notification and maybe on here as well. The actual number and maybe if you want to expand that, we go to the like, Expanding View where you can see, or we can open a model and...
have the model we're already using for seeing when you click Likes in the feed.
Adam (47:47.638)
yeah, yeah, because that's just a list of users.
Ste (47:51.213)
Yeah.
Adam (47:53.026)
Yeah, that could be neat.
Adam (47:57.068)
Yeah, I think, yeah.
Ste (47:57.738)
What else over here?
Ste (48:05.217)
What social like stats? Well, don't show like review likes or follows or no, actually you can see the followers. yeah.
Adam (48:21.41)
But yeah, we do show, wasn't there one for like most popular review? I know that maybe it just, yeah, yeah. Yeah, this one.
Ste (48:26.979)
Yeah, yeah, yeah, it's for the most popular one, but not the like the cumulative reviews or likes you had.
Adam (48:34.538)
and
Ste (48:40.34)
Not sure if it's gonna be like super helpful though.
Adam (48:43.872)
Yeah, that's, it's, it's one of those stats where it's like, it's neat, but it's yeah, it's like, how do you like, yeah.
Ste (48:51.075)
Yeah, doesn't tell you anything. If it's like 100 or 1000 or 10,000, it's like,
Adam (48:57.774)
Yeah, maybe it's just you liking 1,000 of your own reviews.
Ste (49:03.052)
Yeah, exactly.
Adam (49:10.54)
Yeah, and.
Adam (49:14.126)
Yeah, I was thinking about somehow indicating that the person is a supporter in like this first one.
Ste (49:25.715)
Yeah, I could make like a super cool like jewels badge like have it like extra extra nice and Just like stamp it, you know how we had like for the sticker we sent out to authors in year in books Something like that maybe or were you thinking just like I don't know
Adam (49:42.335)
Mm-hmm.
Ste (49:47.843)
Should we get creative or is it too much?
Adam (49:53.818)
I mean, we could just add like a bottom row like this, like saying, like, you know, at username is a supporter. So you will see like advanced stats or something like that. I mean, even having that like as a bottom row here.
Ste (50:08.055)
Yeah, yeah, yeah, yeah. We can do that, yeah.
Yeah, yeah, it's nice and subtle. Yeah.
Adam (50:16.812)
And it, one thing that it does too, is it, it advertises that like you're seeing an advanced version of stats when you're viewing this page. So even if like, you're not a supporter and you're viewing this person's page, it's going to let you know like, I'm seeing something that I don't see on my own profile. And this is why.
Ste (50:36.351)
Yeah, that's true. Yeah, it will make things clear because you might, I've actually gotten that on a network I was on recently. And yeah, I didn't know why I was seeing like that, those premium features and it wasn't like signal anywhere. So yeah, that'd be nice. Yeah, let's put the like, just like footer in there. And because you're right, if it's your profile, you get like,
that's bottom bar, but if you're viewing someone else's profile, you might be wondering, Hey, why don't I have the stats? yeah.
Adam (51:13.25)
you
Adam (51:22.447)
I that's about probably as much as I can, you know, nitpick what we have on these two so far. that's, at least we can cover it in one day.
Ste (51:32.204)
Yeah.
Yeah. No, this is perfect. And the cover, the ability to change your cover, that's like very, very nice. I know you got that in as well. I was waiting for that to happen. So you can, yeah, maybe some of these we can update. I was looking at some of the details on them and...
Adam (51:37.72)
Yeah, I've
Adam (51:44.642)
yeah.
Yeah.
Ste (52:01.98)
Yeah, I was going to use the newer models and I put the call for artists in again on the channel. Maybe we'll have some luck. here we go. Yeah, some are looking better than others. This is looking great. Yeah, I love this.
Adam (52:21.991)
Yeah, and you're able to select a cover from.
Adam (52:32.396)
Well, I haven't tried this feature yet. Let me see if it works. I just set it to my panoramic. I just showed you. no, I set it down to the panoramic.
Ste (52:39.983)
here we go. I'm curious. Whoa, this is so meta. It's like a background of stats in I'll actually put in the screenshot.
Adam (52:53.822)
Yeah, that's... I have no idea if this will work with that HEIC file. I'm never sure... I'm never sure what HEIC files can do exactly. Yeah, it doesn't like it.
Ste (53:01.622)
yeah, that's that one for a minute. Yeah.
Ste (53:08.415)
Yeah, same. I read at some point about them that Apple invented this really efficient file format and basically...
Ste (53:26.429)
They like optimize the hell out of it. But then because everybody was using WebP and like other picture formats, they were forced into, yeah, just having it for the iPhones. Nobody's sure what HEIC is.
Adam (53:46.968)
Yeah, I don't think I have really understood it either. see.
Ste (53:57.187)
This is working. here we go. Ooh, look at that.
Adam (54:02.894)
probably wouldn't use one with the door on the right, but other than that, it's a...
Ste (54:06.815)
And that's nice, gives a little bit of, you know, authenticity to the whole panorama. But yeah, zooming on those mountains. mean, those mountains are pretty like, pretty impressive. Here we go.
Adam (54:16.014)
You
Adam (54:22.87)
Yeah, that's what I'll miss most from this apartment is like this view and just like being in a rental where you don't have to worry about anything.
Ste (54:26.837)
Yeah.
Ste (54:32.803)
Yeah, how are you with like things around the house that are breaking or stuff like that? How much?
Adam (54:41.272)
I mean, I can screw something into the wall and drill a hole. And that's about my level of expertise.
Ste (54:54.801)
that's pretty advanced. I gives you like plenty of options if something breaks, you
Adam (55:02.146)
Yeah, as long as the thing I'm putting up isn't too heavy. I don't know about putting up a TV or something.
Ste (55:05.955)
you
Ste (55:09.423)
yeah. I wouldn't do that either. Yeah, that's good. Nice. Yeah, so this is like, we're at 80 % with the migration. So just like, not long to go. And once we get it out, it's going to be like someone asked us in Discord. So it's basically going to be like a shift, total shift to that.
Adam (55:15.31)
video.
Cool.
Ste (55:39.713)
So we won't like piecemeal it, just like movie gradually, just gonna shift to inertia and rails. Exciting.
Adam (55:39.8)
Yeah.
Adam (55:50.892)
Yeah, and I think with that will also come a change to the API because, or a change to how people authenticate with the API because right now, like you get a token and then you use that token on every API request. So we're gonna be changing to more of an OAuth flow where you create an app in the system.
and then you use that app to log in. So it's kind of the same way that every other site does it.
Ste (56:25.889)
Yeah, Facebook does it exactly like that. LinkedIn does it. yeah, those that I know of. And Google does it as well. Yeah. That's very nice because it will allow you to log in with HireCover as an OAuth, right? To other services. Like you log in with Google, you'd be able to log in with HireCover in the future.
Adam (56:33.506)
Yeah.
Adam (56:42.296)
Mm-hmm. Yeah.
Adam (56:49.698)
Yeah, you could. Someone could use it for that.
Ste (56:53.751)
That's, yeah, that's very, that's very exciting. I'm really waiting to like see, especially what was that prerequisite for open sourcing that whole word not related.
Adam (57:04.27)
not, not exactly a prerequisite, but it's more like our API right now is getting like hit and we don't have clear insights into who's using it and how they're using it. So it's more for. Like, like monitoring what we have today.
Ste (57:26.248)
Okay. Yeah.
Adam (57:28.014)
because yeah, then we'll be able to say like, this application, which could be have only one user, but it maybe it has a lot of users, but this application is doing X percent of the total database transactions or database usage. And so we'll be able to say like, this person's a spammer, we need to just disable this and then move on. Or this is a really cool app, let's work at the developer, see if they can.
Ste (57:44.419)
Okay.
Adam (57:57.926)
Maybe there are ways to optimize it. Maybe we can optimize things on RN to make their functionality faster. And yeah, it'll allow us to have better conversations around API usage.
Ste (58:09.783)
Yeah, that sounds super cool. Yeah, I'm very excited about that and about like the eventual open sourcing whenever that happens because it already seems like, you know, there's like lots of pieces falling in place. I know there are like a real some users, some some of our readers who are building like stuff.
on the side shout outs to the people on this board who are doing like so like valuable efforts to already build like stuff. Yeah.
Adam (58:30.958)
Hmm
Adam (58:39.638)
Yeah. Yeah. Billions like, whole like reader, like a co-reader for, like being able to track what you read automatically using co-reader is already really cool.
Ste (58:53.513)
Yeah, yeah, that's amazing. Yeah, shout out to you, William. That's very, that's very, that's very good. And yeah, I'm very excited to see how that becomes even more.
Ste (59:09.259)
Yeah, it grows even larger once we let people really contribute and...
Ste (59:20.117)
Yeah, build on top of what we're doing now, offer them the infrastructure.
Adam (59:26.456)
Yeah.
Well, I think I'll probably go and probably make it a little bit of a short day today since tomorrow is Thanksgiving here in the US.
Ste (59:30.028)
Nice.
Ste (59:39.254)
yeah, happy Thanksgiving. Yeah, yeah, it's tomorrow, right. Do you have prep to do? Like, are you gonna do prep?
Adam (59:43.073)
Yep. So.
We're going over to a friend's house. So we're just making like a couple of things. Like I'm making stuffing, mashed potatoes and gravy. at least nothing like Turkey, nothing that's like multiple hours of work.
Ste (59:51.107)
Mm.
Ste (59:57.129)
Nice. Okay. Well, Yeah, that's nice. It was on different dates last year, right? I think we had like the Turkey logo a few days before Thanksgiving, if anyone saw it on car cover.
Adam (01:00:15.928)
Mm-hmm.
Yeah.
Ste (01:00:20.779)
I noticed it and I was like, whoa, what is this? Why did it change? And I remembered, wait, we put in like the holiday logos last year, but I think we forgot to change the dates. Well, anyway, it was around this time.
Adam (01:00:29.262)
You
Yeah.
Adam (01:00:35.776)
Yeah, yeah, I think since it's like the fourth Thursday in November, maybe it's the last Thursday in November. One of those two.
Ste (01:00:45.155)
Okay. Okay, so it's actually one of those like jumping ones, the ones that like are variable. Okay, that's, yeah, that's not a variable. Okay, at least there's that. Nice, well, you have a very good like Thanksgiving and yeah, see everyone at the next Hardcover Live. Yeah, see ya.
Adam (01:00:52.642)
Yeah, always on a Thursday.
Adam (01:00:58.574)
you
Adam (01:01:09.181)
See ya. Bye.