Recycle Code

This week, I did some work on the Starchart project where I reuse existing codes to accomplish my tasks. It's always a neat feeling when I find out how I can leverage existing code to achieve a task.

No Duplicate CNAME!

The Starchart project allows user to easily create SSL certificate by taking care of a lot of required steps. Under a certificate, users can have multiple DNS Records.
By design, CNAME DNS Records forward you from one domain to another, so it makes little sense to have two CNAME DNS Records forwarding you from one same domain to two other domains at the same time.

Because of this, we need to prevent users from creating these kind of duplicate CNAME records.

A Small Restriction

I added a piece of code to achieve that:

  const count = await prisma.dnsRecord.count({     where: {       username,       type,       subdomain,       value: type === 'CNAME' ? undefined : value,     },   });  

The project already has some code to check for existing DNS records that are the same with the name, type, and value. Name is the subdomain name. Type is the type of record, such as CNAME. Value would be things like IP address or domain, depending on the type of DNS record.

Most of the relevant code already exist to check for count of duplicate DNS record, and I ended up adding a condition to not care about whether value is the same for CNAME records. As long as an existing CNAME record belongs to the same user and has same subdomain, another one counts as a duplicate. The value doesn't matter. These two criteria are chosen because username and subdomain name are used to create the domain name where a CNAME record would redirect people from, in this project.
Recall that we don't want to redirect from one domain to multiple domain. This is why we check for CNAME records with same user and subdomain.

It utilizes Prisma's count to do the counting in the database. where specifies what criteria for a row to count.

Re-request Certificate

Speaking of certificate, I also did a PR with a teammate together with peer programming, to add the ability for users to re-request a new certificate when it's about to expire.

What we did

The code checks for whether a certificate's validTo date is less than 30 days from present. If so, a re-request button will become available on the certificate page to allow the user to request another certificate.
Because we already have existing code to allow users to request their first certificate, we simply use/trigger that code again for the button.

Code Snippet for the button:

              <Flex justifyContent="flex-end">                 <Form method="post" onSubmit={() => setIsDisabled(true)}>                   <IconButton                     type="submit"                     aria-label="renew-certificate"                     icon={<RepeatIcon />}                     backgroundColor="transparent"                     color="black"                     _hover={{ backgroundColor: 'brand.500', color: 'white' }}                     isDisabled={isDisabled}                   />                 </Form>               </Flex> 

Because the certificate request code is under an action function build with remix.js, and it's triggered by submit, we simply make this new button submit to reuse that code.

We did found out a minor bug where the program was only recognizing the second newest certificate for a user, because the code was sorting certificates by validTo date in descending order, to fetch the newest one, but a really new one would not have that field filled out for a short period. This caused the new certificate to be placed at the bottom of the sorting and not be select as the current certificate.

Peer programming

It's interesting sitting with another developer to work on code together. You get tow different perspectives, and you can learn form each other, whether it's expertise with tools and languages, coding style, or new ideas.

Because I'm unfamiliar with the front-end of the project, it was very helpful to sit with another developer who is familiar with that area.
He walked me through how the area of the front-end code we wanted to work on is constructed, and we put our ideas together to figure out how to tackle the issue.