Skip to content

Instantly share code, notes, and snippets.

@ngbrown
Last active April 9, 2024 20:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ngbrown/77c1d8c4f4e9d69871b7f325af2f6d1c to your computer and use it in GitHub Desktop.
Save ngbrown/77c1d8c4f4e9d69871b7f325af2f6d1c to your computer and use it in GitHub Desktop.
WebStorm Live Template for Remix
<templateSet group="Remix">
<template name="useFetcher" value="const $fetcher$ = useFetcher();" description="const fetcher = useFetcher()" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<variable name="fetcher" expression="" defaultValue="&quot;fetcher&quot;" alwaysStopAt="true" />
<context>
<option name="JS_CLASS_MEMBER_STATEMENT" value="false" />
<option name="JS_STATEMENT" value="true" />
<option name="TS_CLASS_MEMBER_STATEMENT" value="false" />
<option name="TS_STATEMENT" value="true" />
</context>
</template>
<template name="loader" value="export async function loader({ $args$ }: LoaderFunctionArgs) {&#10; return json($END$);&#10;}" description="export async function loader({}: LoaderFunctionArgs)" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<variable name="args" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="TS_TOP_LEVEL_STATEMENT" value="true" />
</context>
</template>
<template name="action" value="export async function action({ $args$ }: ActionFunctionArgs) {&#10; let error = false;&#10;&#10; $END$&#10;&#10; if (error) {&#10; return json({ error: true }, { status: 503 });&#10; }&#10;&#10; return redirect(&quot;$Path$&quot;);&#10;}" description="export async function action({}: ActionFunctionArgs)" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<variable name="Path" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="args" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="TS_TOP_LEVEL_STATEMENT" value="true" />
</context>
</template>
<template name="useActionData" value="const $data$ = useActionData&lt;typeof action&gt;();" description="const data = useActionData&lt;typeof action&gt;()" toReformat="true" toShortenFQNames="true">
<variable name="data" expression="" defaultValue="&quot;data&quot;" alwaysStopAt="true" />
<context>
<option name="TS_CLASS_MEMBER_STATEMENT" value="false" />
<option name="TS_STATEMENT" value="true" />
</context>
</template>
<template name="useLoaderData" value="const $data$ = useLoaderData&lt;typeof loader&gt;();" description="const data = useLoaderData&lt;typeof loader&gt;()" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<variable name="data" expression="" defaultValue="&quot;data&quot;" alwaysStopAt="true" />
<context>
<option name="TS_CLASS_MEMBER_STATEMENT" value="false" />
<option name="TS_STATEMENT" value="true" />
</context>
</template>
<template name="useSearchParams" value="const [searchParams, setSearchParams] = useSearchParams();" description="const [searchParams, setSearchParams] = useSearchParams()" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<context>
<option name="JS_CLASS_MEMBER_STATEMENT" value="false" />
<option name="JS_STATEMENT" value="true" />
<option name="TS_CLASS_MEMBER_STATEMENT" value="false" />
<option name="TS_STATEMENT" value="true" />
</context>
</template>
<template name="clientLoader" value="export async function clientLoader({&#10; request,&#10; params,&#10; serverLoader,&#10;}: ClientLoaderFunctionArgs) {&#10; $END$&#10; return await serverLoader();&#10;}" description="export async function clientLoader({}: ClientLoaderFunctionArgs)" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<context>
<option name="TS_TOP_LEVEL_STATEMENT" value="true" />
</context>
</template>
<template name="clientAction" value="export async function clientAction({&#10; request,&#10; params,&#10; serverAction,&#10;}: ClientActionFunctionArgs) {&#10; $END$&#10; return await serverAction();&#10;}" description="export async function clientAction({}: ClientActionFunctionArgs)" toReformat="true" toShortenFQNames="true" useStaticImport="true">
<context>
<option name="TS_TOP_LEVEL_STATEMENT" value="true" />
</context>
</template>
</templateSet>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment