How Midday integrated link-sharing with analytics in a few lines of code with Dub.co

Midday is an all-in-one financial management platform that focuses on making business operations smarter by providing insights into a business' financials and streamlining activities like time-tracking and invoice management.

The challenge: Adding link sharing features with analytics

When Midday launched their time tracker view on X (formerly Twitter), they received a lot of great feedback from users – one of which that stood out was the ability to share tracked hours with their customers in real-time.

With this report, business owners can focus on what they do best instead of manually keeping their customers up to date with time reports.

To build this feature, Midday needed a solution that would allow them to:

• Programmatically create beautiful short links at scale
• Track click analytics in real-time
• Automatically expire links after a certain period
• Link cloaking to hide the actual destination URL

After evaluating different solutions, they decided to use Dub.co for their link-sharing needs.

The solution: Dub's TypeScript SDK for programmatic link creation

Dub's TypeScript SDK allowed Midday to programmatically create beautiful short links with just a few lines of code.

Since Midday was already using Next.js and Supabase for their tech stack, they were able to quickly implement this by adding a new create-report-action.ts function:

"use server";

import { action } from "@/actions/safe-action";
import { createReportSchema } from "@/actions/schema";
import { createClient } from "@midday/supabase/server";
import Dub from "dub";

const dub = new Dub({ workspaceId: "ws_xxx" });

export const createReportAction = action(
  createReportSchema,
  async (payload) => {
    const supabase = createClient();

    const { data } = await supabase
      .from("reports")
      .insert(payload)
      .select("*")
      .single();

    const link = await dub.links.create({
      url: `${params.baseUrl}/report/${data.id}`,
      rewrite: true,
      expiresAt: params.expiresAt,
    });

    return link;
  },
);

In this code snippet, Midday uses Next.js' Server Actions to:

1. Create a new report in their Supabase database
2. Generate a short link for that report using Dub's SDK
3. The short link is then returned to the user, who can share it with their customers

Because of how easy the implementation was, Midday was able to quickly roll out this feature on two more reports – Profit and Revenue reports:

To find more examples of how Midday use Dub, you can check out their GitHub repository below:

The results: Beautiful links with real-time analytics

Midday has a lot of features where files, activity reports, and other resources can be shared.

Previously, these links were secured by JWT tokens and were not very user-friendly to share with customers given how long they were.

With Dub's link infrastructure, not only were they able to generate beautiful short links at scale, but they also got access to real-time click analytics, which their users greatly appreciate.

Pontus Abrahamsso...

@pontusab

·

Feb 4

Link to tweet

Share Report - Profit/Loss * Generate URL with @dubdotco 🔗 * Interactive graphs 📈 * OG image using Satori from @shuding_ 🖼️

147

10

Midday also uses a go.midday.ai short link for their desktop app download command, which allows them to track the number of downloads and the source of the traffic:

"I highly recommend using Dub for all your public-facing links – whether it's your email signature or social profiles. Putting aside the argument of aesthetics, Dub gives you valuable click analytics that can help you understand your audience better – not to mention that you can easily update the destination URL for your links whenever you need."

Pontus Abrahamsson

Founder

The future of Midday x Dub

Midday has experienced a shift in their approach to links after implementing Dub. They now treat links as assets and utilize Dub to generate visual charts based on financial data. These charts can be easily shared with others, thanks to Dub's link infrastructure.

For example, their upcoming Midday AI feature will allow users to share financial insights with their customers in a visual format – easily shareable via a Dub-powered short link:

"We are super happy customers of Dub and recommend them to everyone that have links that they want to share. Also, the customer support is truly one of the best you can get."

Pontus Abrahamsson

Founder

Build your own link-sharing features with the Dub.co SDK

Want to build your own link-sharing features with Dub's TypeScript SDK? We created a simple template – affectionately dubbed dublet – to help you get started:

Have any questions? Feel free to send us an email or tweet at us – we'd love to help!