> ## Documentation Index
> Fetch the complete documentation index at: https://developer.box.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Upload Files

export const Link = ({href, children, className, ...props}) => {
  const localizedHref = href;
  return <a href={localizedHref} className={className} {...props}>
      {children}
    </a>;
};

export const MultiRelatedLinks = ({sections = []}) => {
  if (!sections || sections.length === 0) {
    return null;
  }
  return <div className="space-y-8">
      {sections.map((section, index) => <RelatedLinks key={index} title={section.title} items={section.items} />)}
    </div>;
};

export const RelatedLinks = ({title, items = []}) => {
  const getBadgeClass = badge => {
    if (!badge) return "badge-default";
    const badgeType = badge.toLowerCase().replace(/\s+/g, "-");
    return `badge-${badge === "ガイド" ? "guide" : badgeType}`;
  };
  if (!items || items.length === 0) {
    return null;
  }
  return <div className="my-8">
      {}
      <h3 className="text-sm font-bold uppercase tracking-wider mb-4">{title}</h3>

      {}
      <div className="flex flex-col gap-3">
        {items.map((item, index) => <a key={index} href={item.href} className="py-2 px-3 rounded related_link hover:bg-[#f2f2f2] dark:hover:bg-[#111827] flex items-center gap-3 group no-underline hover:no-underline border-b-0">
            {}
            <span className={`px-2 py-1 rounded-full text-xs font-semibold uppercase tracking-wide flex-shrink-0 ${getBadgeClass(item.badge)}`}>
              {item.badge}
            </span>

            {}
            <span className="text-base">{item.label}</span>
          </a>)}
      </div>
    </div>;
};

<RelatedLinks
  title="REQUIRED GUIDES"
  items={[
{ label: translate("Setup"), href: "/guides/embed/box-view/setup", badge: "GUIDE" }
]}
/>

To generate a preview embed link for a file, the file must be uploaded to
Box. For most file types, conversion is triggered automatically upon upload.
However, for video and 3D files, it is triggered upon first preview. No explicit
action is required by the user to begin conversion. In either case, conversion
is triggered only once per file, and the generated assets are available for as
long as the original file is stored in Box.

## Uploading a File

To upload a file using the <Link href="/sdks-and-tools">Box SDKs</Link> or directly with
the APIs, you need to use the CCG or JWT Access Token that are generated
during <Link href="/guides/embed/box-view/setup">application setup</Link> to authenticate your
application.

<Card href="/guides/authentication/tokens/" arrow title="Authenticate your application" />

Once an authenticated client has been created, it may be used to upload files
directly to the application for conversion.

<Card href="/guides/uploads/direct/file" arrow title="Upload files to Box" />

<RelatedLinks
  title="RELATED GUIDES"
  items={[
{ label: translate("Create File Preview"), href: "/guides/embed/box-view/create-preview", badge: "GUIDE" }
]}
/>
