feat: templates, storage

src/pages/profile/components/public-key.tsx

@@ -0,0 +1,36 @@
+import { INPUT_WIDTH } from '@/constants';
+import { Textarea } from '@gpustack/core-ui';
+import { useIntl } from '@umijs/max';
+import { Button, Form } from 'antd';
+import React from 'react';
+
+interface PublicKeyFormData {
+  public_key?: string;
+}
+
+const PublicKey: React.FC = () => {
+  const intl = useIntl();
+  const [form] = Form.useForm<PublicKeyFormData>();
+
+  return (
+    <Form style={{ width: '524px' }} name="publicKeyForm" form={form}>
+      <Form.Item<PublicKeyFormData> name="public_key">
+        <Textarea
+          label="SSH 公钥"
+          placeholder="将您的 SSH 公钥粘贴到此处"
+          trim={false}
+          alwaysFocus
+          autoSize={{ minRows: 4, maxRows: 8 }}
+          style={{ width: INPUT_WIDTH.default }}
+        ></Textarea>
+      </Form.Item>
+      <Button type="primary" style={{ width: 120, marginTop: 100 }}>
+        {intl.formatMessage({ id: 'common.button.save' })}
+      </Button>
+    </Form>
+  );
+};
+
+PublicKey.displayName = 'PublicKey';
+
+export default PublicKey;

src/pages/profile/index.tsx

@@ -6,6 +6,7 @@ import styled from 'styled-components';
 import PageBox from '../_components/page-box';
 import Appearance from './components/appearance';
 import ModifyPasswordn from './components/modify-password';
+import PublicKey from './components/public-key';
 
 const Wrapper = styled.div`
   .ant-page-header-heading {
@@ -26,6 +27,11 @@ const Profile: React.FC = () => {
   const items: TabsProps['items'] = useMemo(() => {
     if (initialState?.currentUser?.source !== 'Local') {
       return [
+        {
+          key: 'public-key',
+          label: 'SSH Public Key',
+          children: <PublicKey />
+        },
         {
           key: 'appearance',
           label: intl.formatMessage({ id: 'common.appearance' }),
@@ -39,6 +45,11 @@ const Profile: React.FC = () => {
         label: intl.formatMessage({ id: 'users.form.updatepassword' }),
         children: <ModifyPasswordn />
       },
+      {
+        key: 'public-key',
+        label: 'SSH 公钥',
+        children: <PublicKey />
+      },
       {
         key: 'appearance',
         label: intl.formatMessage({ id: 'common.appearance' }),